Leaflet 和 Leaflet-search:resetStyle 无法清除地图上的高亮显示,似乎 "not a function"
Leaflet and Leaflet-search: resetStyle does not work to clear highlights on a map, and appears to be "not a function"
我正在为在特定位置发现的科学数据创建地图。我已经为每个位置创建了独立的 geoJSON 文件(多边形)和变量,并将它们加载到我的传单地图中,因为我想独立地将图表附加到每个位置的弹出窗口中。
为了允许传单搜索工作,我创建了一个新图层组并将所有位置变量添加到该组中,这允许我搜索位置、放大它并突出显示它。
当我尝试删除突出显示时出现了问题,因为 resetStyle 函数不起作用并且在控制台中显示为“Uncaught TypeError: featuresLayer.resetStyle is not一个功能”。当我将所有位置作为单个 geoJSON 文件导入时,我没有遇到任何问题,但我不知道如何为每个位置独立附加图表。
我也尝试过使用将颜色从默认更改为绿色的代码,再恢复为默认,但这也失败了,我收到了类似的错误:“未捕获的类型错误:无法读取 属性 'setStyle' 未定义
我附上相关代码如下:
var featuresLayer = L.layerGroup([location137, location174, location282, location592, location1234, location1303, location1326, location1350, location1364, location1397, location1407, location1521, location1530, location1535, location1576, location1623, location1729, location1731, location1738, location1790, location1804, location1865, location1963, location2090, location2108, location2283, location2307, location2317, location2361, location2386, location2387, location2478, location2490, location2508, location2615, location2718, location2828, location2843, location2867, location2929, location2945]).addTo(map)
var searchbar = new L.Control.Search({
position:"topright",
layer: featuresLayer,
propertyName: "name",
marker: false,
textPlaceholder: "Search",
moveToLocation: function(latlng, title, map) {
map.setView(latlng, 8); // access the zoom
}
});
searchbar.on('search:locationfound', function(e) {
e.layer.setStyle({fillColor: '#3f0', color: '#0f0'});
}).on('search:collapsed', function(e) {
featuresLayer.eachLayer(function(layer) {
featuresLayer.resetStyle(layer);
});
});
map.addControl(searchbar);
resetStyle
仅使用 geoJSON 组。
尝试:
var style = {
weight: 3,
opacity: 1,
fill: false,
color: "#3388ff",
fill: false,
fillColor: null,
fillOpacity: 0.2
}
featuresLayer.eachLayer(function(layer) {
layer.setStyle(style);
});
我正在为在特定位置发现的科学数据创建地图。我已经为每个位置创建了独立的 geoJSON 文件(多边形)和变量,并将它们加载到我的传单地图中,因为我想独立地将图表附加到每个位置的弹出窗口中。
为了允许传单搜索工作,我创建了一个新图层组并将所有位置变量添加到该组中,这允许我搜索位置、放大它并突出显示它。
当我尝试删除突出显示时出现了问题,因为 resetStyle 函数不起作用并且在控制台中显示为“Uncaught TypeError: featuresLayer.resetStyle is not一个功能”。当我将所有位置作为单个 geoJSON 文件导入时,我没有遇到任何问题,但我不知道如何为每个位置独立附加图表。
我也尝试过使用将颜色从默认更改为绿色的代码,再恢复为默认,但这也失败了,我收到了类似的错误:“未捕获的类型错误:无法读取 属性 'setStyle' 未定义
我附上相关代码如下:
var featuresLayer = L.layerGroup([location137, location174, location282, location592, location1234, location1303, location1326, location1350, location1364, location1397, location1407, location1521, location1530, location1535, location1576, location1623, location1729, location1731, location1738, location1790, location1804, location1865, location1963, location2090, location2108, location2283, location2307, location2317, location2361, location2386, location2387, location2478, location2490, location2508, location2615, location2718, location2828, location2843, location2867, location2929, location2945]).addTo(map)
var searchbar = new L.Control.Search({
position:"topright",
layer: featuresLayer,
propertyName: "name",
marker: false,
textPlaceholder: "Search",
moveToLocation: function(latlng, title, map) {
map.setView(latlng, 8); // access the zoom
}
});
searchbar.on('search:locationfound', function(e) {
e.layer.setStyle({fillColor: '#3f0', color: '#0f0'});
}).on('search:collapsed', function(e) {
featuresLayer.eachLayer(function(layer) {
featuresLayer.resetStyle(layer);
});
});
map.addControl(searchbar);
resetStyle
仅使用 geoJSON 组。
尝试:
var style = {
weight: 3,
opacity: 1,
fill: false,
color: "#3388ff",
fill: false,
fillColor: null,
fillOpacity: 0.2
}
featuresLayer.eachLayer(function(layer) {
layer.setStyle(style);
});