Question

我试图通过使用fromLatLngToContainerPixel（LatLng）函数获取市场的像素坐标。我不知道如何使用它，但在搜索了一些例子之后我认为我得到了它。问题是函数返回总是“未经分解”。

Google maps api ref：https://developers.google.com/maps/documentation/javascript/reference?csw=1#MapCanvasProjection

请帮忙。

代码：

var map, overlay;

function initialize() {
var myLatlng = new google.maps.LatLng(-25.363882, 131.044922);
map = new google.maps.Map(document.getElementById('gMap'), {
    zoom : 13,
    center : myLatlng,
    disableDefaultUI: true,
    draggable: false,
    scrollwheel: false,
    disableDoubleClickZoom: true
});

var overlay = new google.maps.OverlayView();
overlay.draw = function () {};
overlay.setMap(map);

var marker = new google.maps.Marker({
    position: myLatlng, 
    optimized: false, 
    map:map
});

 var projection = overlay.getProjection(); 
        var pixel =     projection.fromLatLngToContainerPixel(marker.getPosition());
        console.log(pixel);
}
google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

来自documentation：

<强> getProjection() ： 返回与此OverlayView关联的MapCanvasProjection对象。在API调用onAdd之前，不会初始化投影。

onAdd() ：实现此方法以初始化overlay DOM元素。在使用有效映射调用setMap（）之后调用此方法一次。此时，窗格和投影将被初始化。

所以解决方案是： 实施onAdd() - 方法并访问onAdd()中的投影：

function initialize() {
  var myLatlng = new google.maps.LatLng(-25.363882, 131.044922);
  map = new google.maps.Map(document.getElementById('gMap'), {
    zoom: 13,
    center: myLatlng,
    disableDefaultUI: true,
    draggable: false,
    scrollwheel: false,
    disableDoubleClickZoom: true
  });

  var marker = new google.maps.Marker({
    position: myLatlng,
    optimized: false,
    map: map
  });

  var overlay = new google.maps.OverlayView();
  overlay.draw = function() {};
  overlay.onAdd = function() {
    var projection = this.getProjection();
    var pixel = projection.fromLatLngToContainerPixel(marker.getPosition());
    console.log(pixel);
  };
  overlay.setMap(map);
}

谷歌地图功能fromLatLngToContainerPixel（LatLng）不起作用

1 个答案: