Javascript 在JSF组件中更新JS脚本中的数据模型

我正在使用库在页面上显示地图。出于我的目的，我将源代码替换为我的项目，并更改了组件

组成部分：

var#{mapVar}；
函数refreshMap（）{
如果（#{mapVar}==null）{
#{mapVar}=L.map（'#{cc.clientId}'{
中心：[{cc.map.center.latitude}，{cc.map.center.longitude}]，
拖动：#{cc.map.draggingEnabled}，
zoomControl:#{cc.map.zoomControl}，
缩放：#{cc.map.zoom}
});
}
用于（#{mapVar}.layers中的层）{
#{mapVar}.removeLayer（层）；
}
#{mapVar}.center=[{cc.map.center.latitude}，{cc.map.center.longitude}]；
#{mapVar}.draggingEnabled={cc.map.draggingEnabled}；
#{mapVar}.zoomControl={cc.map.zoomControl}；
#{mapVar}.zoom={cc.map.zoom}；
L.tileLayer（'http://{s}.tile.osm.org/{z}/{x}/{y}.png'{
id:'osm'，
属性：“#{cc.map.attribute}”，
maxZoom:#{cc.map.maxZoom}，
minZoom:#{cc.map.minZoom}
}).addTo（#{mapVar}）；
//层
var layer=#{layer.clusterEnabled}？新的L.MarkerClusterGroup({
disableClusteringAtZoom:#{layer.clusterDisableAtZoom}，
maxClusterRadius:#{layer.clusterMaxRadius}
})：新的L.图层组（）；
变量选项={
偏移量：空，
cssClass:“传单标签覆盖”
},
txt=新的L.LabelOverlay（[#{label.position.latitude}，#{label.position.longitude}），
“#{label.value}”，选项）；
#{mapVar}.addLayer（txt）；
layers.addTo（#{mapVar}）；
setTimeout（函数（）{
#{mapVar}.invalidateSize（）；
}, 300);
}
refreshMap（）；

和一页：

<h:form id="view_table">
    <p:panel id="mapa_panel" style="width: 500px; height: 500px;">
        <sys:mapAdvanced id="mapa" map="#{selectionsViewModel.map}" />
    </p:panel>
    <p:commandButton value="Update" type="submit" action="#{selectionsViewModel.update()}" update="view_table-mapa"/>
</h:form>

在

选择ViewModel.update（）

中，我更改数据模型并调用

刷新映射（）

以更新映射组件。我在浏览器的调试器中检查了placescript-in-div和out-div之间的差异。这两种情况都会在响应操作系统中返回正确的html和新数据。但在更新了我的组件后，我从页面上消失了。

我明白了我的错误。 首先，脚本实际上应该在div内部，因为外部更新引用了divid。 第二，执行js代码，但chrome调试器不知何故并没有在断点处停止。我将更新地图更改为：

旧的：

新的：

现在，一切正常

<h:form id="view_table">
    <p:panel id="mapa_panel" style="width: 500px; height: 500px;">
        <sys:mapAdvanced id="mapa" map="#{selectionsViewModel.map}" />
    </p:panel>
    <p:commandButton value="Update" type="submit" action="#{selectionsViewModel.update()}" update="view_table-mapa"/>
</h:form>

if (#{mapVar} == null) {
    #{mapVar} = L.map('#{cc.clientId}',
                        {center: [#{cc.map.center.latitude}, #{cc.map.center.longitude}],
                        dragging: #{cc.map.draggingEnabled},
                        zoomControl: #{cc.map.zoomControl},
                        zoom: #{cc.map.zoom}});
}
for (layer in #{mapVar}.layers) {
    #{mapVar}.removeLayer(layer);
}

if (#{mapVar} != null) {
    #{mapVar}.remove();
}