使用RoR 4.1.4
我正在尝试使用 leaflet-rails gem 。我按照 github 页面中概述的步骤进行操作,但是当我尝试加载 map 时,我看到
ReferenceError: L is not defined
在浏览器控制台中。这显然意味着 gem 的帮助程序正在加载并执行,但它找不到 leaflet.js
文件。
但是,页面的头部显示 /assets/leaflet.js
正在被引用,并且它实际上就在那里。
当我查看生成的代码时:
<div id="map"></div>
<script>
var map = L.map('map')
map.setView([-54.0, 6.08], 16)
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
maxZoom: 18,
subdomains: '',
}).addTo(map)
</script>
</div>
<script src="/assets/jquery.js?body=1" data-turbolinks-track="true"></script>
<!-- all the other scripts loaded -->
<script src="/assets/exif.js?body=1" data-turbolinks-track="true"></script>
<script src="/assets/leaflet.js?body=1" data-turbolinks-track="true"></script>
<!-- some more scripts -->
因此,gem 在 map div 的正下方添加了一个脚本,只有这样,由于 sprockets 机制等原因,其他脚本才会被加载。对我来说,显然脚本不可能加载 leaflet.js,因为之后会被引用!
所以...我是否误解了 RoR 如何处理 gems 和 javascript?它一定在某个时候一直在工作......
这是我的/app/assets/javascript/application.js:
//= require jquery
//= require jquery.ui.widget
// Here I load a whole bunch of javascripts which are related to jquery-fileupload, cut for brevity
//= require bootstrap.min
//= require bootbox.min
//= require bootstrap-datepicker
//= require exif
//= require leaflet
//= require turbolinks
//= require_tree .
最佳答案
事实证明这可能是一些 RoR 特定问题。
许多网站建议放置
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
在文件末尾加载 JavaScript 的行,以加快页面显示速度。随着leaflet-rails
gem,这不太好,并且会产生上述问题。如果将同一行放入 <head>
部分,问题就消失了......
附注不过,我仍然对 gem 有疑问,现在我明白了
Error: No value provided for variable {s}
如果我用“http://{s}.tile.osm.org/{z}/{x}/{y}.png
”替换“http://a.tile.osm.org/{z}/{x}/{y}.png"
”,它就可以工作...但不要认为它应该那样工作...但这是一个不同的问题...
关于javascript - rails 上的 ruby : leaflet-rails not loading,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27322432/