我试图在我的Leaflet Map中应用pointTolayer,但是它仍然抛出经典图标。代码中有错误。

$.getJSON("https://gist.githubusercontent.com/vassilaros/3791204ca226d5b236b4cd3106ef23cf/raw/PicnicSites.geojson",function(data){

    var baseline_person = L.icon({
          iconUrl: 'baseline_person.png',
          iconSize: [18,18]
    });

    // add GeoJSON layer to the map once the file is loaded
    L.geoJson(data, {
         pointTolayer: function(feture, latlng){
                    return L.marker(latlng,{icon: baseline_person});
         }
   }).addTo(map);
});

最佳答案

您的L.geoJson应分别为L.geoJSONpointTolayer应为pointToLayer

然后将iconSize和iconAnchor定义为L.icon参数

const customMarker = new L.icon({
  iconUrl: "marker.png",
  iconSize: [32, 32],
  iconAnchor: [10, 41],
});

axios
  .get(
    "https://gist.githubusercontent.com/vassilaros/3791204ca226d5b236b4cd3106ef23cf/raw/PicnicSites.geojson"
  )
  .then(response => {
    L.geoJSON(response.data, {
      pointToLayer: (feature, latlng) => {
        return L.marker(latlng, { icon: customMarker });
      }
    }).addTo(map);
  });


Demo

关于javascript - 我的传单 map 中的pointTolayer问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/55761518/

10-10 05:34