openlayers实现锁定地图，不可使用鼠标拖动放大缩小地图

这篇具有很好参考价值的文章主要介绍了openlayers实现锁定地图，不可使用鼠标拖动放大缩小地图。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

解决问题

开启地图锁定功能，不再允许使用鼠标拖拽查看地图，使用鼠标滚轮放大缩小查看地图
关键代码

function lock() {
      let pan;
      let mousezoom;
      map.getInteractions().forEach(function (element) {
        if (element instanceof DragPan)//获取 控制能否使用鼠标，手指拖动地图的对象
          pan = element;
        if(element instanceof MouseWheelZoom)//获取 控制能否使用滚轮滚动放大缩小地图的对象
          mousezoom = element;
        if (pan) {
            pan.setActive(true);
        }
        if (mousezoom) {
            mousezoom.setActive(true);
        }
      });
    }

包含业务开关的代码

function lock(lockval) {
	 //lockval  是业务中用来控制锁图标状态的
      let pan;
      let mousezoom;
      map.getInteractions().forEach(function (element) {
        if (element instanceof DragPan)//获取 控制能否使用鼠标，手指拖动地图的对象
          pan = element;
        if(element instanceof MouseWheelZoom)//获取 控制能否使用滚轮滚动放大缩小地图的对象
          mousezoom = element;
        if (pan) {
          if (lockval) {
            pan.setActive(true);//此对象的setActive方法用来设置是否可以拖动滚动查看
            isLock.value = !isLock.value;//isLock是业务中控制锁的图标的
          }
          else {
            pan.setActive(false);
            isLock.value = !isLock.value;
          }
        }
        if (mousezoom) {
          if (lockval) {
            mousezoom.setActive(true);
          }
          else {
            mousezoom.setActive(false);
          }
        }
      });
    }