Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Disable horizontal repeating of world map with mapbox

I'm quite new to JS, so maybe my problem will be easy to solve, though I already spent many hours on it.

I'm using Mapbox with the leaflet api, and I would like to disable the repeating of horizontal world maps when zooming out. I already explored the maxBounds properties, but it is not satisfying, as I want to hide the map outside the bounds. Basically, I would like to have this result http://jsfiddle.net/zF6bf/ but instead of "canvas", I would like to have this map, stored on mapbox.com : cartogrph.hbem5mod

Moreover, I would like to disable drag and zoom handlers, so I'm looking for a solution which would be compatible with the following:

// disable drag and zoom handlers
map.dragging.disable();
map.touchZoom.disable();
map.doubleClickZoom.disable();
map.scrollWheelZoom.disable();
// disable tap handler, if present.
if (map.tap) map.tap.disable();

Can anyone help me? I would be really greatful.

Thanks in advance, Jonas

like image 395
Jonas Avatar asked Feb 24 '14 10:02

Jonas


1 Answers

See the docs: Disable World Wrapping

<script>
var map = L.mapbox.map('map','cartogrph.hbem5mod', {
    // these options apply to the tile layer in the map
    tileLayer: {
        // this map option disables world wrapping. by default, it is false.
        continuousWorld: false,
        // this option disables loading tiles outside of the world bounds.
        noWrap: true
    }
}).setView([38, -102.0], 5);
</script>
like image 192
kirkaracha Avatar answered Oct 05 '22 22:10

kirkaracha