2013-07-01 65 views
0

我试图使用Google Maps API将标记添加到我的地图上。我在我的application.html.erb脚本标记中调用了addMarker函数,并且我不能确定为什么函数在我的map.js中存在时没有定义。未捕获的参考错误addMarker未定义

看看下面的代码,我相信这是显而易见的事,但我相信新的Web开发,并已在网上搜索了很久,无法看到我在做什么错。

非常感谢!

这是我map.js ......

$(document).ready(function(){ 


    function initialize() { 
    var mapOptions = { 
     center: new google.maps.LatLng(-34.397, 150.644), 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    var map = new google.maps.Map(document.getElementById("map-canvas"), 
    mapOptions); 

} 

function addMarker(latitude, longitude, title) { 
     var marker = new google.maps.Marker({ 
      position:new google.maps.LatLng(latitude, longitude), 
      map : map, 
      title : title 
     }); 
     } 



google.maps.event.addDomListener(window, 'load', initialize); 


}); 

这是我application.html.erb

<!DOCTYPE html> 
<html> 
<head> 
    <title>EventsMapper</title> 
    <%= stylesheet_link_tag "application", :media => "all" %> 
    <%= javascript_include_tag "application" %> 
    <%= csrf_meta_tags %> 

    <!-- <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> --> 
    <script type="text/javascript" 
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC74gnSe7p17ulcZUzgPJHxYurGg2bjRYg&sensor=false"> 
    </script> 

    <script type="text/javascript"> 

     $(function() { 
     // initMap(); 

     //add here var items that converts ToDoItems to JSON, take out the var to make to global 

     <% Yoga.all.each do |item| %> 

     addMarker(<%=item.latitude%>, <%=item.longitude%>, '<%=item.name%>'); 
     <%end%> 
    }); 
    </script> 

</head> 

<body> 
    <!-- <input type="text" id="autocomplete"> --> 
    <div id='googlemap'> 
    <div id="map-canvas"> 
    </div> 
    </div> 

    <%= yield %> 

</body> 
</html> 

回答

0

因为你的附加标记功能是文件准备好功能里面写。从文件准备好的范围中删除功能并将其放置在外面。

+0

非常感谢,整理出来!如果你喜欢,请接受答案 – user2508443

+0

。那它是如何工作:) –

+0

我要接受它,但我不能工作如何,我都试过投了你的答案,但只会让我做,如果我有15声誉。有没有另一种方法来做到这一点? – user2508443

相关问题