Question

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

如果第一次手动选中了复选框，则一切正常。如果我对每个几何对象都使用一个复选框（这不是我的意图），它也可以正常工作。具有SAME feature.property.control的几何对象应该一起反应。您无法在此处看到示例：https://aachen-hat-energie.de/test_ww/test_control.htm（请使用全屏显示）

<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>

Answer 1

onEachFeature函数中缺少controlGroup.addTo（map）。

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

1 个答案: