zoukankan      html  css  js  c++  java
  • ol设置最佳可视范围和限制缩放

    目前随着科技发展,智慧城市的不断发展,GIS方面的技术也是层出不穷,如市场流行的 OPENLAYERS, CESIUM, THREE等,但是也会有很多棘手的问题,比如不同分辨率下,图层的显示范围,禁止缩放滑动等问题,下面我们就来谈谈OPENLAYERS对于这方面的设置

    1、禁用鼠标缩放

    
    	 // 初始化地图
       map = new Map({
         target: el,
         view: viewer,
         interactions: olDef({
           doubleClickZoom: false,// 取消双击放大功能交互
           mouseWheelZoom: false, // 取消滚动鼠标中间的滑轮交互
           shiftDragZoom: false, // 取消shift+wheel左键拖动交互
         })
       });
       
    

    2、禁止鼠标拖动

    
      let pan = getPan();
      //false:当前地图不可拖动。true:可拖动
      pan.setActive(false);
      function getPan() {
        let pan ='';
        map.getInteractions().forEach(function(element, index, array) {
          if(element instanceof DragPan) {
            pan = element;
          }
        })
        return pan;
      }
      
    

    3、可视范围设置

    
     // 可是范围 ,这个坐标得根据自己的地图去设置,一般是对角,如: 左上 <--> 右下
    let displayRange = olExtent.boundingExtent([[104.89177879000005,31.436460560000057],[102.99076150500008,30.093134960000043]]);
     map.getView().fit(displayRange,map.getSize());
    
    

    分别将这三个添加到,map初始化中去即可。

    题外话:其实高德地图做可视化控制比ol 简单map.setFitView(); 这就欧啦,不信去看案例 https://lbs.amap.com/api/javascript-api/example/marker/adaptive-show-multiple-markers/

  • 相关阅读:
    关于自定义UICollectionViewLayout的一点个人理解<一>
    自定义进度条
    iOS 无限轮播图的两种实现
    图片的拉伸
    关于plist文件
    加载gif图过渡效果
    关于textView的字数限制
    php-fpm服务启动脚本
    转载:PHP支付宝接口RSA验证
    将博客搬至CSDN
  • 原文地址:https://www.cnblogs.com/dengxiaoning/p/12309569.html
Copyright © 2011-2022 走看看