本文參考官網例子，略作修改，直接上代碼：

1、實現hover和click高亮顯示

var map, controls;OpenLayers.Feature.Vector.style['default']['strokeWidth'] = '2';var vectors;var highlightCtrl;function init(){map = new OpenLayers.Map('map');vectors = new OpenLayers.Layer.Vector("vector", {isBaseLayer: true});map.addLayers([vectors]);var feature = new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POLYGON((28.828125 0.3515625, 132.1875 -13.0078125, -1.40625 -59.4140625, 28.828125 0.3515625))"));vectors.addFeatures([feature]);var feature2 = new OpenLayers.Feature.Vector(OpenLayers.Geometry.fromWKT("POLYGON((-120.828125 -50.3515625, -80.1875 -80.0078125, -40.40625 -20.4140625, -120.828125 -50.3515625))"));vectors.addFeatures([feature2]);var report = function(e) {OpenLayers.Console.log(e.type, e.feature.id);};highlightCtrl = new OpenLayers.Control.SelectFeature(vectors, {hover: true,highlightOnly: true,renderIntent: "temporary",eventListeners: {beforefeaturehighlighted: report,featurehighlighted: report,featureunhighlighted: report}});var selectCtrl = new OpenLayers.Control.SelectFeature(vectors,{clickout: true});map.addControl(highlightCtrl);map.addControl(selectCtrl);highlightCtrl.activate();selectCtrl.activate();map.setCenter(new OpenLayers.LonLat(0, 0), 1);}

2、實現屬性查詢高亮某一元素，此處簡單的通過button的click事件測試，代碼如下：

備注：使用hightlight和unhighlight是一樣的效果

//高亮顯示
　　　　 function mySelect() {console.log(vectors.features);var feature = vectors.features[0];highlightCtrl.select(feature);}
　　　　 //取消高亮顯示function myUnselect() {var feature = vectors.features[0]; highlightCtrl.unselect(feature);}

3、通過屬性查詢獲得features

var features = vectorlayer.getFeaturesByAttribute("name", "名稱");

將得到的features[0]傳遞給上面的高亮函數即可

轉載于:https://www.cnblogs.com/marost/p/6553586.html

總結

以上是生活随笔為你收集整理的openlayers 2 高亮显示元素以及通过属性查询高亮某一元素的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。