It's always been fascinating working with Geographic Information Systems, mainly seeing the advacements from Google Maps, OpenstreetMaps and others. The challenge is to build solution to a problem geographically, which could ease the user who wants to find solution w.r.t to his/her Geocapture.
The idea in this blog is certainly trying to incorporate what was seen in Leaflet basic introduction . The blog explores how a plugin can be incorporated well for our basic needs. In this case the need is how you want to see your Geo-capture (data containing geographical inforamtion with some attributes, eg: Shapefiles). Instead of using a open source tool or online tool, the idea of designing your own tool is more satisfying.
Let's start over to the step by step process of building a Map Viewer using Leaflet
// Basemaps
var topographic=L.esri.basemapLayer("Topographic").addTo(map);
var Esri_WorldImagery = L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'}).addTo(map);
// Mapview control
var baselayers = {
"Topographic" : topographic
"GoogleEarth" : Esri_WorldImagery
};
L.control.layers(baselayers).addTo(map);
// Shapefile control
L.control.shapefile({ position: 'topleft' }).addTo(map);
If you have followed the steps correctly, you should get the final screenshot with the uploaded shapefile image content in
The map viewer is designed using Leaflet. The user needs to upload his/her Shapefile in .zip format. The end result is a map view of the Geo captured information in the .zip file.
Live demo here