@deck.gl/geo-layers/dist/es5/tile-layer/tile-layer.js

deck.gl layers supporting geospatial use cases and GIS formats

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _typeof = require("@babel/runtime/helpers/typeof");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _core = require("@deck.gl/core");

var _layers = require("@deck.gl/layers");

var _tileset2d = _interopRequireWildcard(require("./tileset-2d"));

var _utils = require("./utils");

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }

var defaultProps = {
  data: [],
  dataComparator: _utils.urlType.equals,
  renderSubLayers: {
    type: 'function',
    value: function value(props) {
      return new _layers.GeoJsonLayer(props);
    },
    compare: false
  },
  getTileData: {
    type: 'function',
    optional: true,
    value: null,
    compare: false
  },
  onViewportLoad: {
    type: 'function',
    optional: true,
    value: null,
    compare: false
  },
  onTileLoad: {
    type: 'function',
    value: function value(tile) {},
    compare: false
  },
  onTileUnload: {
    type: 'function',
    value: function value(tile) {},
    compare: false
  },
  onTileError: {
    type: 'function',
    value: function value(err) {
      return console.error(err);
    },
    compare: false
  },
  extent: {
    type: 'array',
    optional: true,
    value: null,
    compare: true
  },
  tileSize: 512,
  maxZoom: null,
  minZoom: 0,
  maxCacheSize: null,
  maxCacheByteSize: null,
  refinementStrategy: _tileset2d.STRATEGY_DEFAULT,
  zRange: null,
  maxRequests: 6,
  zoomOffset: 0
};

var TileLayer = function (_CompositeLayer) {
  (0, _inherits2.default)(TileLayer, _CompositeLayer);

  var _super = _createSuper(TileLayer);

  function TileLayer() {
    (0, _classCallCheck2.default)(this, TileLayer);
    return _super.apply(this, arguments);
  }

  (0, _createClass2.default)(TileLayer, [{
    key: "initializeState",
    value: function initializeState() {
      this.state = {
        tileset: null,
        isLoaded: false
      };
    }
  }, {
    key: "finalizeState",
    value: function finalizeState() {
      var _this$state$tileset;

      (_this$state$tileset = this.state.tileset) === null || _this$state$tileset === void 0 ? void 0 : _this$state$tileset.finalize();
    }
  }, {
    key: "isLoaded",
    get: function get() {
      var tileset = this.state.tileset;
      return tileset.selectedTiles.every(function (tile) {
        return tile.isLoaded && tile.layers && tile.layers.every(function (layer) {
          return layer.isLoaded;
        });
      });
    }
  }, {
    key: "shouldUpdateState",
    value: function shouldUpdateState(_ref) {
      var changeFlags = _ref.changeFlags;
      return changeFlags.somethingChanged;
    }
  }, {
    key: "updateState",
    value: function updateState(_ref2) {
      var props = _ref2.props,
          changeFlags = _ref2.changeFlags;
      var tileset = this.state.tileset;
      var propsChanged = changeFlags.propsOrDataChanged || changeFlags.updateTriggersChanged;
      var dataChanged = changeFlags.dataChanged || changeFlags.updateTriggersChanged && (changeFlags.updateTriggersChanged.all || changeFlags.updateTriggersChanged.getTileData);

      if (!tileset) {
        tileset = new _tileset2d.default(this._getTilesetOptions(props));
        this.setState({
          tileset: tileset
        });
      } else if (propsChanged) {
        tileset.setOptions(this._getTilesetOptions(props));

        if (dataChanged) {
          tileset.reloadAll();
        } else {
          this.state.tileset.tiles.forEach(function (tile) {
            tile.layers = null;
          });
        }
      }

      this._updateTileset();
    }
  }, {
    key: "_getTilesetOptions",
    value: function _getTilesetOptions(props) {
      var tileSize = props.tileSize,
          maxCacheSize = props.maxCacheSize,
          maxCacheByteSize = props.maxCacheByteSize,
          refinementStrategy = props.refinementStrategy,
          extent = props.extent,
          maxZoom = props.maxZoom,
          minZoom = props.minZoom,
          maxRequests = props.maxRequests,
          zoomOffset = props.zoomOffset;
      return {
        maxCacheSize: maxCacheSize,
        maxCacheByteSize: maxCacheByteSize,
        maxZoom: maxZoom,
        minZoom: minZoom,
        tileSize: tileSize,
        refinementStrategy: refinementStrategy,
        extent: extent,
        maxRequests: maxRequests,
        zoomOffset: zoomOffset,
        getTileData: this.getTileData.bind(this),
        onTileLoad: this._onTileLoad.bind(this),
        onTileError: this._onTileError.bind(this),
        onTileUnload: this._onTileUnload.bind(this)
      };
    }
  }, {
    key: "_updateTileset",
    value: function _updateTileset() {
      var tileset = this.state.tileset;
      var _this$props = this.props,
          zRange = _this$props.zRange,
          modelMatrix = _this$props.modelMatrix;
      var frameNumber = tileset.update(this.context.viewport, {
        zRange: zRange,
        modelMatrix: modelMatrix
      });
      var isLoaded = tileset.isLoaded;
      var loadingStateChanged = this.state.isLoaded !== isLoaded;
      var tilesetChanged = this.state.frameNumber !== frameNumber;

      if (isLoaded && (loadingStateChanged || tilesetChanged)) {
        this._onViewportLoad();
      }

      if (tilesetChanged) {
        this.setState({
          frameNumber: frameNumber
        });
      }

      this.state.isLoaded = isLoaded;
    }
  }, {
    key: "_onViewportLoad",
    value: function _onViewportLoad() {
      var tileset = this.state.tileset;
      var onViewportLoad = this.props.onViewportLoad;

      if (onViewportLoad) {
        onViewportLoad(tileset.selectedTiles);
      }
    }
  }, {
    key: "_onTileLoad",
    value: function _onTileLoad(tile) {
      this.props.onTileLoad(tile);
      tile.layers = null;
      this.setNeedsUpdate();
    }
  }, {
    key: "_onTileError",
    value: function _onTileError(error, tile) {
      this.props.onTileError(error);
      tile.layers = null;
      this.setNeedsUpdate();
    }
  }, {
    key: "_onTileUnload",
    value: function _onTileUnload(tile) {
      this.props.onTileUnload(tile);
    }
  }, {
    key: "getTileData",
    value: function getTileData(tile) {
      var _this$props2 = this.props,
          data = _this$props2.data,
          getTileData = _this$props2.getTileData,
          fetch = _this$props2.fetch;
      var signal = tile.signal;
      tile.url = (0, _utils.getURLFromTemplate)(data, tile);

      if (getTileData) {
        return getTileData(tile);
      }

      if (tile.url) {
        return fetch(tile.url, {
          propName: 'data',
          layer: this,
          signal: signal
        });
      }

      return null;
    }
  }, {
    key: "renderSubLayers",
    value: function renderSubLayers(props) {
      return this.props.renderSubLayers(props);
    }
  }, {
    key: "getSubLayerPropsByTile",
    value: function getSubLayerPropsByTile(tile) {
      return null;
    }
  }, {
    key: "getPickingInfo",
    value: function getPickingInfo(_ref3) {
      var info = _ref3.info,
          sourceLayer = _ref3.sourceLayer;
      info.tile = sourceLayer.props.tile;
      return info;
    }
  }, {
    key: "_updateAutoHighlight",
    value: function _updateAutoHighlight(info) {
      if (info.sourceLayer) {
        info.sourceLayer.updateAutoHighlight(info);
      }
    }
  }, {
    key: "renderLayers",
    value: function renderLayers() {
      var _this = this;

      return this.state.tileset.tiles.map(function (tile) {
        var subLayerProps = _this.getSubLayerPropsByTile(tile);

        if (!tile.isLoaded && !tile.content) {} else if (!tile.layers) {
          var layers = _this.renderSubLayers(_objectSpread(_objectSpread({}, _this.props), {}, {
            id: "".concat(_this.id, "-").concat(tile.x, "-").concat(tile.y, "-").concat(tile.z),
            data: tile.content,
            _offset: 0,
            tile: tile
          }));

          tile.layers = (0, _core._flatten)(layers, Boolean).map(function (layer) {
            return layer.clone(_objectSpread({
              tile: tile
            }, subLayerProps));
          });
        } else if (subLayerProps && tile.layers[0] && Object.keys(subLayerProps).some(function (propName) {
          return tile.layers[0].props[propName] !== subLayerProps[propName];
        })) {
          tile.layers = tile.layers.map(function (layer) {
            return layer.clone(subLayerProps);
          });
        }

        return tile.layers;
      });
    }
  }, {
    key: "filterSubLayer",
    value: function filterSubLayer(_ref4) {
      var layer = _ref4.layer;
      return layer.props.tile.isVisible;
    }
  }]);
  return TileLayer;
}(_core.CompositeLayer);

exports.default = TileLayer;
TileLayer.layerName = 'TileLayer';
TileLayer.defaultProps = defaultProps;
//# sourceMappingURL=tile-layer.js.map