使用 Gmaps4rails gem 地图的首次加载时间应用加载不会加载
First load time app loads using Gmaps4rails gem map won't load
我已经为此苦苦思索了 2 天,并且阅读了这里的所有 post 并尝试了几乎所有的方法。这是我的 JS,第一页刷新后一切正常,但启动新浏览器时,第一次调用地图失败。我收到错误:
Uncaught TypeError: Cannot read property 'addMarker' of undefined
这是我的代码:我尝试了很多不同的方法。请问有人可以帮我解决这个问题吗!?
$(document).on("ready page:load", getDivData);
function getDivData(){
var data = $('#gmap').data('mapdata');
renderGoogleMap(data);
}
function renderGoogleMap(data) {
var mapData = data;
handler = Gmaps.build('Google');
handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){
markers = handler.addMarkers(mapData);
handler.bounds.extendWith(markers);
handler.fitMapToBounds();
handler.getMap().setZoom(12);
});
}
//= require jquery-2.1.1.min
//= require jquery-ui
//= require jquery_ujs
//= require_self
//= require autocomplete-rails
//= require twitter/bootstrap
//= require bootstrap-dark
//= require underscore
//= require events
//= require event_show
//= require turbolinks
//= require gmaps/google
在我的HTMLHeader
<title>MyApp</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<script src="//maps.google.com/maps/api/js?v=3.13&sensor=false&libraries=geometry" type="text/javascript"></script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js' type='text/javascript'></script>
发现错误。仅当 var data returns 为真时,才应调用 getDivData() 函数。更新方法:
function getDivData(){
var data = $('#gmap').data('mapdata');
if(data){
renderGoogleMap(data);
}
}
我已经为此苦苦思索了 2 天,并且阅读了这里的所有 post 并尝试了几乎所有的方法。这是我的 JS,第一页刷新后一切正常,但启动新浏览器时,第一次调用地图失败。我收到错误:
Uncaught TypeError: Cannot read property 'addMarker' of undefined
这是我的代码:我尝试了很多不同的方法。请问有人可以帮我解决这个问题吗!?
$(document).on("ready page:load", getDivData);
function getDivData(){
var data = $('#gmap').data('mapdata');
renderGoogleMap(data);
}
function renderGoogleMap(data) {
var mapData = data;
handler = Gmaps.build('Google');
handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){
markers = handler.addMarkers(mapData);
handler.bounds.extendWith(markers);
handler.fitMapToBounds();
handler.getMap().setZoom(12);
});
}
//= require jquery-2.1.1.min
//= require jquery-ui
//= require jquery_ujs
//= require_self
//= require autocomplete-rails
//= require twitter/bootstrap
//= require bootstrap-dark
//= require underscore
//= require events
//= require event_show
//= require turbolinks
//= require gmaps/google
在我的HTMLHeader
<title>MyApp</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<script src="//maps.google.com/maps/api/js?v=3.13&sensor=false&libraries=geometry" type="text/javascript"></script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js' type='text/javascript'></script>
发现错误。仅当 var data returns 为真时,才应调用 getDivData() 函数。更新方法:
function getDivData(){
var data = $('#gmap').data('mapdata');
if(data){
renderGoogleMap(data);
}
}