我有一个带过滤器的简单地图,标记数据从融合表中提取。我还有一个填充搜索结果的“结果列表”。当我将鼠标悬停在结果列表中的相应地址时,我只是想让标记反弹。 听起来很简单,但我的地图在我的HTML或JS文件中没有硬编码标记,它们基于搜索条件是静态的,并且从融合表中提取位置。 我浏览了整个互联网,发现很少有关于使用Google maps API v3中的“结果列表”的文档。
以下是我尝试添加到我的代码中的内容: //制作.hover事件
$('#results_list .addrMarkerImage').hover(
// mouse in
function () {
var index = $('#results_list .addrMarkerImage').index(this);
addrMarkerImage[index].setIcon(highlightedIcon());
},
// mouse out
function () {
var index = $('results_list .addrMarkerImage').index(this);
addrMarkerImage[index].setIcon(normalIcon());
}
);
而且:
//列表上的跳出标记悬停
$('#markers_info .marker').hover(
function(b){var b=MapsLib.setAnimation(),
$(".results_list").on("mouseenter",".displayList",
function(){var c=$(this).data("lat"),
b=a.getMarker(c,true);
b.setAnimation(google.maps.Animation.BOUNCE);return});
$(".map-list").on("mouseleave",".displayList",
},
);
我不打算在这里进行脑部手术,我只是希望标记在悬停在结果列表中的相应项目时反弹。 任何帮助将不胜感激!
目前我的努力要么(根本没有效果)或(崩溃了地图页面)“崩溃”我的意思是地图,标记和结果列表根本没有显示出来。
如果需要,我可以在回复中添加index.html和maps_lib.js文件的代码。
提前感谢您提供的任何帮助。
这是我调用函数在列表框中显示结果的地方。 //显示结果功能
MapsLib.prototype.getList = function(whereClause) {
var self = this;
var selectColumns = 'type, title, address, Column1, phone ';
self.query({
select: selectColumns,
where: whereClause
}, function(response) {
self.displayList(response);
});
},
MapsLib.prototype.displayList = function(json) {
var self = this;
var data = json['rows'];
var template = '';
var results = $('#results_list');
results.hide().empty(); //hide the existing list and empty it out first
if (data == null) {
//clear results list
results.append("<li><span class='lead'>No results found</span></li>");
}
else {
for (var row in data) {
template = "\
<div class='row-fluid item-list'>\
<div class='span12'>\
<strong>" + data[row][0] + "</strong>\
<br />\
" + data[row][1] + "\
<br />\
" + data[row][2] + "\
<br />\
" + data[row][3] + "\
<br />\
" + data[row][4] + "<br>\
</div>\
</div>";
results.append(template);
}
}
results.fadeIn();
var results = $('#results_list');
};