传单地图:点击更改所有标记的颜色
Leaflet map: on click changing color of all markers
我肯定缺少一些 js 语法来实现这一点,但硬谷歌搜索并没有让我得出任何结论。
我想在点击时切换标记颜色。我将精灵预定义为变量 "greenIcon" 和 "defaultIcon"。一切都适用于单个标记,我可以用这个来回切换它:
.on('click', function(e) {
if (this.getIcon() != greenIcon) {
this.setIcon(greenIcon);
} else {
this.setIcon(defaultIcon);
}
})
就这么简单。我想要实现的是,在点击一个标记时,其他标记变为 "defaultIcon",并且只有这个标记会切换。除了所示示例中的 "this." 之外,还有什么我可以使用的吗?比如,all.setIcon(defaultIcon)?
我的标记属性在 var 数组中定义,名为 "points":
var points = [
{latlng: [54.351194, 18.654101], title: "F-225", name: "Marker 1"},
{latlng: [54.351194, 18.658101], title: "F-226", name: "Marker 2",
];
points.forEach(function(p) {
L.marker(p.latlng, {
title: p.title, riseOnHover: true
})
.addTo(map)
.on('click', function(e) {
// all.setIcon(defaultIcon);
})
.bindPopup(popupName);
});
提前致谢!
添加标记时将它们推入数组。 const markers = []
在开头的某个地方并且 than markers.push(L.marker(...
如果您向点添加某种唯一键,则可以通过遍历数组或单个数组来操作所有内容。您也可以使用 this
访问当前版本。
我编辑了fiddle,请检查link。
我肯定缺少一些 js 语法来实现这一点,但硬谷歌搜索并没有让我得出任何结论。
我想在点击时切换标记颜色。我将精灵预定义为变量 "greenIcon" 和 "defaultIcon"。一切都适用于单个标记,我可以用这个来回切换它:
.on('click', function(e) {
if (this.getIcon() != greenIcon) {
this.setIcon(greenIcon);
} else {
this.setIcon(defaultIcon);
}
})
就这么简单。我想要实现的是,在点击一个标记时,其他标记变为 "defaultIcon",并且只有这个标记会切换。除了所示示例中的 "this." 之外,还有什么我可以使用的吗?比如,all.setIcon(defaultIcon)?
我的标记属性在 var 数组中定义,名为 "points":
var points = [
{latlng: [54.351194, 18.654101], title: "F-225", name: "Marker 1"},
{latlng: [54.351194, 18.658101], title: "F-226", name: "Marker 2",
];
points.forEach(function(p) {
L.marker(p.latlng, {
title: p.title, riseOnHover: true
})
.addTo(map)
.on('click', function(e) {
// all.setIcon(defaultIcon);
})
.bindPopup(popupName);
});
提前致谢!
添加标记时将它们推入数组。 const markers = []
在开头的某个地方并且 than markers.push(L.marker(...
如果您向点添加某种唯一键,则可以通过遍历数组或单个数组来操作所有内容。您也可以使用 this
访问当前版本。
我编辑了fiddle,请检查link。