Checkbox 为什么我的控件复选框未选中？_Checkbox_Leaflet_Controls

Checkbox 为什么我的控件复选框未选中？

checkbox leaflet

Checkbox 为什么我的控件复选框未选中？,checkbox,leaflet,controls,Checkbox,Leaflet,Controls,我创建了一个带有一些多边形、标记和复选框的控件的地图。所有数据都从geojson文件中读取。当我尝试在一个控制组中收集某些几何体对象时，未选中复选框。在本例中，使用第二个复选框时，前三个标记和多边形应同时显示/消失如果第一次手动选中复选框，则所有工作正常。如果我对每个几何体对象使用一个复选框（这不是我的意图），它也可以正常工作。具有相同feature.property.control的几何体对象应一起反应。您可以在这里看到示例：（请使用全屏） "严格使用",； var BING_KEY=“

我创建了一个带有一些多边形、标记和复选框的控件的地图。所有数据都从geojson文件中读取。当我尝试在一个控制组中收集某些几何体对象时，未选中复选框。在本例中，使用第二个复选框时，前三个标记和多边形应同时显示/消失

如果第一次手动选中复选框，则所有工作正常。如果我对每个几何体对象使用一个复选框（这不是我的意图），它也可以正常工作。具有相同feature.property.control的几何体对象应一起反应。您可以在这里看到示例：（请使用全屏）


"严格使用",；
var BING_KEY=“APLTRT4UZWLMFCERFQU_NqDycERC_Er0qGYzZhIqrDfq-naYCsUr1kbbKRUqhq1”；
var osmUrl='https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'；
功能显示卡丁车（div\u id、mittelpunk、缩放、叠加）{
var osmLayer=L.tileLayer（osmUrl，{maxZoom:20，属性：'Map data©；contributors'，}）；
var mittelpunkt=[mittelpunkt[1]，mittelpunkt[0]]
var map=L.map（div_id，{fullscreenControl:true，layers:[osmLayer]}）；
var-controlGroup={}；
var lastControl={}；
var controls=L.control.layers（null，controlGroup.addTo（map）；
功能onEachFeature（功能，层）{
图层。添加到（地图）；
if（feature.properties.control！=null）
{if（feature.properties.control！=lastControl）
{controlGroup={}；
controlGroup=L.layerGroup（）；//auch L.FeatureGroup（）
controlGroup.addLayer（层）；
addOverlay（controlGroup，feature.properties.control）；
//addOverlay（图层、特征、属性、控件）；
}
其他的
{controlGroup.addLayer（层）；
};
lastControl=feature.properties.control；
};
};
$.ajax（覆盖）.done（函数（数据）{
var data=JSON.parse（数据）；
L.geoJson（数据、，
{onEachFeature:onEachFeature
});
});
L.control.scale（{imperial:false，位置：“topleft”}）.addTo（地图）；
};  
展示卡丁车（“地图”[6.026173,50.816022]，13“../wind/neueFlaechen.geojson”）；

函数onEachFeature中缺少controlGroup.addTo（映射）

<html>
<head>
<link rel="stylesheet" href="../js/Leaflet/leaflet.css" >
<script src="../js/Leaflet/leaflet.js" ></script>
<script src="../js/Leaflet/leaflet-bing-layer.min.js"></script>
<script src="../js/Leaflet/jquery-3.3.1.min.js"></script>
<script src="../js/Leaflet/Leaflet.fullscreen.min.js"></script>
<link href="../js/Leaflet/leaflet.fullscreen.css" rel="stylesheet" >
<script>
'use strict';
var BING_KEY = "AplTrT4uzwlmfcERFFQu_NqDycERC_Er0qGYzZhIqrDfq-naYCsUr1kbbKRUqhq1";
var osmUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';

function show_karte(div_id, mittelpunkt, zoom, overlay){
var osmLayer = L.tileLayer(osmUrl, {maxZoom: 20, attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>'});
var mittelpunkt = [mittelpunkt[1], mittelpunkt[0]]
var map = L.map(div_id,{fullscreenControl: true, layers: [osmLayer]}).setView(mittelpunkt, zoom);

var controlGroup = {};
var lastControl = {};
var controls = L.control.layers(null, controlGroup).addTo(map);

function onEachFeature(feature, layer) { 
    layer.addTo(map); 
    if (feature.properties.control != null)
            {if (feature.properties.control != lastControl)
                {controlGroup = {};
                 controlGroup = L.layerGroup(); // auch L.FeatureGroup()
                 controlGroup.addLayer(layer);
                 controls.addOverlay(controlGroup, feature.properties.control);
                 //controls.addOverlay(layer, feature.properties.control);
                }
                else
                {controlGroup.addLayer(layer); 
                };
                lastControl = feature.properties.control;
            };
    };

$.ajax(overlay).done(function(data) {
    var data = JSON.parse(data);
    L.geoJson(data, 
            {onEachFeature: onEachFeature
            });
    });

L.control.scale({imperial: false, position: "topleft"}).addTo(map);
};  
</script>
</head>

<body>
<div id="map" style="width:450px; height: 700px;">
<script  type="text/javascript"> show_karte("map",[6.026173,50.816022],13,"../wind/neueFlaechen.geojson"); </script>
</div>
</body>
</html>