Mapbox.js在Ruby on Rails中呈现空白

我 - Ruby on Rails，HTML和CSS的初学者 - 我试图在Rails应用程序中呈现Mapbox.js地图。但是，地图不显示。正如您在图片中看到的那样，缩放控件确实显示正确。试图解决错误时，我遇到了this FAQ。我已确认我的访问令牌，地图ID和帐户使用限制不是问题。Mapbox.js在Ruby on Rails中呈现空白

下面是我的代码：

<script src='https://api.mapbox.com/mapbox.js/v3.0.1/mapbox.js'></script> 
<link href='https://api.mapbox.com/mapbox.js/v3.0.1/mapbox.css' rel='stylesheet'/> 

<div class="content"> 
    <% if @points[@unit.name] != nil && @points[@unit.name].length %> 

     <div id='map' style=" 
      position: relative; 
      margin-left: -10px; 
      bottom: 0; 
      width: 700px; 
      height: 700px;"> 
     </div> 

     <script type='text/javascript'> 
      L.mapbox.accessToken = 'heres-my-access-token'; 
      var map = L.mapbox.map('map', 'mapbox.satellite').setView([52.214360, 6.860573], 8); 
     </script> 

    <% end %> 

... other <div>s 

</div> 

<script> 
    $('map').show(); 
    map.invalidateSize(); 
</script>

我在一个相当大的应用程序工作，所以这个问题是由造型什么的可能引起的。我根据FAQ提示进行了检查，页面上的元素没有设置为最初“隐藏”的任何位置。我不太确定我的invalidateSize（）命令是否正确放置，但...

我现在几乎卡住了 - 有人有其他想法来解决这个问题吗？

来源

2017-03-08 Teresa

原来，问题是，它不会加载，因为内容的mapbox.js脚本安全政策指令。

我通过浏览器控制台发现了这一点，我以前没有想过尝试过。在这里，我发现了与mapbox相关的错误（例如'拒绝加载脚本，因为....'

我通过白名单映射框修复了它

来源

2017-03-08 14:17:15 Teresa

应该是$('#map').show();？

您还可以检查，如果这是太快射击，只运行它的文档准备即

$(function() { 
    $('#map').show(); 
    map.invalidateSize(); 
});

来源

2017-03-08 14:00:43 gwcodes

Mapbox.js在Ruby on Rails中呈现空白

回答

相关问题