javascript - 是否可以在单个 HTML 页面中包含多个 leaflet/mapbox map ？

Question

我正在开发一个单页应用程序，它有两个 map ，如下所示:

标记:

<div id = "page1>
  <div id='map'></div>
</div>

<div id = "page2>
  <div id='map2'></div>
</div>

代码:

  L.mapbox.accessToken = 'pk.eyJ1IjoicmV5bmVyb25nIiwiYSI6ImNpZzB2ZWs4MDBpdG90emt2ZjZ0bHI5dWEifQ.sP6kg2gGfN7NBAOYRasyeA';
  var map = L.mapbox.map('map', 'mapbox.streets');
  var map2 = L.mapbox.map('map2', 'mapbox.streets');

但是，执行此操作时 map 不起作用。有没有办法做到这一点，或者在单个 HTML 页面中根本不可能有多个 leaflet/mapbox map ？

Answer 1

我相信如果您将脚本放在包含 div 中，这些脚本将会发生冲突。可能有一种方法可以操纵脚本来工作。解决这些问题的一种方法是仔细检查并检查 map2 的脚本，确保未提及“map”，因为这可能会导致冲突。