javascript - Rails 5 - Google map - Javascript 错误 - initMap 不是函数 - 修复一个 js 问题会产生另一个问题

Question

多年来，我一直在努力弄清楚如何在我的 Rails 应用程序中使用谷歌地图。我目前正在尝试使用 Rails 5。

我也一直在努力弄清楚如何让我的 javascript 在生产环境中工作。

我最近对这些挑战的尝试在 production issue post 中有所概述。还有这个google maps post .

经过长时间的codementor session ，生产环境javascript问题似乎已经通过移动解决了:

<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

从 head 标签到 body 标签的结尾。

但是，在执行此操作时，google maps javascript 现在不起作用。它给出了一个错误:

initMap is not a function

我看到很多人提出这个问题，包括here .

我已经尝试了这篇文章中概述的解决方案，即替换此脚本:

<script src="https://maps.googleapis.com/maps/api/js?key=<%= ENV["GOOGLE_MAPS_API_KEY"] %>&callback=initMap"
    async defer></script> -->

在我的地址 View 文件中使用这个脚本:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=<%= ENV['GOOGLE_MAPS_API_KEY'] %>" async defer></script>

主要区别在于删除了“&callback=initMap”。这在控制台检查器中没有错误。但是，它也不显示 map 。

我通过修复生产问题创建了一个新问题。

任何人都可以看到我需要做什么才能获得谷歌地图渲染(不破坏生产环境 js)吗？

Answer 1

我已经设法让它在一个 rails 5 项目上工作，头部有以下内容(注意这是一个 slim 语法)

= javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
script[async defer src="https://maps.googleapis.com/maps/api/js?key=#{ENV['GOOGLE_MAP_API']}&callback=initMap"] 

然后在一个 js 文件 (map.coffee) 中，我有以下内容:

jQuery ->

  window.initMap = ->
    # your map code here