Openlayers 3替换失败的图块

Question

我们正在运行开放层3.15。 有时我们会掉落或失败。 目前，它什么也没有显示（这可能会使我们的用户感到困惑），因此我们希望将其替换为显示“无数据”之类的图块。 我试过捡起事件并替换磁贴的来源，例如

            source.on('tileloaderror', function(){
               source.setUrl('./images/map/failureTile.png');
            });

但是这样做的问题是，不是在一个图块上执行此操作，而是在整个图层上执行此操作，我们不希望这样做。

有谁知道我们如何仅针对失败的图块而不是整个图层执行此操作？

Answer 1

现在是2018年，但对于可能需要此服务的人来说。 在v5.3.0上测试

source.on('tileloaderror', function (event) {
  var tileLoadFunction = function (imageTile, src) {
    imageTile.getImage().src = './images/map/failureTile.png';
  };
  if (event.tile.tileLoadFunction_ != tileLoadFunction) {
    event.tile.tileLoadFunction_ = tileLoadFunction;
    event.tile.load();
  }
});

此代码依赖于私有函数event.tile.tileLoadFunction_被公开。

不幸的是，xnakos的答案在v5.3.0上不起作用，因为event.tile.getImage()已由内部错误处理程序替换为1x1画布图像。

还应注意，直接更改event.tile.src_似乎是一种选择，但由于缓存键或其他原因而无法使用。

Answer 2

未能加载的图块应具有不同的类（.olImageLoadError）。 您可以定义不显示这些项目的CSS规则。

.olImageLoadError { 
    display: none !important;
}

Answer 3

您可以尝试以下方法：

source.on('tileloaderror', function(event) {
    event.tile.getImage().src = './images/map/failureTile.png';
});

您需要event参数，该参数可以使失败的磁贴获取，以便您可以更改磁贴的图像。

警告：我使用tileloadend而不是tileloaderror测试了上面的代码，因为我的图块永远不会对我失败。 :)我使用Math.random()来模拟失败率，并且某些随机图块被指定的图像替换。 我无法想到上述代码无法正常工作的原因。 如果您确认它有效，我将从我的答案中删除此警告。 我在OpenLayers 3.14.2和OSM源上对其进行了测试。