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

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

@@ -7,22 +7,6 @@ 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");
@@ -39,16 +23,8 @@ var _tiles = require("@loaders.gl/tiles");
 
 var _dTiles = require("@loaders.gl/3d-tiles");
 
-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 { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
-
-var SINGLE_DATA = [0];
-var defaultProps = {
+const SINGLE_DATA = [0];
+const defaultProps = {
   getPointColor: {
     type: 'accessor',
     value: [0, 0, 0, 255]
@@ -58,430 +34,401 @@ var defaultProps = {
   loader: _dTiles.Tiles3DLoader,
   onTilesetLoad: {
     type: 'function',
-    value: function value(tileset3d) {},
+    value: tileset3d => {},
     compare: false
   },
   onTileLoad: {
     type: 'function',
-    value: function value(tileHeader) {},
+    value: tileHeader => {},
     compare: false
   },
   onTileUnload: {
     type: 'function',
-    value: function value(tileHeader) {},
+    value: tileHeader => {},
     compare: false
   },
   onTileError: {
     type: 'function',
-    value: function value(tile, message, url) {},
+    value: (tile, message, url) => {},
     compare: false
   },
   _getMeshColor: {
     type: 'function',
-    value: function value(tileHeader) {
-      return [255, 255, 255];
-    },
+    value: tileHeader => [255, 255, 255],
     compare: false
   }
 };
 
-var Tile3DLayer = function (_CompositeLayer) {
-  (0, _inherits2.default)(Tile3DLayer, _CompositeLayer);
+class Tile3DLayer extends _core2.CompositeLayer {
+  initializeState() {
+    if ('onTileLoadFail' in this.props) {
+      _core2.log.removed('onTileLoadFail', 'onTileError')();
+    }
 
-  var _super = _createSuper(Tile3DLayer);
+    this.state = {
+      layerMap: {},
+      tileset3d: null,
+      activeViewports: {},
+      lastUpdatedViewports: null
+    };
+  }
 
-  function Tile3DLayer() {
-    (0, _classCallCheck2.default)(this, Tile3DLayer);
-    return _super.apply(this, arguments);
+  get isLoaded() {
+    const {
+      tileset3d
+    } = this.state;
+    return tileset3d && tileset3d.isLoaded();
   }
 
-  (0, _createClass2.default)(Tile3DLayer, [{
-    key: "initializeState",
-    value: function initializeState() {
-      if ('onTileLoadFail' in this.props) {
-        _core2.log.removed('onTileLoadFail', 'onTileError')();
-      }
+  shouldUpdateState({
+    changeFlags
+  }) {
+    return changeFlags.somethingChanged;
+  }
 
-      this.state = {
-        layerMap: {},
-        tileset3d: null,
-        activeViewports: {},
-        lastUpdatedViewports: null
-      };
-    }
-  }, {
-    key: "shouldUpdateState",
-    value: function shouldUpdateState(_ref) {
-      var changeFlags = _ref.changeFlags;
-      return changeFlags.somethingChanged;
+  updateState({
+    props,
+    oldProps,
+    changeFlags
+  }) {
+    if (props.data && props.data !== oldProps.data) {
+      this._loadTileset(props.data);
     }
-  }, {
-    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) {
-        var activeViewports = this.state.activeViewports;
-        var viewportsNumber = Object.keys(activeViewports).length;
+    if (changeFlags.viewportChanged) {
+      const {
+        activeViewports
+      } = this.state;
+      const 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) {
-        var layerMap = this.state.layerMap;
+    if (changeFlags.propsChanged) {
+      const {
+        layerMap
+      } = this.state;
 
-        for (var key in layerMap) {
-          layerMap[key].needsUpdate = true;
-        }
+      for (const key in layerMap) {
+        layerMap[key].needsUpdate = true;
       }
     }
-  }, {
-    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;
-      }
+  }
 
-      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);
+  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: "_updateAutoHighlight",
-    value: function _updateAutoHighlight(info) {
-      if (info.sourceLayer) {
-        info.sourceLayer.updateAutoHighlight(info);
-      }
+  }
+
+  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;
     }
-  }, {
-    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 _loadTileset;
-    }()
-  }, {
-    key: "_onTileLoad",
-    value: function _onTileLoad(tileHeader) {
-      var lastUpdatedViewports = this.state.lastUpdatedViewports;
-      this.props.onTileLoad(tileHeader);
+    return info;
+  }
 
-      this._updateTileset(lastUpdatedViewports);
+  filterSubLayer({
+    layer,
+    viewport
+  }) {
+    const {
+      tile
+    } = layer.props;
+    const {
+      id: viewportId
+    } = viewport;
+    return tile.selected && tile.viewportIds.includes(viewportId);
+  }
 
-      this.setNeedsUpdate();
+  _updateAutoHighlight(info) {
+    if (info.sourceLayer) {
+      info.sourceLayer.updateAutoHighlight(info);
     }
-  }, {
-    key: "_onTileUnload",
-    value: function _onTileUnload(tileHeader) {
-      delete this.state.layerMap[tileHeader.id];
-      this.props.onTileUnload(tileHeader);
+  }
+
+  async _loadTileset(tilesetUrl) {
+    const {
+      loadOptions = {}
+    } = this.props;
+    let loader = this.props.loader || this.props.loaders;
+
+    if (Array.isArray(loader)) {
+      loader = loader[0];
     }
-  }, {
-    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;
+
+    const options = {
+      loadOptions: { ...loadOptions
       }
+    };
 
-      var frameNumber = tileset3d.update(Object.values(viewports));
-      var tilesetChanged = this.state.frameNumber !== frameNumber;
+    if (loader.preload) {
+      const preloadOptions = await loader.preload(tilesetUrl, loadOptions);
 
-      if (tilesetChanged) {
-        this.setState({
-          frameNumber: frameNumber
-        });
+      if (preloadOptions.headers) {
+        options.loadOptions.fetch = { ...options.loadOptions.fetch,
+          headers: preloadOptions.headers
+        };
       }
+
+      Object.assign(options, preloadOptions);
     }
-  }, {
-    key: "_getSubLayer",
-    value: function _getSubLayer(tileHeader, oldLayer) {
-      if (!tileHeader.content) {
-        return null;
-      }
 
-      switch (tileHeader.type) {
-        case _tiles.TILE_TYPE.POINTCLOUD:
-          return this._makePointCloudLayer(tileHeader, oldLayer);
+    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);
+  }
 
-        case _tiles.TILE_TYPE.SCENEGRAPH:
-          return this._make3DModelLayer(tileHeader, oldLayer);
+  _onTileLoad(tileHeader) {
+    const {
+      lastUpdatedViewports
+    } = this.state;
+    this.props.onTileLoad(tileHeader);
 
-        case _tiles.TILE_TYPE.MESH:
-          return this._makeSimpleMeshLayer(tileHeader, oldLayer);
+    this._updateTileset(lastUpdatedViewports);
 
-        default:
-          throw new Error("Tile3DLayer: Failed to render layer of type ".concat(tileHeader.content.type));
-      }
+    this.setNeedsUpdate();
+  }
+
+  _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;
     }
-  }, {
-    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;
-      }
 
-      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
+    const frameNumber = tileset3d.update(Object.values(viewports));
+    const tilesetChanged = this.state.frameNumber !== frameNumber;
+
+    if (tilesetChanged) {
+      this.setState({
+        frameNumber
       });
     }
-  }, {
-    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
-      });
+  }
+
+  _getSubLayer(tileHeader, oldLayer) {
+    if (!tileHeader.content) {
+      return null;
     }
-  }, {
-    key: "_makeSimpleMeshLayer",
-    value: function _makeSimpleMeshLayer(tileHeader, oldLayer) {
-      var content = tileHeader.content;
-      var attributes = content.attributes,
-          indices = content.indices,
-          modelMatrix = content.modelMatrix,
-          cartographicOrigin = content.cartographicOrigin,
-          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: _core2.COORDINATE_SYSTEM.METER_OFFSETS,
-        featureIds: featureIds,
-        _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: "renderLayers",
-    value: function renderLayers() {
-      var _this = this;
+  }
 
-      var _this$state2 = this.state,
-          tileset3d = _this$state2.tileset3d,
-          layerMap = _this$state2.layerMap;
+  _makePointCloudLayer(tileHeader, oldLayer) {
+    const {
+      attributes,
+      pointCount,
+      constantRGBA,
+      cartographicOrigin,
+      modelMatrix
+    } = tileHeader.content;
+    const {
+      positions,
+      normals,
+      colors
+    } = attributes;
+
+    if (!positions) {
+      return null;
+    }
 
-      if (!tileset3d) {
-        return null;
+    const data = oldLayer && oldLayer.props.data || {
+      header: {
+        vertexCount: pointCount
+      },
+      attributes: {
+        POSITION: positions,
+        NORMAL: normals,
+        COLOR_0: colors
       }
+    };
+    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
+    });
+  }
 
-      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;
-          }
-        }
+  _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
+    });
+  }
 
-        layerCache.layer = layer;
-        return layer;
-      }).filter(Boolean);
-    }
-  }, {
-    key: "isLoaded",
-    get: function get() {
-      var tileset3d = this.state.tileset3d;
-      return tileset3d && tileset3d.isLoaded();
+  _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 Tile3DLayer;
-}(_core2.CompositeLayer);
+
+    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;
+        }
+      }
+
+      layerCache.layer = layer;
+      return layer;
+    }).filter(Boolean);
+  }
+
+}
 
 exports.default = Tile3DLayer;
 
 function getMeshGeometry(contentAttributes) {
-  var attributes = {};
-  attributes.positions = _objectSpread(_objectSpread({}, contentAttributes.positions), {}, {
+  const attributes = {};
+  attributes.positions = { ...contentAttributes.positions,
     value: new Float32Array(contentAttributes.positions.value)
-  });
+  };
 
   if (contentAttributes.normals) {
     attributes.normals = contentAttributes.normals;