Vector OpenLayers矢量层特征处理程序

我会有一个openlayers矢量层，其特征散布在地图上。我想能够点击一个功能，并有一个消息显示

我不确定是否有办法为每个功能添加侦听器/处理程序

---

有什么想法吗？

添加SelectFeture控件：

var selectFeature = new OpenLayers.Control.SelectFeature(vector_layer);
map.addControl(selectFeature);
selectFeature.activate();

之后，您可以在向量层上侦听选择/取消选择事件：

vector_layer.events.on({
  'featureselected': function(feature) {
       //display your message here
  },
  'featureunselected': function(feature) {
       //hide message
  }
});

---

如果有许多向量层，是否有必要为每个层写入“layer_name.events.on…”？是否可以制作一个层列表并将“.events.on”分配给所有层？

您需要结合使用

SelectFeature

控件和

OpenLayers.Popup

类，例如

OpenLayers.Popup.FramedCloud

。下面是一个例子：

在该示例中，尝试使用“绘制多边形”选项绘制多边形（双击地图以完成多边形）。然后使用“单击选择多边形”并单击多边形，您将得到一个框架云弹出窗口

您可以查看页面的源代码，以了解如何完成此操作。以下是代码的相关部分。当然，您可以将

消息更改为要在框架云中显示的任何内容：

    var map = <your OpenLayers.Map object>;
    var polygonLayer = <your vector layer>;

    selectControl = new OpenLayers.Control.SelectFeature(polygonLayer,
            {onSelect: onFeatureSelect, onUnselect: onFeatureUnselect});
    map.addControl(selectControl); // not in the example, but do this

    function onPopupClose(evt) {
        selectControl.unselect(selectedFeature);
    }

    function onFeatureSelect(feature) {
        var message = "<div style='font-size:.8em'>Feature: " + feature.id +"<br>Area: " + feature.geometry.getArea()+"</div>";

        selectedFeature = feature;
        popup = new OpenLayers.Popup.FramedCloud("chicken", 
            feature.geometry.getBounds().getCenterLonLat(),
            null,
            message,
            null, true, onPopupClose);
        feature.popup = popup;
        map.addPopup(popup);
    }

    function onFeatureUnselect(feature) {
        map.removePopup(feature.popup);
        feature.popup.destroy();
        feature.popup = null;
    }

var-map=；
var polygonLayer=；
selectControl=新建OpenLayers.Control.SelectFeature（polygonLayer，
{onSelect:onFeatureSelect，onSelect:onFeatureUnselect}）；
map.addControl（selectControl）；//示例中没有，但请执行此操作
函数onPopupClose（evt）{
选择控制。取消选择（selectedFeature）；
}
功能onFeatureSelect（功能）{
var message=“Feature:”+Feature.id+”
区域：“+Feature.geometry.getArea（）+”；
selectedFeature=特征；
popup=新建OpenLayers.popup.FramedCloud（“鸡”，
feature.geometry.getBounds（）.getCenterLonLat（），
无效的
消息
null、true、onPopupClose）；
feature.popup=弹出窗口；
map.addPopup（弹出窗口）；
}
功能onFeatureUnselect（功能）{
map.removeppopup（feature.popup）；
feature.popup.destroy（）；
feature.popup=null；
}

以下是您将要使用的控件的参考：




我自己没有尝试过，但是当您创建SelectControl时，您可以发送一个向量层数组，而不是像上面示例中那样发送一个向量层数组。然后，您应该能够在selectControl.onSelect（）{}中捕获select事件；这个例子只是一个图层，但我注意到一旦你开始使用两个矢量图层，并且需要添加/激活第二个控件来执行悬停操作，其中一个就不起作用了。（您需要停用一个有效的，以使另一个有效）。奇怪的