谷歌方向api的问题

Question

用户访问我的网络应用程序并找到目标地址，但他找不到源位置并发布页面。未注册到Web应用程序的普通用户会添加源位置。

用户添加源位置后，他无法看到确切的方向图，而谷歌则显示默认地图。

以下是我们使用chrome控制台时的例外情况。

我在这里添加了代码，还有我得到的例外

Error Name:
main.js:41Uncaught TypeError:Object#<object> has no method 'Load'


function calcRoute() {
    showDirections();
  document.getElementById('directionsPanel').innerHTML="";
    initialize();
  var start = document.getElementById("txt_from").value;
  var end = getDestinationAdderss(document.getElementById('final_address').innerHTML);
  var request = {
    origin:start, 
    destination:end,
    travelMode: google.maps.DirectionsTravelMode.DRIVING
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    }
  });

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var myOptions = {
    zoom:7,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    center: chicago
  }
  map = new google.maps.Map(document.getElementById("map_canvas_directions"), myOptions);
  directionsDisplay.setMap(map);
  directionsDisplay.setPanel(document.getElementById("directionsPanel"));
}

Answer 1

您删除了Google sample中的一些代码。

directionsDisplay = new google.maps.DirectionsRenderer({
    'map': map,
    'preserveViewport': true,
    'draggable': true
});

如果您在适当的位置添加上面的代码，我希望您的代码能够再次运行。如果没有，你真的应该再次从示例代码开始，因为它确实有效。

Answer 2

调试屏幕截图表明，在Google Maps API引发错误之前，initialize（）是您文件中运行的最后一段代码。所以请查看（和/或在您的问题中提供该代码）。

更新：根据您的代码，首先检查的可能是确保存在ID为map_canvas_directions的元素和另一个ID为{{1的元素}}。没有足够的信息可以肯定地说，但如果我不得不猜测，你的UI变化摆脱了这些元素中的一个或另一个，但你的代码需要它们。

更新到更新：更换DirectionsAenderer（）构造函数中的内容，如@Arjan所示也是导致问题的原因，所以一定要尝试一下！