Question

我正在尝试将图块放在边界框中以将它们传递到PDE。我正在使用以下代码，但不确定如何定义H.map.provider.TileProvider。

// I don't know how to define the tileProvider (this is what I have for now)
var tileProvider = new H.map.provider.TileProvider({
min: 12,
max: 15,
});

var overlayLayer = new H.map.layer.TileLayer(tileProvider, {
// Let's make it semi-transparent
opacity: 0.5
})

var boundingBox = new 
H.geo.Rect(map.getViewBounds().getTop(),map.getViewBounds().getLeft(),map.getVi 
ewBounds().getBottom(),map.getViewBounds().getRight());

var zoomLevel=14;
var cacheOnly=false;
var prioCenter=new H.math.Point(42.36099070901032,-71.09613451879883);

overlayLayer.requestTiles(boundingBox, zoomLevel, cacheOnly, prioCenter)

请让我知道如何定义TileProvider吗？

谢谢

Answer 1

您不能创建TileProvider实例，因为它是一个抽象类。您可以创建其子项的实例（ImageTileProvider，MarkerTileProvider等。请参阅开发人员站点中的文档）。

示例：

  // Create your own LocalObjectProvider and add some hierarchical objects:
  myProvider = new H.map.provider.LocalObjectProvider();
  myMap.addLayer(new H.map.layer.ObjectLayer(myProvider));

Answer 2

我知道这个问题已经一年了，但是答案可能会帮助其他人：

(function (map) {
    tileProvider = new H.map.provider.ImageTileProvider({
        min: 5, //min zoom factor
        max: 12,  //max zoom factor

定义一个包含3个参数的getURL函数：

getURL: function (column, row, zoom) {

在这里您应该返回包含图块的网址。您可以通过API甚至本地获取。最后，通过3个因素：zoom / col / row ..或图像的调用方式

在下一个示例中，图像存储在以缩放编号命名的文件夹中，图像的名称例如为：12-16.png

            return `.../${zoom}/${column}-${row}.png`;
        }
    });

请注意，如果您从外部提供商那里获得了平铺图像您应使用“版权”方法确认提供者：

tileProvider.getCopyrights = function (bounds, level) {
    return [{
        label: "© ....", // this will appear under the map
        alt: "© ...."
    }];
};

然后定义一个包含图块的图层。

var overlayLayer = new H.map.layer.TileLayer(tileProvider);

将图层添加到地图（假设您已经初始化了地图）

 map.addLayer(overlayLayer);
})(map);



(function(map) {
    tileProvider = new H.map.provider.ImageTileProvider({
        min: 5,
        max: 12,
        getURL: (column, row, zoom) =>
            `${site_url}/images-folder/tiles-folder/${zoom}/${column}_${row}.png`,
    });
    tileProvider.getCopyrights = (bounds, level) => {
        return [{
            label: "©...",
            alt: "©..."
        }];
    };
    let overlayLayer = new H.map.layer.TileLayer(tileProvider);
    map.addLayer(overlayLayer);
})(map);

如何定义图块提供者（H.map.provider.TileProvider）？

2 个答案: