如何获取标记的像素坐标



每次单击地图时,我的代码都会在地图上放置一个标记。目标是获得每个时间标记的纬度/经度坐标以及像素坐标。到目前为止,我只成功地获得了lat/lon-coord。现在的下一步是将这些作为输入并计算像素坐标。

<script>
function initMap() {41.85, -87.65
var myLatlng = {lat: 41.85, lng: -87.65};
var map = new google.maps.Map(
document.getElementById('map'), {zoom: 18,
center: myLatlng,
disableDefaultUI: false,
mapTypeId: 'satellite',
zoomControl: true,
mapTypeControl: true,
scaleControl: true,
streetViewControl: false,
rotateControl: false,
fullscreenControl: true});
map.setOptions({draggableCursor:'default'});
map.addListener('click', function(marker){
marker = new google.maps.Marker({map: map,
clickable: false,
position: marker.latLng,
})
var markerposLat = marker.getPosition().lat();
var markerposLon = marker.getPosition().lng();

function pixl(markerposLat,markerposLon){
var projection = map.getProjection();
var bounds = map.getBounds();
var topRight = projection.fromLatLngToPoint(bounds.getNorthEast());
var bottomLeft = projection.fromLatLngToPoint(bounds.getSouthWest());
var scale = Math.pow(2, map.getZoom());
var worldPoint = projection.fromLatLngToPoint(markerposLat,markerposLon);
return [Math.floor((worldPoint.x - bottomLeft.x) * scale), Math.floor((worldPoint.y - topRight.y) * scale)]
};
localStorage["pixl"] = JSON.stringify(pixl);
localStorage["markerLat"] = JSON.stringify(markerposLat);
localStorage["markerLon"] = JSON.stringify(markerposLon);
console.log(localStorage["pixl"],localStorage["markerLat"], localStorage["markerLon"]);
});
}
</script>

函数pixl始终未定义。我意识到这是一个被问了很多次的问题。事实上,我已经尝试了很多方法。我的出发点是:将lat-lon转换为像素并返回,当然还有:显示像素和瓦片坐标。我看不出这个问题。

请注意,fromLatLngToPoint方法需要一个google.maps.LatLng类作为其参数。来自文件:

fromLatLngToPoint(latLng[,point](

参数:
latLng:latLng
point:point optional

返回值:point optional

从latLng圆柱体转换到point平面。该接口指定了一个函数,用于实现从给定LatLng值到地图投影上的世界坐标的转换。当地图API需要在屏幕上绘制位置时,它会调用此方法。投影对象必须实现此方法,但如果投影无法计算点,则可能返回null。

所以在你的代码中,我会这样做:

var worldPoint = projection.fromLatLngToPoint(marker.getPosition());

我(和@geocodezip(注意到的另一件事是,您没有向pixl函数传递参数。这就是为什么您要获得undefined响应。为了获得正确的值,您应该包含如下参数:

localStorage["pixl"] = JSON.stringify(pixl((markerposLat,markerposLon)));

这是工作小提琴。

相关内容

  • 没有找到相关文章

最新更新