Change Maxzoom Option In Runtime To Ol.view In Angular-openlayers-directive

I posted this question to change maxZoom in runtime using openlayers3 and that works perfect: map.setView(new ol.View({ zoom: 10, maxZoom: 17, minZoom: 10, })); However, im

Solution 1:

See the documentation of ol.View object

http://openlayers.org/en/v3.2.1/apidoc/ol.View.html

If center option is not given while creating ol.View object it is taken as undefined. If its undefined then layer sources will not be fetched..In $scope.changeZoom() method center was undefined since it was not provided while creating. Because of this map object was not loaded correctly.

Fix

olData.getMap().then(function(map){
   map.setView(new ol.View({
      center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),
      zoom: 11,
      maxZoom: 11,
      minZoom: 0,
   }));
});

I have given some random coordinates as center. See the working plunk code here

Solution 2:

I'm not entirely sure why they aren't the same (I didn't investigate the ordinary ol3 solution you stated) but after stepping through the ol-debug.js code it seems it's drawing a blank frame because the new view doesn't have a center.

You can set the center using the existing view's center:

$scope.changeZoom = function () {
    olData.getMap().then(function (map) {
        newView = new ol.View({
            zoom: 5,
            maxZoom: 20,
            minZoom: 0,
        });
        newView.setCenter(map.getView().getCenter());
        map.setView(newView);
    });
};

And here's a working plunker*.

*I haven't used plunker before this so if it doesn't work let me know and I'll try again!