Openlayers 2 取消鼠标缩放地图的功能

需要实现的功能:

取消鼠标缩放地图,即滚动鼠标的滚轮地图没有响应事件,只能用鼠标平移地图

版本:OpenLayers 2.13.1

测试代码直接用官方例子http://dev.openlayers.org/releases/OpenLayers-2.13.1/examples/osm.html

直接上代码

原始代码:

        var map, layer;
        function init(){
            map = new OpenLayers.Map( ‘map‘);
            layer = new OpenLayers.Layer.OSM( "Simple OSM Map");
            map.addLayer(layer);
            map.setCenter(
                new OpenLayers.LonLat(-71.147, 42.472).transform(
                    new OpenLayers.Projection("EPSG:4326"),
                    map.getProjectionObject()
                ), 12
            );
        }

修改后的代码:

        var map, layer;
        function init(){
            map = new OpenLayers.Map(‘map‘,{
                        controls: [
                            new OpenLayers.Control.Navigation({ ‘zoomWheelEnabled‘: false }),
                            new OpenLayers.Control.MousePosition(),
                            new OpenLayers.Control.Zoom()
                        ]
                    }
            );
            layer = new OpenLayers.Layer.OSM("Simple OSM Map");
            map.addLayer(layer);
            map.setCenter(
                new OpenLayers.LonLat(-71.147, 42.472).transform(
                    new OpenLayers.Projection("EPSG:4326"),
                    map.getProjectionObject()
                ), 12
            );
        }

可见在map实例化时,将默认的controls修改一下即可

增加部分代码为:

              controls: [
                            new OpenLayers.Control.Navigation({ ‘zoomWheelEnabled‘: false }),
                            new OpenLayers.Control.MousePosition(),
                            new OpenLayers.Control.Zoom()
                        ]

  

时间: 2024-10-13 14:52:16

Openlayers 2 取消鼠标缩放地图的功能的相关文章

OpenLayers 之 地图交互功能(interaction)详解

地图交互功能和上一篇讲的地图控件有些混淆,它们都控制着用户与地图的交互,区别是地图控件的触发都是一些可见的 HTML 元素触发,如按钮.链接等:而交互功能都是一些设备行为触发,都是不可见的,如鼠标双击.滚轮滑动等,手机设备的手指缩放等. 地图的交互功能包含很多,如地图双击放大,鼠标滚轮缩放,矢量要素点选,地图上绘制图形等等.只要是涉及到与地图的交互,就会涉及到 intercation 类,它定义了用户与地图进行交互的基本要素和事件.下面我们就来看看用户与地图都有那些交互,怎么交互. 注: '自定

ArcEngine中的缩放地图

在ArcEngine地图操作中,缩放地图的功能经常用到,这里做一个小结. 缩放地图一般可分为以下几种情况: 1.缩放地图:与放大地图相对,一般是手动绘制区域或固定比例缩放,可调用命令或Expand函数来: 2.缩放到图层:这一种用得比较多,通常是将图层转为GeoDataset,利用其他Extent属性来缩放到图层: 3.缩放到选中:选中一个或多个要素,根据选择的要素,创建Geometry,获取Envelope.如果数据量太大,会比较耗时: 4.缩放到单个要素:有时,为了截取,需要分别缩放到单个要

关于 WebBrowser调用百度地图API 鼠标滚轮缩放地图级别失灵的解决办法

在桌面程序下 百度地图API的鼠标缩放地图功能可能会失灵无效! 这个原因不是API的问题 小弟试了下在WEB上面是没有问题的 于是考虑可能是WebBrowser的获取焦点问题,于是在主窗体 添加了一个窗体激活事件 如下 //小弟用的是WPF所以是Window_Activated //如果你用的是Winform就是 Form1_Activated(object sender, EventArgs e)事件 private void Window_Activated(object sender, E

(十八)WebGIS中清空功能和地图定位功能的设计以及实现

1.背景 当地图中增加了很多元素后,对不同的元素需要进行一定的控制,最简单的控制就是能对元素有选择的进行清空删除.在本节中,还将介绍WebGIS中另外一个常用功能,即地图定位功能.具体描述便是:当输入一个坐标点后,能够将地图缩放到该点处.下面我便就以上两个功能展开此章节的内容. 2.清空功能 2.1设计思路 根据功能点,我们可以将清空分为如下几个情形: a.清空某个或者指定个数元素 b.清空某类或多类元素 c.清空所有元素 在之前的矢量图层原理章节中,我已经就WebGIS中的矢量图层原理做了详细

百度地图API功能

984aca5bc78b070e59f34e230f11cf6d http://api.map.baidu.com/api?v=2.0&ak=您的密钥" <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content=&quo

ArcGIS API for Silverlight实现地图测距功能

原文:ArcGIS API for Silverlight实现地图测距功能 问题:如何实现地图测距功能? 地图工具栏 <Grid x:Name="gToolMenu" Height="100" VerticalAlignment="Top" Opacity="0.8" HorizontalAlignment="Right" Width="467"> <Rectangle

百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例 [源码下载]

相关说明 1. 界面查看: 吐槽贴:百度地图 api 封装 的实用功能 [源码下载] 2. 功能说明: 百度地图整合功能分享修正版[ZMap.js] 实例源码! ZMap.js 本类方法功能大多使用 prototype 原型 实现: 包含的功能有:轨迹回放,圈画区域可编辑,判断几个坐标是否在一个圆圈内,生活服务查询,从经纬度获取地址信息,地图工具包括测距,获取面积,以积打印地图,地图全屏,实时路况,坐标是否在polygon区域内,打车方案,经过中间途经点,添加地图控件: 界面预览 本界面项目由:

openlayers入门开发系列之地图模态层篇

本篇的重点内容是为了到达自己想要的区域高亮效果,利用openlayers结合turf.js实现地图模态层功能,效果图如下: 实现思路 利用turf.js提供的difference相差函数,计算最大四至和裁剪区域的差值,这里的最大四至即:(-180,-90,180,90),由于底图是墨卡托投影坐标系的,所以我的代码实现过程中把经纬度转换墨卡托投影坐标:裁剪区域就是需要高亮的多边形,我这里是嘉兴市区域. 界面设计 //地图模态层 "<div style='height:25px;backgro

OpenLayers访问Geoserver发布的地图

上一篇文章基于Geoserver发布了一个18个图层的地图,本文介绍如何利用OpenLayers访问Geoserver发布的地图. 要访问Geoserver发布的地图,主要困难点是地图URL地址的确定,方法是打开Geoserver,在LayerPreview中找到要访问的地图,单击该地图后面的OpenLayers,如下图所示 这时客户端会调用OpenLayers访问该地图,如下图所示 这里我们主要注意的是浏览器中的地址: http://192.168.1.50:8080/geoserver/ka