请问Openlayers如何实现用鼠标框多个标注点

Posted 2023-04-02

OpenLayers new OpenLayers.Layer.Markers("Markers" )创建一图层，在此图层上面添加多个标注点,怎样实现用鼠标框选多个标注点并得到标注点的信息

参考技术A

JSON数据：

[
"name":"白银区","position":[103,37],
"name":"平川区","position":[103,38],
"name":"靖远县","position":[103,39],
"name":"景泰县","position":[103,40],
"name":"会宁县","position":[103,41]
]

添加多个标注

$.getJSON('openlayers/json_map/tmp/1.json',function(data)
//创建新标注层
Mk_2 = new OpenLayers.Layer.Markers("白银");
//设定初始化标注不可见
Mk_2.setOpacity(1);
//根据JSON服务器传回的数据创建标注点
$.each(data, function(i,n)
//创建新标注
var Mk = new OpenLayers.Marker(new OpenLayers.LonLat(n.position).transform("EPSG:4326", "EPSG:900913"));
//为标注注册事件
Mk.events.register("mousedown", Mk,function(evt) 
alert(n.name)
OpenLayers.Event.stop(evt);
);
//把标注加进标注层里
Mk_2.addMarker(Mk);
);
//把标注添加到地图上
map.addLayer(Mk_2);
)

参考技术B 有答案了吗？怎么到处都有人问，没人回答呢。

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()
                        ]