OpenLayers 3可以使用WebSQL或IndexedDB来缓存地图图块

Question

我正在使用OpenLayers 3,我见过的所有离线示例都只包含localStorage来保存和检索地图图块.问题是localStorage限制在大约5兆字节,这对我的应用来说太小了.

如果我使用的是Leaflet,我可以通过在getTileUrl函数中编写自己的自定义存储解决方案来扩展L.TileLayer.

在OpenLayers 3中有类似的东西吗？我真的很想在localStorage上使用IndexedDb甚至WebSQL.

Answer 1

在OpenLayers 3中,您可以使用自定义tileLoadFunction配置切片图层源以实现您自己的存储解决方案:

new WhateverTileSource({
  tileLoadFunction: function(imageTile, src) {
    var imgElement = imageTile.getImage();
    // check if image data for src is stored in your cache
    if (inCache) {
      imgElement.src = imgDataUriFromCache;
    } else {
      imgElement.onload = function() {
        // store image data in cache if you want to
      }
      imgElement.src = src;
    }
  }
});