这里的问题是我正在从数据库中获取纬度和经度信息,并使用“信息窗口”在Google地图上绘制折线,它可以与标记一起使用。尽管信息窗口已设置好位置,但它仍显示在Google地图的顶部。我使用了以下代码:
<script type="text/javascript">
function initialize()
{
var map;
var markers = JSON.parse('<%=ConvertDataTabletoString() %>');
var infoWindow = new google.maps.InfoWindow({maxWidth:200,minWidth:200});
var marker;
var x=new google.maps.LatLng(16.697000,74.244000);
var stavanger=new google.maps.LatLng(markers[0].lat1, markers[0].lng1);
var london=new google.maps.LatLng(markers[0].lat, markers[0].lng);
var j=0;
var i=0;
var points=new Array();
var points2=new Array();
var mapProp = {
center:new google.maps.LatLng(markers[0].lat, markers[0].lng),
zoom:14,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map=new google.maps.Map(document.getElementById("map_canvas"),mapProp);
google.maps.event.addListener(map, "click", function(event)
{
var marker = new google.maps.Marker({
position: event.latLng,
animation: google.maps.Animation.DROP,
map: map
});
document.getElementById("txttolat").value = event.latLng.lat();
document.getElementById("txttolong").value = event.latLng.lng();
var pt=event.latLng.lat();
points[j]=event.latLng.lat();
points2[j]=event.latLng.lng();
j=j+1;
document.getElementById("txtlat").value = points[0];
document.getElementById("txtlong").value = points2[0];
// });
});
for (i = 0; i < markers.length; i++) {
var data = markers[i]
var stavanger2=new google.maps.LatLng(markers[i].lat1, markers[i].lng1);
var london2=new google.maps.LatLng(markers[i].lat, markers[i].lng);
var myTrip=[stavanger2,london2];
var flightPath=new google.maps.Polyline({
path:myTrip,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:10,
map: map,
title: data.title
});
// }
(function(flightPath, data) {
google.maps.event.addListener(flightPath, 'click', function(e) {
// alert('you clicked polyline');
infoWindow.setContent(data.description);
infoWindow.open(map,flightPath);
infoWindow.setPosition(e.latLng);
document.getElementById("txtname").value = data.title;
document.getElementById("txtlat").value = e.latLng.lat();
document.getElementById("txtlong").value = e.latLng.lng();
});
})(flightPath, data);
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
您必须更改的click
事件监听器flightpath
。
从谷歌API参考InfoWindow类的方法open()
定义为
open(map?:Map|StreetViewPanorama, anchor?:MVCObject)
在给定的地图上打开此InfoWindow。(可选)InfoWindow可以与锚关联。在核心API中,唯一的锚点是Marker类。但是,锚点可以是任何公开LatLng位置属性的MVCObject,还可以是用于显示pixelOffset的Point anchorPoint属性(请参见InfoWindowOptions)。anchorPoint是从锚点位置到InfoWindow尖端的偏移量。
您将flightPath
(Polyline)用作不提供位置属性的锚点。
因此,首先,您获得了点击的位置,然后只需在地图上打开信息窗口即可:
infoWindow.setPosition(e.latLng);
infoWindow.open(map);
// infoWindow.open(map,flightPath);
// infoWindow.setPosition(e.latLng);
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句