说明如何在同一图层组中组合图标和圆形标记



我有一堆坐标添加到一张传单地图。坐标标记的值"家"将得到一个家一样的svg图标,并被存储在homeIcons变量。所有其他坐标将得到一个圆形标记,并存储在变量circles中。我目前的方法只成功地将circles转化为适当的小叶对象,而不是homeIcons。因此,当我使用L.layerGroup()将它们合并到一个图层组时,"homeIcons"中的对象就被删除了。请让我知道,如果你看到我的代码的问题在哪里。谢谢你!

    var circles = [];
    var homeIcons = [];
    var markerOptions = {
      radius      : 10,
      fillColor   : 'yellow',
      color       : 'null',
      weight      : 1,
      opacity     : 1,
      fillOpacity : 0.8
    };
    var homeIcon = L.icon({
      iconUrl: 'public/imgs/home_icon.svg',
      iconSize     : [30, 30],
      iconAnchor   : [8, 18],
      popupAnchor  : [0, -15],
    });
    var homeMarker = L.marker([null, null], {icon: homeIcon, opacity: 1});
    for (var i=0; i<data.length; i++) {
      var pois = JSON.parse(data[i].POIs);
      for (var n=0; n<pois.length; n++) {
        homeMarker = {latlng:[pois[n].lat, pois[n].lng], name: data[i].Name}; 
        if (pois[n].poiTag == "home") {
        homeIcons.push(L.marker(homeMarker));
        } else {
        circles.push(L.circleMarker([pois[n].lat, pois[n].lng], markerOptions, {name: data[i].Name}));
        }
      }
    }
    console.log(circles);    // Outputs an array of leaflet objects
    console.log(homeIcons);  // Not outputing an array of objects with similar properties as leaflet objects
    var allLayers = L.layerGroup(circles, homeIcons);  // this is supposed to add both circles to homeIcons to the layergroup
    console.log(allLayers);  // By here, all the homeIcons have disappeared.
    cb(allLayers);
  }

你检查过你的"poiTag"是否存在/拼写正确吗?能否提供数据示例

if (pois[n].poiTag == "home") {
  homeIcons.push(L.marker(homeMarker));
 } else {
  circles.push(L.circleMarker([pois[n].lat, pois[n].lng], markerOptions, {name: data[i].Name}));
}

最新更新