gpt4 book ai didi

popup - 如何在单击和鼠标悬停时显示不同的弹出窗口?

转载 作者:行者123 更新时间:2023-12-04 05:27:16 25 4
gpt4 key购买 nike

SelectFeature Control 中的方法class 提供了一种通过监听事件在 Vector 层上添加和删除弹出窗口的方法 featureselectedfeatureunselected分别。下面显示了我从 an example 获得的示例代码在 openlayers 网站中:

// create the layer with listeners to create and destroy popups
var vector = new OpenLayers.Layer.Vector("Points",{
eventListeners:{
'featureselected':function(evt){
var feature = evt.feature;
var popup = new OpenLayers.Popup.FramedCloud("popup",
OpenLayers.LonLat.fromString(feature.geometry.toShortString()),
null,
"<div style='font-size:.8em'>Feature: " + feature.id +"<br>Foo: </div>",
null,
true
);
feature.popup = popup;
map.addPopup(popup);
},
'featureunselected':function(evt){
var feature = evt.feature;
map.removePopup(feature.popup);
feature.popup.destroy();
feature.popup = null;
}
}
});

vector.addFeatures(features);

// create the select feature control
var selector = new OpenLayers.Control.SelectFeature(vector,{
hover:true, # this line
autoActivate:true
});

上面的代码将允许在鼠标悬停在 Geometry 对象( map 上的图标或标记)上时显示一个弹出窗口。如行 hover:true被删除,只有在几何对象上单击鼠标时才会显示弹出窗口。

我想要的是能够在鼠标悬停时显示一种类型的弹出窗口(例如,图像加标题),并在单击鼠标时显示另一种类型(例如,详细描述)。我不确定如何做到这一点。一些帮助将不胜感激。谢谢。

最佳答案

此外,还有另一种方式,它比正确使用 API 更糟糕,但似乎有效。您可以覆盖回调。

var selectControl = new OpenLayers.Control.SelectFeature(vectorLayer, {

callbacks: {
over: function(feat) {
console.log('Show popup type 1');
},
out: function(feat) {
console.log('Hide popup type 1');
}
},

eventListeners: {
featurehighlighted: function(feat) {
console.log('Show popup type 2');
},
featureunhighlighted: function(feat) {
console.log('Hide popup type 2');
}
}
});

这是工作示例: http://jsfiddle.net/eW8DV/1/

查看选择控件的源以了解详细信息。

关于popup - 如何在单击和鼠标悬停时显示不同的弹出窗口?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13052023/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com