D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
ThomasG77
Full window
Github gist
Sample Leaflet with GeoJSON
<html> <head> <title>A Leaflet map!</title> <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin="" /> <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script> <style> #map{ height: 100% } </style> </head> <body> <div id="map"></div> <script> // initialize the map var map = L.map('map').setView([42.35, -71.08], 3); // load a tile layer L.tileLayer('https://tiles.mapc.org/basemap/{z}/{x}/{y}.png', { attribution: 'Tiles by <a href="https://mapc.org">MAPC</a>, Data by <a href="https://mass.gov/mgis">MassGIS</a>', maxZoom: 17, minZoom: 9 }).addTo(map); // load GeoJSON from an external file fetch("countries.geojson").then(res => res.json()).then(data => { // add GeoJSON layer to the map once the file is loaded L.geoJson(data).addTo(map); }); </script> </body> </html>
https://unpkg.com/leaflet@1.7.1/dist/leaflet.js