0

I need to show the Map only for the World

like https://stackoverflow.com/questions/16558231/leafletjs-setmaxbounds-wont-let-zoom-out-to-see-whole-world

How to set this in OL3,

tried by giving extent to the view but not working

view : new ol.View({
                    center : center.getCoordinates(),
                    zoom : this.mapOptions.zoom,
                    extent : [-180,-180,180,180]
                })
  • Any feedback...? – Jonatas Walker Oct 22 '15 at 8:05
  • its not working.. still i can see world map 3 time when i zoom out. tried both answers.. – chiranjeevigk Oct 22 '15 at 13:06
  • Did you set minZoom? Adjust it according to your needs. – Jonatas Walker Oct 22 '15 at 13:12
  • Yes.. its working after setting the 'minZoom' – chiranjeevigk Nov 17 '15 at 10:36
2

Get world extent for your projection:

var projection = ol.proj.get('EPSG:3857');
var world_extent = projection.getWorldExtent();
console.info(world_extent);

Then in your view:

view: new ol.View({
    extent: world_extent,
    center: [0, 0],
    zoom: 1,
    minZoom: 1
})
  • but while dragging map it always go to centre some where in Africa – chiranjeevigk Nov 17 '15 at 10:52
0

there are many different options for that. In waht projection is "your world"? It depends on what are you trying to achive and what is your base layer to show the world. Also "is not working" means what??? You have errors???? In terms of geography [-180,-180,180,180] is not correct as latitude values vary from -90 to +90. So it would be correct to use [-180,-90,180,90]. But then depends on the epsg of your source layer as well as of your map. See a working examlpe. I use bing layer as my baselayer (EPSG:3857) so I need to transform my lon,lat to x,y.

var raster = new ol.layer.Tile({
  source: new ol.source.BingMaps({
    imagerySet: 'Aerial',
    key: 'Ak-dzM4wZjSqTlzveKz5u0d4IQ4bRzVI309GxmkgSVr1ewS6iPSrOvOKhA-CJlm3'
  })
});
var myextent = ol.extent.applyTransform([-179,-89,179,89], ol.proj.getTransform("EPSG:4326", "EPSG:3857"));
console.log(myextent);
var mycenter = ol.extent.getCenter(myextent)
console.log(mycenter);
var map = new ol.Map({
  layers: [raster],
  target: document.getElementById('map'),

  view: new ol.View({
    extent : myextent,
    projection: 'EPSG:3857',
    center: mycenter,
    //maxZoom: 19,
      minZoom :2,
    zoom: 2
  })
});

Now back to your question, extent is used on the view congif for limmiting the map of moving outside this extent. As long as you give an extent of the world is like giving nothing. If you want just to show a map with the whole world just use the highest zoom level (this is 0) zoom: 0 of your base layer and a center whitch points to the centre of the world.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.