谷歌地图的偏移中心（错误：无法读取属性'fromLatLngToContainerPixel'undefined）

我请求使用Google Maps API的路由，之后路由会自动居中，因为我正在使用“preserveViewport：false”选项。现在我想让这个中心稍微转移一点。所以，我想它通过下面的代码：谷歌地图的偏移中心（错误：无法读取属性'fromLatLngToContainerPixel'undefined）

var overlay_1 = new google.maps.OverlayView(); 
overlay_1.draw = function() {}; 
overlay_1.setMap(map_1); 

var point_1 
point_1 = overlay_1.getProjection().fromLatLngToContainerPixel(map_1.getCenter()); 
point_1.x = point_1.x + 300; 
map_1.setCenter(overlay_1.getProjection().fromContainerPixelToLatLng(point_1));

当我开始的网页，我得到了以下错误：

Uncaught TypeError: Cannot read property 'fromLatLngToContainerPixel' of undefined

正如你可以在我的Printscreen看到，代码工作时，我把它放进我的控制台。

有没有人有任何想法，为什么我在加载我的网页时得到错误？

来源

2017-09-14 Florian Kittelmann

在.getProjection方法返回有效结果之前，您必须等待projection_changed事件触发叠加层。

var overlay_1 = new google.maps.OverlayView(); 
overlay_1.draw = function() {}; 
overlay_1.setMap(map_1); 

var point_1; 
google.maps.event.addListener(overlay_1, 'projection_changed', function() { 
    point_1 = overlay_1.getProjection().fromLatLngToContainerPixel(map_1.getCenter()); 
    point_1.x = point_1.x + 300; 

    map_1.setCenter(overlay_1.getProjection().fromContainerPixelToLatLng(point_1)); 
});

proof of concept fiddle

代码片段：

function initialize() { 
 
    var map_1 = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     center: new google.maps.LatLng(37.4419, -122.1419), 
 
     zoom: 13, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    var overlay_1 = new google.maps.OverlayView(); 
 
    overlay_1.draw = function() {}; 
 
    overlay_1.setMap(map_1); 
 

 
    var point_1; 
 
    google.maps.event.addListener(overlay_1, 'projection_changed', function() { 
 
    point_1 = overlay_1.getProjection().fromLatLngToContainerPixel(map_1.getCenter()); 
 
    point_1.x = point_1.x + 300; 
 
    map_1.setCenter(overlay_1.getProjection().fromContainerPixelToLatLng(point_1)); 
 
    }); 
 
} 
 
google.maps.event.addDomListener(window, "load", initialize);

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map_canvas"></div>

来源

2017-09-14 14:37:46 geocodezip

你是对的，我不再收到错误消息。但我仍然有问题。正如我所说，在我想要转变之前，我首先要求一条路线。请看看这个[链接]（http://jsfiddle.net/14h9svhc/2/）。通过删除它正在工作的两条线：'var waypoints_1 = processWaypoints（[['' - 42.4008174'，'173.681386']，[' - 42.1550941'，'173.9284645']，[' - 41.6695819'，'174.0720845']， '-41.2905926'， '174.0010044']，]）; \t \t \t \t \t requestRouteReisen（-43.5320544，172.6362254，-41.0332502,173.0192419，waypoints_1，'blue'，map_1）; ' –

请用[mcve]提出另一个问题来说明你的新问题。 – geocodezip

谷歌地图的偏移中心（错误：无法读取属性'fromLatLngToContainerPixel'undefined）

回答

相关问题