Skip to content

Instantly share code, notes, and snippets.

@TheMapSmith

TheMapSmith/index.html

Created September 7, 2016 13:32
Show Gist options
  • Save TheMapSmith/7ecc56b224af6bcb7cdf87b4459580f8 to your computer and use it in GitHub Desktop.
Save TheMapSmith/7ecc56b224af6bcb7cdf87b4459580f8 to your computer and use it in GitHub Desktop.
Download ZIP
Awesome vector tiles
Raw
index.html
<!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: "http://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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment