Openlayers 3替换失败的瓦片

我们正在运行Open Layers 3.15。有时我们会看到丢失或失败的图块。目前它没有显示任何内容（可能会让我们的用户感到困惑），所以我们想用一个表示“无数据”或其他内容的图块来替换它。我试着拿起事件并更换瓷砖如Openlayers 3替换失败的瓦片

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

的信号源，但问题是这样的，而不是在1瓦这样做，它会为整个图层，我们不”我想要那个。

任何人都知道我们如何才能做到这一点只是失败的瓷砖，而不是整个层？

来源

2016-06-10 Status420

你能告诉我们你创建了什么样的图层吗？例如。瓷砖，图像等。作为澄清，'source.setUrl'应该有坐标的占位符。在请求实例化的URL之前，这些占位符会被实际值替换。 – xnakos

嗨，谢谢，我正在创建一个ol.layer.Tile – Status420

加载失败的磁贴应该有一个不同的类（.olImageLoadError）。你可以定义一个CSS规则不显示这些项目。

.olImageLoadError { 
    display: none !important; 
}

来源

2016-06-14 09:49:55

谢谢，但我想要做的是用我们自己的一个（这是一个写有'没有数据'的灰色瓦片）代替失败的瓦片，。当然，如果有一种方法可以通过css来实现，那也适用于我们。 – Status420

该类应该放在图像项上。你可以强制来源而不是显示。 –

我认为这是一个openlayers 2功能，而不是一个openlayers 3，我可以说。 – Status420

你可以试试这个：

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

您需要event参数，可以让你失败，这样就可以改变平铺的图像瓷砖。

警告：我使用tileloadend而不是tileloaderror测试了上面的代码，因为我的瓷砖永远不会失效。 :)我使用Math.random()模拟失败率和一些随机瓷砖被指定的图像取代。我想不出上述代码无法使用的原因。如果你确认它有效，我会从我的答案中删除这个警告。我在OpenLayers 3.14.2和OSM源代码上进行了测试。

来源

2016-06-14 11:03:31 xnakos

谢谢我的确尝试过，它确实会更改网址，但不会重新加载图像。 – Status420

Openlayers 3替换失败的瓦片

回答

相关问题