How to use circle markers with Leaflet-Tilelayer-Geojson -
i using leaflet-tilelayer-geojson load points on map , working well. want use leaflet circlemarkers instead of default blue icons can't find examples of how this. how use circlemarkers leaflet-tilelayer-geojson?
my code loading points far simple:
var geojsonurl = 'myurl/{z}/{x}/{y}.geojson'; var geojsontilelayer = new l.tilelayer.geojson(geojsonurl, { }, { oneachfeature: function (feature, layer) { layer.on('click', function(e) { $("#overlay").html('<img src="gifurl"/>') .load("url+feature.properties.url); }); } } ); map.addlayer(geojsontilelayer);
thank you
i'm working on same thing web app. first suggestion use pointtolayer: http://leafletjs.com/reference.html#geojson-options
var geojsonmarkeroptions = { radius: 8, fillcolor: "#ff7800", color: "#000", weight: 1, opacity: 1, fillopacity: 0.8 }; l.geojson(somegeojsonfeature, { pointtolayer: function (feature, latlng) { return l.circlemarker(latlng, geojsonmarkeroptions); } }).addto(map);}
what interpret mean, explained @ https://github.com/glenrobertson/leaflet-tilelayer-geojson, approximate result:
var geojsonurl = 'myurl/{z}/{x}/{y}.geojson'; var geojsonmarkeroptions = { radius: 8, fillcolor: "#ff7800", color: "#000", weight: 1, opacity: 1, fillopacity: 0.8 }; var geojsontilelayer = new l.tilelayer.geojson(geojsonurl, { }, { pointtolayer: function (feature, latlng) { return l.circlemarker(latlng, geojsonmarkeroptions); }, oneachfeature: function (feature, layer) { layer.on('click', function(e) { $("#overlay").html('<img src="gifurl"/>') .load("url+feature.properties.url); }); } } ); map.addlayer(geojsontilelayer);
Comments
Post a Comment