Skip to content

Instantly share code, notes, and snippets.

@lxbarth
Last active August 29, 2015 14:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 4 You must be signed in to fork a gist
  • Save lxbarth/0c11056628119b24b78b to your computer and use it in GitHub Desktop.
Save lxbarth/0c11056628119b24b78b to your computer and use it in GitHub Desktop.
Attribution on OpenStreetMap based Mapbox maps
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Attribution</title>
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox.js/v1.6.2/mapbox.js'></script>
<script src='https:////api.tiles.mapbox.com/mapbox.js/plugins/leaflet-hash/v0.2.1/leaflet-hash.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox.js/v1.6.2/mapbox.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
</style>
</head>
<body>
<div id='map'></div>
<script>
var map = L.mapbox.map('map', 'lxbarth.i6fgdd0o', {infoControl: false, attributionControl: false})
.setView([37.7854, -122.4160], 13);
L.hash(map);
// Add attribution to Mapbox and OpenStreetMap.
var attribution = L.control.attribution();
attribution.setPrefix('');
attribution.addAttribution('<a href="https://www.mapbox.com/about/maps">© Mapbox</a> <a href="http://openstreetmap.org/copyright">© OpenStreetMap</a> | <a href="http://mapbox.com/map-feedback/" class="mapbox-improve-map">Improve this map</a>');
attribution.addTo(map);
// Extra points: make sure user lands on proper map and location when clicking 'Improve this map'
// (don't forget to add same map id as in the map creation here).
var editLink = function() {
if (!document.getElementsByClassName) {
return;
}
var link = document.getElementsByClassName('mapbox-improve-map');
if (link.length && map._loaded) {
var center = map.getCenter();
for (var i = 0; i < link.length; i++) {
link[i].href = link[i].href.split('#')[0] + '#lxbarth.i6fgdd0o/' + center.lng + '/' + center.lat + '/' + map.getZoom();
}
}
};
editLink();
map.on('moveend', editLink);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment