Javascript 如何在 OpenLayers 的矢量图层上以编程方式选择特征？

How to select a feature programmatically on a vector layer in OpenLayers?

提问by Patrick Hillert

I'm currently searching for a solution to select (or highlight) a vector in a OpenLayers.Layer.Vector.

我目前正在寻找在 OpenLayers.Layer.Vector 中选择（或突出显示）矢量的解决方案。

I've build a simple gridtable where a user can pick a vector (given as WKT formatted string) which should highlight the corresponding vector on the layer. All the vectors in the gridtable are drawn to the vector layer on the map when the user visits the the site.

我已经构建了一个简单的网格表，用户可以在其中选择一个向量（以 WKT 格式的字符串形式给出），它应该突出显示图层上的相应向量。当用户访问站点时，网格表中的所有矢量都被绘制到地图上的矢量图层。

I found out that I either need the OpenLayers.Control.ModifyFeature's selectFeature(feature)function or the OpenLayers.Control.SelectFeature (see dev.openlayers.org/apidocs/files/OpenLayers/Control/SelectFeature-js.html's select(feature) function (which probably does not exists or doesn't exists any longer?). See a post from a Mailinglist: osgeo-org.1803224.n2.nabble.com/Programatically-Select-a-Feature-tt2192485.html#a2193928 for more infos.

我发现我需要OpenLayers.Control.ModifyFeature的selectFeature(feature)函数或 OpenLayers.Control.SelectFeature （见 dev.openlayers.org/apidocs/files/OpenLayers/Control/SelectFeature-js.html's select(功能）功能（可能不存在或不再存在？）。请参阅邮件列表中的帖子：osgeo-org.1803224.n2.nabble.com/Programatically-Select-a-Feature-tt2192485.html# a2193928 了解更多信息。

I tried the following with no success, so I hope someone could grab this code lines and could show me a working code snippet ;-)

我尝试了以下但没有成功，所以我希望有人可以抓住这些代码行并可以向我展示一个有效的代码片段;-)

// ... some initializing code
this.vlayer = new OpenLayers.Layer.Vector("VectorLayer");  // VectorLayer

// some controls
this.openLayerControlPoint = new OpenLayers.Control.DrawFeature(this.vlayer, OpenLayers.Handler.Point);
this.openLayerControlPolygon = new OpenLayers.Control.DrawFeature(this.vlayer, OpenLayers.Handler.Polygon);
this.openLayerControlModify = new OpenLayers.Control.ModifyFeature(this.vlayer, {
  mode: OpenLayers.Control.ModifyFeature.RESHAPE | OpenLayers.Control.ModifyFeature.DRAG,
  standalone: false
});

// just deactivate to make sure everything is really deactivated
this.openLayerControlPoint.deactivate();
this.openLayerControlPolygon.deactivate();
this.openLayerControlModify.deactivate();

// add the just created layer to the map
this.map.addLayer(this.vlayer);

// add all (deactivated) controls to the map
this.map.addControl(this.openLayerControlPoint);
this.map.addControl(this.openLayerControlPolygon);
this.map.addControl(this.openLayerControlModify);

Later in code:

后面的代码：

// ... another function doing the action
selectVector: function(wktVector) {
  this.openLayerControlModify.activate();

  // this is no elegant solution, this should only show how I would 
  // test the functionallity.
  for (var i = 0; i < this.vlayer.features.length; ++i) {
    // returns a WKT formatted string: 
    // 'POLYGON((xxxx.xxx xxxx.xxx), (xxxx.xxx xxxx.xxx))'
    var wktVectorCurrent = this.vlayer.features[i].geometry.toString(); 
    if (wktVector == wktVectorCurrent) {
      // \/ doesn't work :-(
      this.openLayerControlModify.selectFeature(this.vlayer.features[i]);
      break;
    }
  }
}

回答by igorti

I don't understand why you are using ModifyFeature to select a feature. OpenLayers.Control.SelectFeature is done specifically to select features so I suggest that you use this control instead.

我不明白您为什么要使用 ModifyFeature 来选择功能。OpenLayers.Control.SelectFeature 专门用于选择功能，因此我建议您改用此控件。

So, create SelectFeature control:

因此，创建 SelectFeature 控件：

var selectFeature = new OpenLayers.Control.SelectFeature(this.vlayer);
selectFeature.activate();

Then in you if-statement(I guess it works to find a feature you want to select by comparing geometries?) use select method:

然后在你的 if 语句中（我猜它可以通过比较几何来找到你想要选择的特征？）使用 select 方法：

if (wktVector == wktVectorCurrent) {
   selectFeature.select(this.vlayer.features[i]);
}

According to documentation this method should mark feature as selected and raise appropriate events:

根据文档，此方法应将功能标记为已选择并引发适当的事件：

 * Method: select
 * Add feature to the layer's selectedFeature array, render the feature as
 * selected, and call the onSelect function.

If you want to do something on the map when feature gets selected(like showing a popup), you should subscribe vector layer to select-event when you create it:

如果要在选择要素时在地图上执行某些操作（例如显示弹出窗口），则应在创建矢量图层时将矢量图层订阅到 select-event：

this.vlayer.events.on({'featureselected': function(){
   //Handle select event
}});