十七、openlayers官网示例Constrained Extent解析——设置地图拖动限制范围

官网demo地址：

Constrained Extent 

又是一个轻松简单的示例~

设定地图拖动的限制范围。

new View的时候设置extent为中国，中心点设置为北京。缩小的时候就会发现不能拖到中国以外的地区啦。

const view = new View({
      projection: "EPSG:4326",
      center: [116.389, 39.903],
      zoom: 8,
      extent: [73.66, 3.86, 135.05, 53.55],  //中国边界
    });

限制大小也可以通过 minZoom和maxZoom来设置

 const view = new View({
      projection: "EPSG:4326",
      center: [116.389, 39.903],
      zoom: 8,
    //   extent: [73.66, 3.86, 135.05, 53.55], //中国边界、
      minZoom: 9,
      maxZoom: 13,
    });

左上角的滑块是new Map的时候加上去的，是地图自带的控件，拖动它就可以放大缩小地图。

defaultControls().extend([new ZoomSlide