CODEWITHSUNDEEP
mapsopenlayersopenstreetmapopenlayers-3bounding-box
krashennikov
krashennikov

Reputation: 39

openlayers - how to center map by bounding box

I'm trying to center the map by given bounding box. On OpenLayers FAQ is even an example of it (with the swissProjection) but it just don't work. Looked around in some forums and just can't figure out how to make it work.

Maybe someone knows.

Here is the code:

var extent = [-9022321.0707,3022167.2243,-8849726.2608,3148441.1951];

var projection = new ol.proj.Projection({
  code: 'EPSG:3857',
  extent: extent,
  units: 'm'
});
ol.proj.addProjection(projection);

var map = new ol.Map({
  layers: [
    new ol.layer.Tile({
      source: new ol.source.OSM()
    })
  ],
  target: 'map',
  view: new ol.View({
    projection: projection,
    center: [0,0],
    zoom: 0
  })
});

Upvotes: 3

Views: 6527

Answers (1)

Chase Choi
Chase Choi

Reputation: 1012

Your code is correct but the center is out of range from your extent. There's two ways to fix it.

First, set valid view center and level:

view: new ol.View({
  projection: projection,
  center: [-8936023.66575, 3085304.2097], // guess it's the center of extent
  zoom: 8 // whatever you want. 
})

Second, use View.fit instead setting extent on Projection:

var projection = new ol.proj.Projection({
  code: 'EPSG:3857',
  //extent: extent,
  units: 'm'
});
...
map.getView().fit(extent);

Upvotes: 4

Related Questions