87,910
社区成员
发帖
与我相关
我的任务
分享百度地图多个polyline添加mouseover事件显示infowindow的问题
百度地图中画了多个polyline，想在鼠标经过的时候弹出infowindow提示信息窗口，发现总是显示最后一个polyline的提示窗口。
csdn中参考了
https://blog.csdn.net/zzq900503/article/details/22273507
等几个帖子，采用闭包的方式写代码，但总是实现不了，请各位大神不吝指教，谢谢！
代码如下：
var content1 = "窗口显示字符内容1";
var content2 = "窗口显示字符内容2";
var content3 = "窗口显示字符内容3";
var polyline1 = createPolyline( points1, ops1, content1);
var polyline2 = createPolyline( points2, ops2, content2);
var polyline3 = createPolyline( points3, ops3, content3);
map.addOverlay(polyline1);
map.addOverlay(polyline2);
map.addOverlay(polyline3);
funciton createPolyline(points, ops, info_html) {
var _Polyline = new BMap.Polyline(points, ops);
_Polyline .addEventListener("mouseover",function(e) {
map.openInfoWindow(new BMap.InfoWindow(info_html, {width: 200, height: 110}), e.point); }
);
return _Polyline;
}
运行的时候，鼠标经过每个polyline的时候，弹出的提示窗口都是显示content3的内容，该怎么修改呢，谢谢！
csdn中参考了
https://blog.csdn.net/zzq900503/article/details/22273507
等几个帖子，采用闭包的方式写代码，但总是实现不了，请各位大神不吝指教，谢谢！
代码如下：
var content1 = "窗口显示字符内容1";
var content2 = "窗口显示字符内容2";
var content3 = "窗口显示字符内容3";
var polyline1 = createPolyline( points1, ops1, content1);
var polyline2 = createPolyline( points2, ops2, content2);
var polyline3 = createPolyline( points3, ops3, content3);
map.addOverlay(polyline1);
map.addOverlay(polyline2);
map.addOverlay(polyline3);
funciton createPolyline(points, ops, info_html) {
var _Polyline = new BMap.Polyline(points, ops);
_Polyline .addEventListener("mouseover",function(e) {
map.openInfoWindow(new BMap.InfoWindow(info_html, {width: 200, height: 110}), e.point); }
);
return _Polyline;
}
运行的时候，鼠标经过每个polyline的时候，弹出的提示窗口都是显示content3的内容，该怎么修改呢，谢谢！
...全文
请发表友善的回复…
发表回复
雪月圣雕 2021-04-06
- 打赏
- 举报
大佬，我也遇到对polyline添加信息窗口的问题了？请问您解决了吗？能指点一下怎么做吗？
dpbug_cn 2019-08-05
- 打赏
- 举报
我怎么测试不出来呢？每个polyline都始终显示最后一条的内容！浏览器是用的chrom，e太奇怪了
囧 2019-07-31
- 打赏
- 举报
测试是没问题的，是否缓存的原因
dpbug_cn 2019-07-31
- 打赏
- 举报
这个例程参考了，但是是marker的，不是针对polyline等其他overlay的
usecf 2019-07-31
- 打赏
- 举报
你有没有参考这个demo 把你改下看看可以不
http://lbsyun.baidu.com/jsdemo.htm#d0_5
dpbug_cn 2019-07-31
- 打赏
- 举报
感谢 usecf
marker有openInfoWindow方法，但是polyline没有openInfoWindow方法，所以没法 使用this.openInfoWindow。
我的代码里是map.openInfoWindow，结果每次都是显示最后一个窗口的信息
请指教，谢谢！
marker有openInfoWindow方法，但是polyline没有openInfoWindow方法，所以没法 使用this.openInfoWindow。
我的代码里是map.openInfoWindow，结果每次都是显示最后一个窗口的信息
请指教，谢谢！
usecf 2019-07-31
- 打赏
- 举报
参考下我之前写的 openInfoWindow相关的
else
{
map.clearOverlays();
for(var i=0; i< ilen; i++)
{
g_lat.push(dataJson.data.devlist[i].lat);
g_lng.push(dataJson.data.devlist[i].lng);
console.log(" dataJson.data.devlist[i].lat==="+dataJson.data.devlist[i].lat);
console.log(" dataJson.data.devlist[i].lng==="+dataJson.data.devlist[i].lng);
var sContent = "<h4 style='margin:0 0 5px 0;padding:0.2em 0'>沪B67668</h4>"
+ "<img style='float:left;margin:4px' id='imgDemo' src='images/0.jpg' width='32' height='32'/>"
+ "<span>设备编号:"+deviceNumArr[i]+"</span></p>"
+ "<p style='margin:0;line-height:1.5;font-size:13px;'>上海市青浦区华丹路99号</p>"
+ "<hr>" + "<p><span style='padding-right:10px'>北纬:123.00</span>"
+ "<span>东经:12.3695</span></p>"
+ "<p><span style='padding-right:10px'>行驶方向:东南</span>"
+ "<span>速度:70公里/小时</span></p>" + "</div>";
var new_point = new BMap.Point(g_lng[g_lng.length-1], g_lat[g_lat.length-1]);
//map.centerAndZoom(new_point, 13);
locationmarker = new BMap.Marker(new_point); // 创建标注
var infoWindow = new BMap.InfoWindow(sContent); // 创建信息窗口对象
locationmarker.infoWindow=infoWindow;
map.addOverlay(locationmarker); //增加点
console.log(" fnLocationSuccCallBack add marker");
var selIndex = document.getElementById("deviceno_input").selectedIndex;
if(document.getElementById("deviceno_input").options[selIndex].text != "所有设备")
{
if(1 == selectedChange)
{
//map.panTo(new_point);
map.centerAndZoom(new_point, 13);
selectedChange = 0;
}
}
console.log(" fnLocationSuccCallBack add marker 2222");
// 增加 标记点击事件
locationmarker.addEventListener("click", function(e){
this.openInfoWindow(e.target.infoWindow);
document.getElementById('imgDemo').onload = function() {
infoWindow.redraw();
}
});
}
drawEletricFence();
}
