Created
August 12, 2015 22:41
-
-
Save mapsense-examples/1100c4088a17e1741498 to your computer and use it in GitHub Desktop.
zoom compass
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> | |
<script src="http://d3js.org/topojson.v1.min.js" charset="utf-8"></script> | |
<script src="https://developer.mapsense.co/mapsense.js" charset="utf-8"></script> | |
<link type="text/css" href="https://developer.mapsense.co/mapsense.css" rel="stylesheet"/> | |
<style> | |
/* Sets the map to be full screen with no margin */ | |
body, html, #myMap{ | |
height: 100%; | |
width: 100%; | |
margin: 0; padding: 0; | |
overflow: hidden; | |
} | |
.compass { fill: rgba(0,0,0,0); stroke: gray;} | |
</style> | |
</head> | |
<body> | |
<div id="myMap"></div> | |
<script> | |
var map = mapsense | |
.map("#myMap") // Select an element to add the map to | |
.add(mapsense.basemap().apiKey("key-2d5eacd8b924489c8ed5e8418bd883bc").style("sketch")) //add a basemap layer and append your API key | |
// Docs: https://developer.mapsense.co/documentation/compass | |
var compass = mapsense.compass() | |
.pan('none') | |
.position('top-right'); | |
map.add(compass); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment