0

我有一个学生正在使用 MapBox.js (v1.6.0) 来显示他们在 TileMill 中制作的一些图块。这些图块使用 TileMill（文档）提供的工具提示功能来添加一些交互性。我的学生还使用 MapBox Streets 图层来提供道路等的详细视图。问题是，当我在地图中同时使用这两个图层时，瓷砖的交互性不起作用。

这是不起作用的代码：

var map = L.mapbox.map("map");

var tilesOSM = L.mapbox.tileLayer("username.id1");
var tilesTileMill = L.mapbox.tileLayer("username.id2");

map
    .addLayer(tilesOSM)
    .addLayer(tilesTileMill)
    .setView(L.latLng(61, -160.5), 4)
    .setMaxBounds(L.latLngBounds(L.latLng(50,-180), L.latLng(72,-129)));

我们已经尝试了该代码的多次迭代，但我们让它工作的唯一方法是使用 L.mapbox.map(3) 方法，然后使用 L.map.addLayer() 函数的 _ insertAtTheBottom_ 参数。

var map = L.mapbox.map("map", "username.id2", {});

map
    .addLayer(L.mapbox.tileLayer("username.id1"), true)
    .setView(L.latLng(61, -160.5), 4)
    .setMaxBounds(L.latLngBounds(L.latLng(50,-180), L.latLng(72,-129)));

我的问题是三个方面。

  1. 这两种实现有什么区别？
  2. 为什么使用 L.mapbox.tileLayer() 创建的 tileLayer 与使用 L.mapbox.map(3) 创建和自动添加的不同？
  3. 是否有计划在未来对 API 的更改中解决这种不连续性，或者是否会在 TileMill 2 中放弃对交互式瓷砖的支持？
4

1 回答 1

1

这两种实现有什么区别？

如果您查看L.mapbox.map 在内部做什么，它会为您指定的图层添加一个 gridLayer 和 gridControl。基本上，地图构造函数会做出它可以做出的所有安全假设，并自动执行它们以方便起见。

为什么使用 L.mapbox.tileLayer() 创建的 tileLayer 与使用 L.mapbox.map(3) 创建和自动添加的不同？

是一样的——当你使用 时，混合了一个 gridLayer 和 gridControl L.mapbox.map(3)，这就是让事情变得互动的原因。

是否有计划在 API 的未来更改中解决这种不连续性

它不像 API 设计那样不连续：我们决定让 tileLayers 与 gridLayers 和 gridControls 分离，以便您可以混合和匹配它们 - 如果您想切换交互功能来自哪个层，或者在不禁用 tile 层的情况下禁用交互性，你可以。

TileMill 2 会放弃对交互式瓷砖的支持吗？

不，您可以使用 TileMill 2 并查看它如何支持交互性。我们不会删除或逐步淘汰它，尽管矢量瓷砖将有新的交互方法。

对于你的第二个例子，你会想要这样的东西：

var map = L.mapbox.map("map", "username.id2", {});
var gridLayer = L.mapbox.gridLayer("username.id1").addTo(map);
var gridControl = L.mapbox.gridControl(gridLayer).addTo(map);

map
    .addLayer(L.mapbox.tileLayer("username.id1"), true)
    .setView(L.latLng(61, -160.5), 4)
.setMaxBounds(L.latLngBounds(L.latLng(50,-180), L.latLng(72,-129)));
于 2014-02-21T15:55:12.920 回答