Javascript 将Google地图集成到当前的Rails应用程序中_Javascript_Html_Ruby On Rails_Ruby_Google Maps

Javascript 将Google地图集成到当前的Rails应用程序中

javascript html ruby-on-rails ruby google-maps

Javascript 将Google地图集成到当前的Rails应用程序中,javascript,html,ruby-on-rails,ruby,google-maps,Javascript,Html,Ruby On Rails,Ruby,Google Maps,我是新手。我正在做一个项目，我需要将google地图集成到当前的rails应用程序中。我有谷歌地图javascript文件正常工作。我的问题出现在尝试将它与当前的rails应用程序集成时。我已经设置了html.erb文件来引用相应的google maps js文件，但是每次加载页面时，控制台中都会出现一个错误 “加载资源失败：服务器响应状态为404（未找到）” 关于对应的js文件。然而，当我将javascript代码复制到html.erb文件中时，GoogleMaps可以很好地加载。任何关于我错

我是新手。我正在做一个项目，我需要将google地图集成到当前的rails应用程序中。我有谷歌地图javascript文件正常工作。我的问题出现在尝试将它与当前的rails应用程序集成时。我已经设置了html.erb文件来引用相应的google maps js文件，但是每次加载页面时，控制台中都会出现一个错误

“加载资源失败：服务器响应状态为404（未找到）”

关于对应的js文件。然而，当我将javascript代码复制到html.erb文件中时，GoogleMaps可以很好地加载。任何关于我错过了什么让这个设置正常工作的想法，在过去的24小时里我一直在为这个失去理智，我将非常感谢任何我能得到的帮助。提前谢谢

编辑：在下面添加代码和错误

这是谷歌地图js的核心，我已经注释掉了除了下面加载核心谷歌地图之外的所有内容

var My_Map = angular.module('My_Map' , []);

My_Map.directive("myMaps", function() {
return {
    restrict: 'E',
    template: '<div></div>',
    replace: true,
    link: function (scope, element, attrs) {
        var mapOptions = {
            center: new google.maps.LatLng(34.0, -118.4),
            zoom: 12,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById(attrs.id),
            mapOptions);
    }
};
});

此外，文件结构与rails兼容，将js文件放置在 app/assets/javascripts/app html erb文件位于

app/views/dispatchers

关于如何在Rails中组织、命名和链接资产文件，您是否遵循了此指南：？向我们展示有问题的代码、添加JS文件的位置、控制台的完整错误等。。。这将极大地帮助你获得好建议的几率！我相信我已经阅读了文档，我似乎已经完成了概述的步骤。。。

<html ng-app="My_Map">

<head>

<%= javascript_include_tag "dispatcher_script", "data-turbolinks-track" => true %>

<title>
    Google Maps
</title>

<style>

    #map-canvas{
        height:750px;
        width:1400px;
        border:2px solid red;
    }

</style>

</head>

<body>

<my-maps id="map-canvas"></my-maps>

<script type="text/javascript"
        src="https://maps.googleapis.com/maps/api/js?key=KEYHERE">
</script>

<script type="text/javascript"
            src="/app/assets/javascripts/angular-animate.min.js.map">
</script>

<script type="text/javascript"
        src = "/app/assets/javascripts/app/map_app.js">
</script>

Uncaught ReferenceError: google is not defined dispatcher_script.js:1646
Failed to load resource: the server responded with a status of 404 (Not Found)      https://NAME.herokuapp.com/app/assets/javascripts/app/map_app.js
Failed to load resource: the server responded with a status of 404 (Not Found) https://NAME.herokuapp.com/app/assets/javascripts/angular-animate.min.js.map