@deck.gl/geo-layers 8.7.0-alpha.3 → 8.7.0-beta.1

package/dist/es5/tile-3d-layer/tile-3d-layer.js

@@ -7,6 +7,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+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("@luma.gl/core");
 
 var _core2 = require("@deck.gl/core");
@@ -23,8 +39,16 @@ var _tiles = require("@loaders.gl/tiles");
 
 var _dTiles = require("@loaders.gl/3d-tiles");
 
-const SINGLE_DATA = [0];
-const defaultProps = {
+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 SINGLE_DATA = [0];
+var defaultProps = {
   getPointColor: {
     type: 'accessor',
     value: [0, 0, 0, 255]
@@ -34,401 +58,432 @@ const defaultProps = {
   loader: _dTiles.Tiles3DLoader,
   onTilesetLoad: {
     type: 'function',
-    value: tileset3d => {},
+    value: function value(tileset3d) {},
     compare: false
   },
   onTileLoad: {
     type: 'function',
-    value: tileHeader => {},
+    value: function value(tileHeader) {},
     compare: false
   },
   onTileUnload: {
     type: 'function',
-    value: tileHeader => {},
+    value: function value(tileHeader) {},
     compare: false
   },
   onTileError: {
     type: 'function',
-    value: (tile, message, url) => {},
+    value: function value(tile, message, url) {},
     compare: false
   },
   _getMeshColor: {
     type: 'function',
-    value: tileHeader => [255, 255, 255],
+    value: function value(tileHeader) {
+      return [255, 255, 255];
+    },
     compare: false
   }
 };
 
-class Tile3DLayer extends _core2.CompositeLayer {
-  initializeState() {
-    if ('onTileLoadFail' in this.props) {
-      _core2.log.removed('onTileLoadFail', 'onTileError')();
-    }
+var Tile3DLayer = function (_CompositeLayer) {
+  (0, _inherits2.default)(Tile3DLayer, _CompositeLayer);
 
-    this.state = {
-      layerMap: {},
-      tileset3d: null,
-      activeViewports: {},
-      lastUpdatedViewports: null
-    };
-  }
+  var _super = _createSuper(Tile3DLayer);
 
-  get isLoaded() {
-    const {
-      tileset3d
-    } = this.state;
-    return tileset3d && tileset3d.isLoaded();
+  function Tile3DLayer() {
+    (0, _classCallCheck2.default)(this, Tile3DLayer);
+    return _super.apply(this, arguments);
   }
 
-  shouldUpdateState({
-    changeFlags
-  }) {
-    return changeFlags.somethingChanged;
-  }
+  (0, _createClass2.default)(Tile3DLayer, [{
+    key: "initializeState",
+    value: function initializeState() {
+      if ('onTileLoadFail' in this.props) {
+        _core2.log.removed('onTileLoadFail', 'onTileError')();
+      }
 
-  updateState({
-    props,
-    oldProps,
-    changeFlags
-  }) {
-    if (props.data && props.data !== oldProps.data) {
-      this._loadTileset(props.data);
+      this.state = {
+        layerMap: {},
+        tileset3d: null,
+        activeViewports: {},
+        lastUpdatedViewports: null
+      };
+    }
+  }, {
+    key: "isLoaded",
+    get: function get() {
+      var tileset3d = this.state.tileset3d;
+      return tileset3d && tileset3d.isLoaded();
     }
+  }, {
+    key: "shouldUpdateState",
+    value: function shouldUpdateState(_ref) {
+      var changeFlags = _ref.changeFlags;
+      return changeFlags.somethingChanged;
+    }
+  }, {
+    key: "updateState",
+    value: function updateState(_ref2) {
+      var props = _ref2.props,
+          oldProps = _ref2.oldProps,
+          changeFlags = _ref2.changeFlags;
+
+      if (props.data && props.data !== oldProps.data) {
+        this._loadTileset(props.data);
+      }
 
-    if (changeFlags.viewportChanged) {
-      const {
-        activeViewports
-      } = this.state;
-      const viewportsNumber = Object.keys(activeViewports).length;
+      if (changeFlags.viewportChanged) {
+        var activeViewports = this.state.activeViewports;
+        var viewportsNumber = Object.keys(activeViewports).length;
 
-      if (viewportsNumber) {
-        this._updateTileset(activeViewports);
+        if (viewportsNumber) {
+          this._updateTileset(activeViewports);
 
-        this.state.lastUpdatedViewports = activeViewports;
-        this.state.activeViewports = {};
+          this.state.lastUpdatedViewports = activeViewports;
+          this.state.activeViewports = {};
+        }
       }
-    }
 
-    if (changeFlags.propsChanged) {
-      const {
-        layerMap
-      } = this.state;
+      if (changeFlags.propsChanged) {
+        var layerMap = this.state.layerMap;
 
-      for (const key in layerMap) {
-        layerMap[key].needsUpdate = true;
+        for (var key in layerMap) {
+          layerMap[key].needsUpdate = true;
+        }
       }
     }
-  }
-
-  activateViewport(viewport) {
-    const {
-      activeViewports,
-      lastUpdatedViewports
-    } = this.state;
-    this.internalState.viewport = viewport;
-    activeViewports[viewport.id] = viewport;
-    const lastViewport = lastUpdatedViewports === null || lastUpdatedViewports === void 0 ? void 0 : lastUpdatedViewports[viewport.id];
-
-    if (!lastViewport || !viewport.equals(lastViewport)) {
-      this.setChangeFlags({
-        viewportChanged: true
-      });
-      this.setNeedsUpdate();
+  }, {
+    key: "activateViewport",
+    value: function activateViewport(viewport) {
+      var _this$state = this.state,
+          activeViewports = _this$state.activeViewports,
+          lastUpdatedViewports = _this$state.lastUpdatedViewports;
+      this.internalState.viewport = viewport;
+      activeViewports[viewport.id] = viewport;
+      var lastViewport = lastUpdatedViewports === null || lastUpdatedViewports === void 0 ? void 0 : lastUpdatedViewports[viewport.id];
+
+      if (!lastViewport || !viewport.equals(lastViewport)) {
+        this.setChangeFlags({
+          viewportChanged: true
+        });
+        this.setNeedsUpdate();
+      }
     }
-  }
+  }, {
+    key: "getPickingInfo",
+    value: function getPickingInfo(_ref3) {
+      var info = _ref3.info,
+          sourceLayer = _ref3.sourceLayer;
+      var layerMap = this.state.layerMap;
+      var layerId = sourceLayer && sourceLayer.id;
+
+      if (layerId) {
+        var substr = layerId.substring(this.id.length + 1);
+        var tileId = substr.substring(substr.indexOf('-') + 1);
+        info.object = layerMap[tileId] && layerMap[tileId].tile;
+      }
 
-  getPickingInfo({
-    info,
-    sourceLayer
-  }) {
-    const {
-      layerMap
-    } = this.state;
-    const layerId = sourceLayer && sourceLayer.id;
-
-    if (layerId) {
-      const substr = layerId.substring(this.id.length + 1);
-      const tileId = substr.substring(substr.indexOf('-') + 1);
-      info.object = layerMap[tileId] && layerMap[tileId].tile;
+      return info;
     }
+  }, {
+    key: "filterSubLayer",
+    value: function filterSubLayer(_ref4) {
+      var layer = _ref4.layer,
+          viewport = _ref4.viewport;
+      var tile = layer.props.tile;
+      var viewportId = viewport.id;
+      return tile.selected && tile.viewportIds.includes(viewportId);
+    }
+  }, {
+    key: "_updateAutoHighlight",
+    value: function _updateAutoHighlight(info) {
+      if (info.sourceLayer) {
+        info.sourceLayer.updateAutoHighlight(info);
+      }
+    }
+  }, {
+    key: "_loadTileset",
+    value: function () {
+      var _loadTileset2 = (0, _asyncToGenerator2.default)(_regenerator.default.mark(function _callee(tilesetUrl) {
+        var _this$props$loadOptio, loadOptions, loader, options, preloadOptions, tilesetJson, tileset3d;
+
+        return _regenerator.default.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                _this$props$loadOptio = this.props.loadOptions, loadOptions = _this$props$loadOptio === void 0 ? {} : _this$props$loadOptio;
+                loader = this.props.loader || this.props.loaders;
+
+                if (Array.isArray(loader)) {
+                  loader = loader[0];
+                }
+
+                options = {
+                  loadOptions: _objectSpread({}, loadOptions)
+                };
+
+                if (!loader.preload) {
+                  _context.next = 10;
+                  break;
+                }
+
+                _context.next = 7;
+                return loader.preload(tilesetUrl, loadOptions);
+
+              case 7:
+                preloadOptions = _context.sent;
+
+                if (preloadOptions.headers) {
+                  options.loadOptions.fetch = _objectSpread(_objectSpread({}, options.loadOptions.fetch), {}, {
+                    headers: preloadOptions.headers
+                  });
+                }
+
+                Object.assign(options, preloadOptions);
+
+              case 10:
+                _context.next = 12;
+                return (0, _core3.load)(tilesetUrl, loader, options.loadOptions);
+
+              case 12:
+                tilesetJson = _context.sent;
+                tileset3d = new _tiles.Tileset3D(tilesetJson, _objectSpread({
+                  onTileLoad: this._onTileLoad.bind(this),
+                  onTileUnload: this._onTileUnload.bind(this),
+                  onTileLoadFail: this.props.onTileError
+                }, options));
+                this.setState({
+                  tileset3d: tileset3d,
+                  layerMap: {}
+                });
+
+                this._updateTileset(this.state.activeViewports);
+
+                this.props.onTilesetLoad(tileset3d);
+
+              case 17:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee, this);
+      }));
+
+      function _loadTileset(_x) {
+        return _loadTileset2.apply(this, arguments);
+      }
 
-    return info;
-  }
+      return _loadTileset;
+    }()
+  }, {
+    key: "_onTileLoad",
+    value: function _onTileLoad(tileHeader) {
+      var lastUpdatedViewports = this.state.lastUpdatedViewports;
+      this.props.onTileLoad(tileHeader);
 
-  filterSubLayer({
-    layer,
-    viewport
-  }) {
-    const {
-      tile
-    } = layer.props;
-    const {
-      id: viewportId
-    } = viewport;
-    return tile.selected && tile.viewportIds.includes(viewportId);
-  }
+      this._updateTileset(lastUpdatedViewports);
 
-  _updateAutoHighlight(info) {
-    if (info.sourceLayer) {
-      info.sourceLayer.updateAutoHighlight(info);
+      this.setNeedsUpdate();
     }
-  }
-
-  async _loadTileset(tilesetUrl) {
-    const {
-      loadOptions = {}
-    } = this.props;
-    let loader = this.props.loader || this.props.loaders;
-
-    if (Array.isArray(loader)) {
-      loader = loader[0];
+  }, {
+    key: "_onTileUnload",
+    value: function _onTileUnload(tileHeader) {
+      delete this.state.layerMap[tileHeader.id];
+      this.props.onTileUnload(tileHeader);
     }
-
-    const options = {
-      loadOptions: { ...loadOptions
+  }, {
+    key: "_updateTileset",
+    value: function _updateTileset(viewports) {
+      var tileset3d = this.state.tileset3d;
+      var timeline = this.context.timeline;
+      var viewportsNumber = Object.keys(viewports).length;
+
+      if (!timeline || !viewportsNumber || !tileset3d) {
+        return;
       }
-    };
 
-    if (loader.preload) {
-      const preloadOptions = await loader.preload(tilesetUrl, loadOptions);
+      var frameNumber = tileset3d.update(Object.values(viewports));
+      var tilesetChanged = this.state.frameNumber !== frameNumber;
 
-      if (preloadOptions.headers) {
-        options.loadOptions.fetch = { ...options.loadOptions.fetch,
-          headers: preloadOptions.headers
-        };
+      if (tilesetChanged) {
+        this.setState({
+          frameNumber: frameNumber
+        });
       }
-
-      Object.assign(options, preloadOptions);
     }
+  }, {
+    key: "_getSubLayer",
+    value: function _getSubLayer(tileHeader, oldLayer) {
+      if (!tileHeader.content) {
+        return null;
+      }
 
-    const tilesetJson = await (0, _core3.load)(tilesetUrl, loader, options.loadOptions);
-    const tileset3d = new _tiles.Tileset3D(tilesetJson, {
-      onTileLoad: this._onTileLoad.bind(this),
-      onTileUnload: this._onTileUnload.bind(this),
-      onTileLoadFail: this.props.onTileError,
-      ...options
-    });
-    this.setState({
-      tileset3d,
-      layerMap: {}
-    });
-
-    this._updateTileset(this.state.activeViewports);
-
-    this.props.onTilesetLoad(tileset3d);
-  }
-
-  _onTileLoad(tileHeader) {
-    const {
-      lastUpdatedViewports
-    } = this.state;
-    this.props.onTileLoad(tileHeader);
+      switch (tileHeader.type) {
+        case _tiles.TILE_TYPE.POINTCLOUD:
+          return this._makePointCloudLayer(tileHeader, oldLayer);
 
-    this._updateTileset(lastUpdatedViewports);
+        case _tiles.TILE_TYPE.SCENEGRAPH:
+          return this._make3DModelLayer(tileHeader, oldLayer);
 
-    this.setNeedsUpdate();
-  }
+        case _tiles.TILE_TYPE.MESH:
+          return this._makeSimpleMeshLayer(tileHeader, oldLayer);
 
-  _onTileUnload(tileHeader) {
-    delete this.state.layerMap[tileHeader.id];
-    this.props.onTileUnload(tileHeader);
-  }
-
-  _updateTileset(viewports) {
-    const {
-      tileset3d
-    } = this.state;
-    const {
-      timeline
-    } = this.context;
-    const viewportsNumber = Object.keys(viewports).length;
-
-    if (!timeline || !viewportsNumber || !tileset3d) {
-      return;
+        default:
+          throw new Error("Tile3DLayer: Failed to render layer of type ".concat(tileHeader.content.type));
+      }
     }
+  }, {
+    key: "_makePointCloudLayer",
+    value: function _makePointCloudLayer(tileHeader, oldLayer) {
+      var _tileHeader$content = tileHeader.content,
+          attributes = _tileHeader$content.attributes,
+          pointCount = _tileHeader$content.pointCount,
+          constantRGBA = _tileHeader$content.constantRGBA,
+          cartographicOrigin = _tileHeader$content.cartographicOrigin,
+          modelMatrix = _tileHeader$content.modelMatrix;
+      var positions = attributes.positions,
+          normals = attributes.normals,
+          colors = attributes.colors;
+
+      if (!positions) {
+        return null;
+      }
 
-    const frameNumber = tileset3d.update(Object.values(viewports));
-    const tilesetChanged = this.state.frameNumber !== frameNumber;
-
-    if (tilesetChanged) {
-      this.setState({
-        frameNumber
+      var data = oldLayer && oldLayer.props.data || {
+        header: {
+          vertexCount: pointCount
+        },
+        attributes: {
+          POSITION: positions,
+          NORMAL: normals,
+          COLOR_0: colors
+        }
+      };
+      var _this$props = this.props,
+          pointSize = _this$props.pointSize,
+          getPointColor = _this$props.getPointColor;
+      var SubLayerClass = this.getSubLayerClass('pointcloud', _layers.PointCloudLayer);
+      return new SubLayerClass({
+        pointSize: pointSize
+      }, this.getSubLayerProps({
+        id: 'pointcloud'
+      }), {
+        id: "".concat(this.id, "-pointcloud-").concat(tileHeader.id),
+        tile: tileHeader,
+        data: data,
+        coordinateSystem: _core2.COORDINATE_SYSTEM.METER_OFFSETS,
+        coordinateOrigin: cartographicOrigin,
+        modelMatrix: modelMatrix,
+        getColor: constantRGBA || getPointColor,
+        _offset: 0
       });
     }
-  }
-
-  _getSubLayer(tileHeader, oldLayer) {
-    if (!tileHeader.content) {
-      return null;
+  }, {
+    key: "_make3DModelLayer",
+    value: function _make3DModelLayer(tileHeader) {
+      var _tileHeader$content2 = tileHeader.content,
+          gltf = _tileHeader$content2.gltf,
+          instances = _tileHeader$content2.instances,
+          cartographicOrigin = _tileHeader$content2.cartographicOrigin,
+          modelMatrix = _tileHeader$content2.modelMatrix;
+      var SubLayerClass = this.getSubLayerClass('scenegraph', _meshLayers.ScenegraphLayer);
+      return new SubLayerClass({
+        _lighting: 'pbr'
+      }, this.getSubLayerProps({
+        id: 'scenegraph'
+      }), {
+        id: "".concat(this.id, "-scenegraph-").concat(tileHeader.id),
+        tile: tileHeader,
+        data: instances || SINGLE_DATA,
+        scenegraph: gltf,
+        coordinateSystem: _core2.COORDINATE_SYSTEM.METER_OFFSETS,
+        coordinateOrigin: cartographicOrigin,
+        modelMatrix: modelMatrix,
+        getTransformMatrix: function getTransformMatrix(instance) {
+          return instance.modelMatrix;
+        },
+        getPosition: [0, 0, 0],
+        _offset: 0
+      });
     }
-
-    switch (tileHeader.type) {
-      case _tiles.TILE_TYPE.POINTCLOUD:
-        return this._makePointCloudLayer(tileHeader, oldLayer);
-
-      case _tiles.TILE_TYPE.SCENEGRAPH:
-        return this._make3DModelLayer(tileHeader, oldLayer);
-
-      case _tiles.TILE_TYPE.MESH:
-        return this._makeSimpleMeshLayer(tileHeader, oldLayer);
-
-      default:
-        throw new Error("Tile3DLayer: Failed to render layer of type ".concat(tileHeader.content.type));
+  }, {
+    key: "_makeSimpleMeshLayer",
+    value: function _makeSimpleMeshLayer(tileHeader, oldLayer) {
+      var content = tileHeader.content;
+      var attributes = content.attributes,
+          indices = content.indices,
+          modelMatrix = content.modelMatrix,
+          cartographicOrigin = content.cartographicOrigin,
+          _content$coordinateSy = content.coordinateSystem,
+          coordinateSystem = _content$coordinateSy === void 0 ? _core2.COORDINATE_SYSTEM.METER_OFFSETS : _content$coordinateSy,
+          material = content.material,
+          featureIds = content.featureIds;
+      var _getMeshColor = this.props._getMeshColor;
+      var geometry = oldLayer && oldLayer.props.mesh || new _core.Geometry({
+        drawMode: 4,
+        attributes: getMeshGeometry(attributes),
+        indices: indices
+      });
+      var SubLayerClass = this.getSubLayerClass('mesh', _meshLayer.default);
+      return new SubLayerClass(this.getSubLayerProps({
+        id: 'mesh'
+      }), {
+        id: "".concat(this.id, "-mesh-").concat(tileHeader.id),
+        tile: tileHeader,
+        mesh: geometry,
+        data: SINGLE_DATA,
+        getColor: _getMeshColor(tileHeader),
+        pbrMaterial: material,
+        modelMatrix: modelMatrix,
+        coordinateOrigin: cartographicOrigin,
+        coordinateSystem: coordinateSystem,
+        featureIds: featureIds,
+        _offset: 0
+      });
     }
-  }
+  }, {
+    key: "renderLayers",
+    value: function renderLayers() {
+      var _this = this;
 
-  _makePointCloudLayer(tileHeader, oldLayer) {
-    const {
-      attributes,
-      pointCount,
-      constantRGBA,
-      cartographicOrigin,
-      modelMatrix
-    } = tileHeader.content;
-    const {
-      positions,
-      normals,
-      colors
-    } = attributes;
-
-    if (!positions) {
-      return null;
-    }
+      var _this$state2 = this.state,
+          tileset3d = _this$state2.tileset3d,
+          layerMap = _this$state2.layerMap;
 
-    const data = oldLayer && oldLayer.props.data || {
-      header: {
-        vertexCount: pointCount
-      },
-      attributes: {
-        POSITION: positions,
-        NORMAL: normals,
-        COLOR_0: colors
+      if (!tileset3d) {
+        return null;
       }
-    };
-    const {
-      pointSize,
-      getPointColor
-    } = this.props;
-    const SubLayerClass = this.getSubLayerClass('pointcloud', _layers.PointCloudLayer);
-    return new SubLayerClass({
-      pointSize
-    }, this.getSubLayerProps({
-      id: 'pointcloud'
-    }), {
-      id: "".concat(this.id, "-pointcloud-").concat(tileHeader.id),
-      tile: tileHeader,
-      data,
-      coordinateSystem: _core2.COORDINATE_SYSTEM.METER_OFFSETS,
-      coordinateOrigin: cartographicOrigin,
-      modelMatrix,
-      getColor: constantRGBA || getPointColor,
-      _offset: 0
-    });
-  }
-
-  _make3DModelLayer(tileHeader) {
-    const {
-      gltf,
-      instances,
-      cartographicOrigin,
-      modelMatrix
-    } = tileHeader.content;
-    const SubLayerClass = this.getSubLayerClass('scenegraph', _meshLayers.ScenegraphLayer);
-    return new SubLayerClass({
-      _lighting: 'pbr'
-    }, this.getSubLayerProps({
-      id: 'scenegraph'
-    }), {
-      id: "".concat(this.id, "-scenegraph-").concat(tileHeader.id),
-      tile: tileHeader,
-      data: instances || SINGLE_DATA,
-      scenegraph: gltf,
-      coordinateSystem: _core2.COORDINATE_SYSTEM.METER_OFFSETS,
-      coordinateOrigin: cartographicOrigin,
-      modelMatrix,
-      getTransformMatrix: instance => instance.modelMatrix,
-      getPosition: [0, 0, 0],
-      _offset: 0
-    });
-  }
-
-  _makeSimpleMeshLayer(tileHeader, oldLayer) {
-    const content = tileHeader.content;
-    const {
-      attributes,
-      indices,
-      modelMatrix,
-      cartographicOrigin,
-      material,
-      featureIds
-    } = content;
-    const {
-      _getMeshColor
-    } = this.props;
-    const geometry = oldLayer && oldLayer.props.mesh || new _core.Geometry({
-      drawMode: 4,
-      attributes: getMeshGeometry(attributes),
-      indices
-    });
-    const SubLayerClass = this.getSubLayerClass('mesh', _meshLayer.default);
-    return new SubLayerClass(this.getSubLayerProps({
-      id: 'mesh'
-    }), {
-      id: "".concat(this.id, "-mesh-").concat(tileHeader.id),
-      tile: tileHeader,
-      mesh: geometry,
-      data: SINGLE_DATA,
-      getColor: _getMeshColor(tileHeader),
-      pbrMaterial: material,
-      modelMatrix,
-      coordinateOrigin: cartographicOrigin,
-      coordinateSystem: _core2.COORDINATE_SYSTEM.METER_OFFSETS,
-      featureIds,
-      _offset: 0
-    });
-  }
 
-  renderLayers() {
-    const {
-      tileset3d,
-      layerMap
-    } = this.state;
-
-    if (!tileset3d) {
-      return null;
-    }
-
-    return tileset3d.tiles.map(tile => {
-      const layerCache = layerMap[tile.id] = layerMap[tile.id] || {
-        tile
-      };
-      let {
-        layer
-      } = layerCache;
-
-      if (tile.selected) {
-        if (!layer) {
-          layer = this._getSubLayer(tile);
-        } else if (layerCache.needsUpdate) {
-          layer = this._getSubLayer(tile, layer);
-          layerCache.needsUpdate = false;
+      return tileset3d.tiles.map(function (tile) {
+        var layerCache = layerMap[tile.id] = layerMap[tile.id] || {
+          tile: tile
+        };
+        var layer = layerCache.layer;
+
+        if (tile.selected) {
+          if (!layer) {
+            layer = _this._getSubLayer(tile);
+          } else if (layerCache.needsUpdate) {
+            layer = _this._getSubLayer(tile, layer);
+            layerCache.needsUpdate = false;
+          }
         }
-      }
-
-      layerCache.layer = layer;
-      return layer;
-    }).filter(Boolean);
-  }
 
-}
+        layerCache.layer = layer;
+        return layer;
+      }).filter(Boolean);
+    }
+  }]);
+  return Tile3DLayer;
+}(_core2.CompositeLayer);
 
 exports.default = Tile3DLayer;
 
 function getMeshGeometry(contentAttributes) {
-  const attributes = {};
-  attributes.positions = { ...contentAttributes.positions,
+  var attributes = {};
+  attributes.positions = _objectSpread(_objectSpread({}, contentAttributes.positions), {}, {
     value: new Float32Array(contentAttributes.positions.value)
-  };
+  });
 
   if (contentAttributes.normals) {
     attributes.normals = contentAttributes.normals;