0

I have got a .json file to display in Leaflet map.
The points are shown with custom blue dot markers. I cannot get to change them.
How do I get to change the symbol?

var greenIcon = L.icon({
  iconUrl: 'marker-shadow.png',
  iconSize: [38, 95] // size of the icon
}); 

var jsonTest = new L.GeoJSON.AJAX(["colleges.geojson"],{onEachFeature:popUp},{icon:greenIcon});
var jsonTest1 = jsonTest.addTo(m);
0

You need to use the pointToLayer option (and mind your syntax).

var jsonTest = new L.GeoJSON.AJAX(["colleges.geojson"],{ //options object for GeoJSON
  pointToLayer: function(geoJsonPoint, latlng) {
    return L.marker(latlng, { icon: greenIcon }); //options object for Marker
  },
  onEachFeature:popUp
});
  • Is there any edits remaining or I shall copy paste the code? – Timilsina Aashish Dec 28 '18 at 12:57
  • 1
    You should try to understand what the code does. – Stefan Dec 28 '18 at 13:01
  • Thank You.. It worked. just need edit in {onEachFeature:popUp}. Would you please up-vote question??? – Timilsina Aashish Dec 28 '18 at 13:26
  • Glad to be able to help! Upvoting your question doesn't feel fair to me because there are questions that show noticeably more research effort than yours. – Stefan Dec 28 '18 at 13:30
  • As to your proposed edit: You cannot pass two options objects to L.GeoJSON.AJAX(...). Please have a look at this example. – Stefan Dec 28 '18 at 14:11

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.