如何從Openlayers矢量功能中獲取DOM元素

Question

（我在“ 如何在OpenLayers中獲取選定功能的事件或DOM元素”一文中進行了搜索，但收效甚微 。看來，它們只能解決事件中的問題。）

我們的網站使用qTip2作為工具提示，我想在我的矢量層中彈出一些功能。 為了使生活更輕松，我想使用qTip2工具提示而不是openlayers彈出窗口（以便我們可以使用我們自己的樣式。）

創建功能時，我需要對DOM對象的引用，以便可以將qTip2工具提示附加到該對象：

function onFeatureCreate(feature){
    var elem=?
    $(elem).qTip2(...);
}

如果我具有圖層中的要素，如何獲取DOM對象？

Answer 1

如果要查找鼠標或要素在懸停時的位置，以便可以顯示自定義疊加層，請創建自定義懸停控件並按如下所示定義功能突出顯示的功能：

var featureHoverControl = new OpenLayers.Control.SelectFeature([myLayer], {
    id: 'featureHoverControl',
    hover: true,
    autoActivate: true,
    highlightOnly: true,
    renderIntent: "temporary",
    eventListeners: {
       featurehighlighted: function(e) {
            // either use the mouse's position when the event was triggered
            var mouseXPosition = this.handlers.feature.evt.x;
            var mouseYPosition = this.handlers.feature.evt.y;

            // or retrieve the feature's center point
            var featureCenterLonLat = e.feature.geometry.bounds.getCenterLonLat();
            var featureCenterPoint = map.getPixelFromLonLat(featureCenterLonLat);

            // display your custom popup here
            // e.g. showTooltip(e.feature.attributes.name, featureCenterPoint.x, featureCenterPoint.y)
        }
        ,
        featureunhighlighted: function(e) {
            // hide your custom popup here
            // e.g. hideTooltip()
        }
    }
});
map.addControl(featureHoverControl);

如果您需要訪問表示您的圖層/功能的SVG元素（如果您使用的是第三方庫，並且不想修改源代碼），請使用以下任意一行（取決於您是否需要使用圖層或要素）：

var layerElement = map.getLayersByName("My Layer")[0].features.root;
var layerElementId = map.getLayersByName("My Layer")[0].features.root.id;
var featureElementId = map.getLayersByName("My Layer")[0].getFeaturesByAttribute("name","My Feature Name")[0].geometry.components[0].id;

請注意，由於這僅獲取元素的ID，因此您仍然需要使用適當的方法來獲取對元素本身的引用。 類似於以下任何一種情況：

var elementReference1 = document.getElementById(featureElementId);
var elementReference2 = jQuery('#'+featureElementId)[0];

Answer 2

如果您的要素是數據驅動的，則可以向要素屬性對象添加一些元數據，並且應該將其映射到dom屬性，然后可以使用這些屬性進行查詢，我認為那應該起作用