Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to zoom map programmatically Openlayers 3?

Tags:

openlayers-3

I want to draw a square around a marker. if I draw a large square the map should zoom out automatically so that we can see the square completely. If I draw a small square the map should zoom in automatically to show the square completely.

In this image I have drawn small square so we can see the square completely

In this image I have drawn a larger square, Since the map is not zooming out we cannot see the square sides

like image 660
Nelson Avatar asked Dec 01 '22 12:12

Nelson


2 Answers

See ol.View in the openlayers 3 documentation. There is a function setZoom(zoom).

So if your map variable is map, to zoom in use map.getView().setZoom(map.getView().getZoom() + 1); and to zoom out use map.getView().setZoom(map.getView().getZoom() - 1);

like image 52
Andy Nichols Avatar answered Dec 23 '22 23:12

Andy Nichols


If you want a smooth zoom:

map.getView().animate({
  zoom: map.getView().getZoom() + 1,
  duration: 250
})
like image 23
lenooh Avatar answered Dec 23 '22 22:12

lenooh