Question

如何在地图框中添加自定义图标？

var map = L.mapbox.map('map', 'mapbox.streets').setView([0, 0], 1);
  var geojson = { type: 'LineString', coordinates: value};

  var start = value[0];
  var end = value[value.length-1];

  geojson.coordinates.push((start,end).slice());

  // Add this generated geojson object to the map.
  L.geoJson(geojson).addTo(map);

  // Create a marker and add it to the map.
  var marker = L.marker(end, {        
    icon: L.mapbox.marker.icon({
      "iconUrl": "https://www.mapbox.com/mapbox.js/assets/images/astronaut2.png"
    })
  }).addTo(map);
});

我无法在上面的代码中添加自定义图标。请帮帮我..
感谢。

Answer 1

首先，您必须创建一个var，例如＆＃39; myIcon＆＃39;，然后只需将iconUrl替换为指定您要使用的自定义标记的路径。

您可以使用iconSize选项指定标记的大小您可以使用iconAnchor选项指定掩码的哪个部分应放在latlng上。

myIcon=L.icon({
    iconUrl:'img/custom-marker.png',
    iconSize: [25,30]
});

然后创建标记，将lat lng设置在您希望放置标记的位置。并指定要使用的图标。

var Marker = new L.Marker ( latlng, {icon:myIcon});

最后将您的市场添加到地图中：

map.addlayer（标记）;

mapbox中的图标网址

1 个答案: