谷歌地图 API v3 未正确显示位置答案

【问题标题】：Google maps API v3 not showing position correctly谷歌地图 API v3 未正确显示位置
【发布时间】：2013-11-14 03:13:58
【问题描述】：

我正在尝试应用 Google Maps API v.3，它在 Ruby on Rails 应用程序中按纬度和经度显示用户的位置。但是当我访问应该出现地图的页面时，我有空白 div，直到我用它刷新页面。然后地图正确显示。这是我使用的脚本。

(function() {
  $(document).ready(function() {
    var map, mapOptions, marker, myLatlng;
    myLatlng = new google.maps.LatLng($("p#latitude").html(), $("p#longitude").html());
    mapOptions = {
      zoom: 16,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    return marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title: "Ahoy!"
    });
  });

我还包括<script src="http://maps.google.com/maps/api/js?sensor=false" style=""></script> 和<script src="http://maps.gstatic.com/intl/en_us/mapfiles/api-3/14/11/main.js" type="text/javascript"></script>

可能是什么问题？

我从 Gemfile 中删除了 gem turbolinks 并从 application.js 中删除了“require turbolinks”，现在它可以正常工作了。

【问题讨论】：

这是你的全部代码吗？
对于js？当然。当然，所有这些都包含在 html 文档中，其中有两个容器“#latitude”和“#longitude”。但即使我不是用变量而是用确切的数字传递坐标 - 它也只能在页面刷新后工作。

标签： javascript api google-maps google-maps-api-3

【解决方案1】：

您似乎已经回答了自己的问题，但以防万一其他人查看：当您使用 turbolinks 时，页面之间不会出现 document.ready ——本质上，turbolinks 将您的整个应用程序视为一个页面。

您的问题有两种解决方案：一，摆脱涡轮链接，您已经这样做了；或者两个，将你的 js 附加到特定的 turbolink 事件，例如 page:load。

【讨论】：