我正在使用谷歌地图。我想在标记点击时显示自定义信息窗口。为此，我的自定义信息窗口的左上角应该覆盖标记。
问题是我无法获得准确的 (x,y)，即地图上标记的 map-div 位置。我第一次可以使用：
var mposition = map.fromLatLngToDivPixel(marker.getLatLng());
pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(mposition.x,mposition.y));
但是当我拖动地图时，x,y 中的标记位置保持不变，因此我的信息窗口出现在错误的位置。 请帮助我，即使在拖动/缩放之后，我如何才能在地图上获得与 div 相关的确切位置。
谢谢。
【问题讨论】：
标签： google-maps
var overlay = new google.maps.OverlayView();
overlay.draw = function() {};
overlay.setMap(map);
var proj = overlay.getProjection();
var pos = marker.getPosition();
var p = proj.fromLatLngToContainerPixel(pos);
您现在可以通过 p.x 和 p.y 访问您的像素坐标。
或者，您可以尝试将 fromLatLngToDivPixel 更改为 fromLatLngToContainerPixel。在平移地图之前，这两个函数将返回相同的值，但在移动或操纵地图中的任何内容之后，DivPixel 函数将返回与其原始位置有关的更新值，即：+x / +y 像素。 ContainerPixel 函数将返回关于容器 div 左上角的值。
【讨论】：
这是我没有类的代码：
var map = null;
var ERROR_MESSAGES = {
GPS_OFF: "please turn on GPS from your settings.",
GPS_TIME_OUT: "maybe you are in a building or something, get into an open area.",
GPS_UNKOWN: "Error happened while getting location, please try again later."
};
var geolocationManager = new GeolocationManager();
function success(position) {
var coords = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
var options = {
zoom: 18,
center: coords,
mapTypeControl: false,
disableDefaultUI: true,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("mapcontainer"), options);
var marker = new google.maps.Marker({
position: coords,
map: map,
icon:'e-pin.png',
animation:google.maps.Animation.BOUNCE
});
}
function findPosition(onSuccess) {
geolocationManager.isLocationEnabled(function (isEnabled) {
if (!isEnabled) {
Util.Alert(ERROR_MESSAGES.GPS_OFF);
return;
}
geolocationManager.find(onSuccess, function (e) {
Util.Alert(ERROR_MESSAG`enter code here`ES.GPS_UNKOWN);
});
}, function (e) {
geolocationManager.find(onSuccess, function (e) {
Util.Alert(ERROR_MESSAGES.GPS_UNKOWN);
});
});
}
function watchPosition () {
geolocationManager.watch();
}
findPosition(success);
function getLocation() {
if (!map)
findPosition(success);
else
findPosition(showPosition);
/*if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}*/
}
function setCurrentPosition() {
findPosition(function (position) {
var coords = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
map.panTo(coords);
});
}
function showPosition(position) {
map.setCenter(new google.maps.LatLng(position.coords.latitude,position.coords.longitude));
}
【讨论】：
在努力让它工作一段时间后，阅读其他帖子和文档等，这里有一些更新的代码，所有内容都在正确的位置：
var Demo = {
overlay:null,
map:null,
//callback for route request to DirectionsService
showDirections: function(dirResult, dirStatus) {
//...
//set up overlay
Demo.overlay = new google.maps.OverlayView();
Demo.overlay.draw = function() {};
Demo.overlay.setMap(Demo.map);
//add listener to get x y once map is drawn
google.maps.event.addListener(Demo.map, 'idle', function(){
var proj = Demo.overlay.getProjection();
var xy = proj.fromLatLngToContainerPixel(pos);
//...
});
},
}
【讨论】：
【讨论】：