Leaflet如何在同一图层组中组合图标和圆圈标记

时间:2015-07-07 22:08:35

标签: javascript arrays object leaflet geocoding

我有一堆坐标要添加到Leaflet地图上。标有值“home”的坐标将获得类似home的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);

  }

1 个答案:

答案 0 :(得分:0)

你有没有检查过你的&#34; poiTag&#34; excist /拼写正确吗? 你能提供数据的例子

吗?
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}));
}