I already have a Leaflet map showing custom base map tiles in British OSGB projection, EPSG:27700 (using the Proj4Leaflet plugin).
I would like to overlay some nationwide admin boundary data in the same projection in a GeoJson layer. I see that using a GeoJson in standard EPSG:4326 can be used - I guess Leaflet re-projects it on the fly?
I'd like to optimise the rendering by:
Searching around I see a reference to using the "coordsToLatLng" but not sure how it's used. Here is the code I end up with:-
var geojsonLayer = new L.GeoJSON.AJAX("testlayer_p27700.geo.json", { coordsToLatLng: function (newcoords) { return (map.unproject([newcoords[1], newcoords[0]], map.getMaxZoom())); }, style: { weight: 1, opacity: 1, color: '#ECECEC', fillOpacity: 0.4, fillColor: '#FF0000' }});geojsonLayer.addTo(map);This gets rid of the JS errors and the GeoJson overlay is displayed BUT NOT correctly - it is rotated 90 degrees clockwise to the base map and the SW point is in the NW location(!)
Any advice much appreciated!
أكثر...
I would like to overlay some nationwide admin boundary data in the same projection in a GeoJson layer. I see that using a GeoJson in standard EPSG:4326 can be used - I guess Leaflet re-projects it on the fly?
I'd like to optimise the rendering by:
- Using TopoJson (reduced file size)
- Make the TopoJson/GeoJson into EPSG:27700 projection so Leaflet does not need to re-project
Searching around I see a reference to using the "coordsToLatLng" but not sure how it's used. Here is the code I end up with:-
var geojsonLayer = new L.GeoJSON.AJAX("testlayer_p27700.geo.json", { coordsToLatLng: function (newcoords) { return (map.unproject([newcoords[1], newcoords[0]], map.getMaxZoom())); }, style: { weight: 1, opacity: 1, color: '#ECECEC', fillOpacity: 0.4, fillColor: '#FF0000' }});geojsonLayer.addTo(map);This gets rid of the JS errors and the GeoJson overlay is displayed BUT NOT correctly - it is rotated 90 degrees clockwise to the base map and the SW point is in the NW location(!)
Any advice much appreciated!
أكثر...