问题
How to add a custom icon in mapbox?
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);
});
I can't able to add a custom icon in above code. Please help me..
Thanks.
回答1:
First you will have to create a var, for example 'myIcon', then simply replace the iconUrl with a path that specifies the custom marker you want to use.
You can use the iconSize option to specify the size of your marker You can use the iconAnchor option to specify which part of your masker should be placed on the latlng.
myIcon=L.icon({
iconUrl:'img/custom-marker.png',
iconSize: [25,30]
});
Then create the marker, set the lat lng where you want your marker to be placed. And specify the icon you want to use.
var Marker = new L.Marker ( latlng, {icon:myIcon});
Finally add your market to the map:
map.addlayer(Marker);
来源:https://stackoverflow.com/questions/31265496/icon-url-in-mapbox