D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
TheMapSmith
Full window
Github gist
Awesome vector tiles
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> <title>Mystery Retro Vector tiles</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } #esri_widgets_Attribution_0 { display: none; } #viewDiv > div > div.esri-ui > div.esri-ui-inner-container.esri-ui-corner-container > div.esri-ui-top-left.esri-ui-corner { display: none; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.0/esri/css/main.css"> <script src="https://js.arcgis.com/4.0/"></script> <script> require([ "esri/Map", "esri/views/MapView", "esri/layers/VectorTileLayer", "dojo/domReady!" ], function(Map, MapView, VectorTileLayer) { // Create a Map var map = new Map(); // Make map view and bind it to the map var view = new MapView({ container: "viewDiv", map: map, center: [-100.33, 25.69], zoom: 4 }); /******************************************************************** * Add a tile layer to the map * * The url property must either point to the style as * demonstrated below or to the URL of a Vector Tile service * such as: * https://basemaps.arcgis.com/b2/arcgis/rest/services/World_Basemap/VectorTileServer *********************************************************************/ var tileLyr = new VectorTileLayer({ url: "https://www.arcgis.com/sharing/rest/content/items/763884983d3544c0a418a97992881fce/resources/styles/root.json?f=pjson" }); map.add(tileLyr); }); </script> </head> <body> <div id="viewDiv"></div> </body> </html>
https://js.arcgis.com/4.0/