@realsee/dnalogel 0.1.2 → 0.1.7

package/libs/gltf-viewer/requestAnimationFrame.js

@@ -0,0 +1,18 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.requestAnimationFrame = void 0;
+
+require("core-js/modules/web.timers.js");
+
+var _window = window;
+
+var requestAnimationFrame = window.requestAnimationFrame || _window.mozRequestAnimationFrame || _window.webkitRequestAnimationFrame || _window.msRequestAnimationFrame || function (fn) {
+  return setTimeout(fn, 16);
+};
+
+exports.requestAnimationFrame = requestAnimationFrame;

package/libs/gltf-viewer/requestAnimationFrameInterval.d.ts

@@ -0,0 +1 @@
+export declare function requestAnimationFrameInterval(fn: any, context?: any, args?: any[]): () => void;

package/libs/gltf-viewer/requestAnimationFrameInterval.js

@@ -0,0 +1,31 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.requestAnimationFrameInterval = requestAnimationFrameInterval;
+
+require("core-js/modules/es.array.concat.js");
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _requestAnimationFrame = require("./requestAnimationFrame");
+
+function requestAnimationFrameInterval(fn, context) {
+  var args = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  var stoped = false;
+
+  var _loop = function loop(time) {
+    if (fn) fn.call.apply(fn, [context, time].concat((0, _toConsumableArray2["default"])(args)));
+    if (!stoped && _loop) (0, _requestAnimationFrame.requestAnimationFrame)(_loop);
+  };
+
+  (0, _requestAnimationFrame.requestAnimationFrame)(_loop);
+  return function () {
+    _loop = null, stoped = true;
+  };
+}

package/libs/gltf-viewer/uuid.d.ts

@@ -0,0 +1,4 @@
+/**
+ * 随机生成一个uuid值
+ */
+export default function uuid(): string;

package/libs/gltf-viewer/uuid.js

@@ -0,0 +1,28 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = uuid;
+
+require("core-js/modules/es.date.to-string.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.regexp.to-string.js");
+
+// uuid
+function S4() {
+  return ((1 + Math.random()) * 0x10000 | 0).toString(16).substring(1);
+}
+/**
+ * 随机生成一个uuid值
+ */
+
+
+function uuid() {
+  // then to call it, plus stitch in '4' in the third group
+  return (S4() + S4() + '-' + S4() + '-4' + S4().substr(0, 3) + '-' + S4() + '-' + S4() + S4() + S4()).toLowerCase();
+}

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@realsee/dnalogel",
-  "version": "0.1.2",
-  "description": "Realsee Components(React) & Plugins(Five).",
+  "version": "0.1.7",
+  "description": "如视前端 Componets、Plugins 兼部分 SDKs \"Dnalogel\" 库。",
   "author": "BEIKE REALSEE TECHNOLOGY (HK) LIMITED",
   "peerDependencies": {
-    "@realsee/five": "^5.0.0-alpha.47",
+    "@realsee/five": "^5.0.0-alpha.52",
     "@tweenjs/tween.js": "^18.6.4",
     "@types/styled-jsx": "^2.2.9",
+    "hammerjs": "^2.0.8",
     "react": "^16.14.0",
     "styled-jsx": "^3.4.6",
     "three": "0.117.1",
@@ -15,5 +16,8 @@
   },
   "main": "index.js",
   "repository": "git@git.lianjia.com:vrlab_frontend/dnalogel.git",
-  "license": "SEE LICENSE IN TERMS.txt"
+  "license": "SEE LICENSE IN TERMS.txt",
+  "dependencies": {
+    "core-js": "^3.20.0"
+  }
 }

package/plugins/AutoPreloadPlugin/index.d.ts

@@ -0,0 +1,23 @@
+import { FivePlugin } from '@realsee/five';
+export declare type AutoPreloadPluginParameterType = {
+    /** 预加载使用的图片质量 */
+    preloadImageSize?: number;
+    /** 走点时，预加载的点位个数 */
+    preloadPanoIndexNumber?: number;
+    /** 走点时，是否使用预加载功能 */
+    shouldPreloadAroundPanoImage?: (panoIndex: number) => boolean | void;
+};
+export interface AutoPreloadPluginReturnType {
+    dispose: () => void;
+}
+/** 优化首点位加载的逻辑
+ *
+ * 1.进入 VR 时，如果 Five 默认的配置图片像素超过了 1024，先用 1024 加载
+ * 第一个点位加载完成之后，再使用业务上配置的图片像素重复加载一遍当前点位
+ *
+ * 2.在走点时，会预载距离当前点位最近的 preloadPanoIndexNumber 个数的点
+ * @description
+ * 预载周围的点时，不会一次性全部预载。而是每隔1s，预载其中的一个点
+ */
+declare const AutoPreloadPlugin: FivePlugin<AutoPreloadPluginParameterType, AutoPreloadPluginReturnType>;
+export default AutoPreloadPlugin;

package/plugins/AutoPreloadPlugin/index.js

@@ -0,0 +1,111 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+require("core-js/modules/web.timers.js");
+
+require("core-js/modules/es.array.splice.js");
+
+require("core-js/modules/es.array.from.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.set.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.array.map.js");
+
+require("core-js/modules/es.array.slice.js");
+
+require("core-js/modules/es.array.sort.js");
+
+require("core-js/modules/es.array.filter.js");
+
+var _nextFrame = require("../../shared-utils/nextFrame");
+
+/** 优化首点位加载的逻辑
+ *
+ * 1.进入 VR 时，如果 Five 默认的配置图片像素超过了 1024，先用 1024 加载
+ * 第一个点位加载完成之后，再使用业务上配置的图片像素重复加载一遍当前点位
+ *
+ * 2.在走点时，会预载距离当前点位最近的 preloadPanoIndexNumber 个数的点
+ * @description
+ * 预载周围的点时，不会一次性全部预载。而是每隔1s，预载其中的一个点
+ */
+var AutoPreloadPlugin = function AutoPreloadPlugin(five, parameters) {
+  var _parameters$preloadIm, _parameters$preloadPa;
+
+  var preloadImageSize = (_parameters$preloadIm = parameters === null || parameters === void 0 ? void 0 : parameters.preloadImageSize) !== null && _parameters$preloadIm !== void 0 ? _parameters$preloadIm : 1024;
+  var preloadPanoIndexNumber = (_parameters$preloadPa = parameters === null || parameters === void 0 ? void 0 : parameters.preloadPanoIndexNumber) !== null && _parameters$preloadPa !== void 0 ? _parameters$preloadPa : 4;
+  var lastSize = five.imageOptions.size;
+  var timer = void 0;
+
+  var doPreload = function doPreload(quene) {
+    if (quene.length === 0) return;
+    five.preloadPano(quene[0]);
+    if (quene.length === 1) return;
+    timer = setTimeout(function () {
+      return doPreload(quene.splice(1));
+    }, 1000);
+  };
+
+  var onPanoArrived = function onPanoArrived(panoIndex) {
+    if (parameters !== null && parameters !== void 0 && parameters.shouldPreloadAroundPanoImage) {
+      var shouldPreload = parameters.shouldPreloadAroundPanoImage(panoIndex);
+      if (!shouldPreload) return;
+    }
+
+    if (timer) clearTimeout(timer);
+    var currentIndex = panoIndex;
+    var currentObserver = five.work.observers[currentIndex];
+    var preloadIndexArray = Array.from(new Set(five.work.observers.filter(function (observer) {
+      return observer.floorIndex === currentObserver.floorIndex;
+    }).map(function (observer) {
+      var distance = observer.standingPosition.clone().distanceTo(currentObserver.standingPosition);
+      return {
+        observer: observer,
+        distance: distance
+      };
+    }).sort(function (a, b) {
+      return a.distance - b.distance;
+    }).slice(0, preloadPanoIndexNumber).map(function (_ref) {
+      var observer = _ref.observer;
+      return observer.panoIndex;
+    })));
+    doPreload(preloadIndexArray);
+  };
+
+  var onFirstPanoArrived = function onFirstPanoArrived(panoIndex) {
+    // 在第一次点位加载之后再做周围点位的预载，防止第一个点位周围的点预载两次
+    // 同时也防止阻塞第一个点的低分辨率图快速加载
+    five.on('panoArrived', onPanoArrived);
+    var shouldPreloadFirstPanoImage = five.imageOptions.size !== lastSize;
+    if (!shouldPreloadFirstPanoImage) return;
+    (0, _nextFrame.nextFrame)(function () {
+      five.imageOptions.size = lastSize;
+      five.moveToPano(panoIndex);
+    }, 5);
+  };
+
+  five.imageOptions.size = lastSize && lastSize > preloadImageSize ? preloadImageSize : lastSize;
+  if (five.imageOptions.size !== lastSize) five.once('panoArrived', onFirstPanoArrived);
+  return {
+    dispose: function dispose() {
+      five.off('panoArrived', onFirstPanoArrived);
+      five.off('panoArrived', onPanoArrived);
+    }
+  };
+};
+
+var _default = AutoPreloadPlugin;
+exports["default"] = _default;

package/plugins/CSS3DRenderPlugin/components/Marker/index.js

@@ -1,12 +1,34 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = Marker;
 
+require("core-js/modules/es.date.to-string.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.regexp.to-string.js");
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _react = require("@realsee/five/react");
 
 var React = _interopRequireWildcard(require("react"));
@@ -17,24 +39,10 @@ require("./index.css");
 
 var _getRandomColor = _interopRequireDefault(require("../../../../shared-utils/getRandomColor"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 function Marker(props) {
   var color = React.useRef(props.color || (0, _getRandomColor["default"])());
   var intersectMeshRef = React.useRef(new THREE.Mesh(new THREE.RingGeometry(0.04, 0.08, 32), new THREE.MeshBasicMaterial({
@@ -56,7 +64,7 @@ function Marker(props) {
     top: 0,
     matrix: '[1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]'
   }),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
+      _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
       state = _React$useState2[0],
       setState = _React$useState2[1];
 

package/plugins/CSS3DRenderPlugin/index.d.ts

@@ -1,12 +1,13 @@
 import { FivePlugin } from '@realsee/five';
 import { Vector3 } from 'three';
 import { CSS3DObject } from 'three/examples/jsm/renderers/CSS3DRenderer';
+import { Vector3Position } from '../../typings/math.type';
 export declare type CSS3DRenderPluginParameterType = undefined;
 export interface CSS3DRenderPluginExportType {
     /**
      * @description: 根据传入的四个点位创建一个3d dom容器，可以通过ReactDom.render()的方式将react组件放到容器中
      * @param {Five} five
-     * @param {Vector3[]} points: 矩形四个点坐标
+     * @param {Vector3[] | Vector3Position[]} points: 矩形四个点坐标
      * @param {number} config.ratio: 1px对应多少米，默认为 0.002，即1px对应2mm
      * @param {number} config.dpr: dpr, 默认为1
      * @param {HTMLElement} config.container: HTMLElement
@@ -15,7 +16,7 @@ export interface CSS3DRenderPluginExportType {
      * @param {HTMLElement} config.behindFiveContainer: 如果config.mode为'behind'，需要传入容器，并确保此容器位five下方，且中间没有其他dom元素遮挡
      * @return {{ container: HTMLElement; dispose: () => void }}: container: dom容器, dispose: 清理函数
      */
-    create3DDomContainer: (points: Vector3[], config?: {
+    create3DDomContainer: (points: Vector3[] | Vector3Position[], config?: {
         ratio?: number;
         dpr?: number;
         autoRender?: boolean;

package/plugins/CSS3DRenderPlugin/index.js

@@ -1,12 +1,42 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.CSS3DRenderPlugin = void 0;
 
+require("core-js/modules/es.array.map.js");
+
+require("core-js/modules/es.array.for-each.js");
+
+require("core-js/modules/es.array.find-index.js");
+
+require("core-js/modules/es.array.splice.js");
+
+require("core-js/modules/es.string.sub.js");
+
+require("core-js/modules/es.function.name.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
 var THREE = _interopRequireWildcard(require("three"));
 
 var _CSS3DRenderer = require("three/examples/jsm/renderers/CSS3DRenderer");
@@ -15,7 +45,7 @@ var _evenNumber = _interopRequireDefault(require("../../shared-utils/math/evenNu
 
 var _centerPoint = _interopRequireDefault(require("../../shared-utils/three/centerPoint"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var _transformPositionToVector = _interopRequireDefault(require("../../shared-utils/three/transformPositionToVector3"));
 
 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); }
 
@@ -39,8 +69,10 @@ var CSS3DRenderPlugin = function CSS3DRenderPlugin(five) {
       params[_key] = arguments[_key];
     }
 
-    var points = params[0],
-        config = params[1];
+    var points = params[0].map(function (point) {
+      return point instanceof THREE.Vector3 ? point : (0, _transformPositionToVector["default"])(point);
+    });
+    var config = params[1];
     if ((points === null || points === void 0 ? void 0 : points.length) < 4) return console.error('points must be equal or greater than than 4');
     if (!(five !== null && five !== void 0 && (_five$model = five.model) !== null && _five$model !== void 0 && _five$model.loaded)) return console.error('five.model.loaded is: ', five === null || five === void 0 ? void 0 : (_five$model2 = five.model) === null || _five$model2 === void 0 ? void 0 : _five$model2.loaded);
     var fiveElement = five.getElement();
@@ -52,7 +84,8 @@ var CSS3DRenderPlugin = function CSS3DRenderPlugin(five) {
     var mode = (config === null || config === void 0 ? void 0 : config.mode) || 'front';
     var autoRender = (_config$autoRender = config === null || config === void 0 ? void 0 : config.autoRender) !== null && _config$autoRender !== void 0 ? _config$autoRender : true;
     var behindFiveContainer = (config === null || config === void 0 ? void 0 : config.behindFiveContainer) || fiveElement.parentElement || document.body;
-    var container = (config === null || config === void 0 ? void 0 : config.container) || document.createElement('div'); // 获取css3DObject, 如果mode为behind的话，一起获取mesh
+    var container = (config === null || config === void 0 ? void 0 : config.container) || document.createElement('div');
+    container.classList.add('__Dnalogel-plugin--CSS3DRenderPlugin'); // 获取css3DObject, 如果mode为behind的话，一起获取mesh
 
     var _createObject = createObject(points, {
       ratio: ratio,
@@ -71,8 +104,6 @@ var CSS3DRenderPlugin = function CSS3DRenderPlugin(five) {
     var stopRenderFlag = false;
     var requestAnimationFrameId = null;
 
-    var render = function render() {};
-
     if (behindModeUnInited) {
       state.behindMode = {
         scene: new THREE.Scene(),
@@ -91,45 +122,47 @@ var CSS3DRenderPlugin = function CSS3DRenderPlugin(five) {
         scene = _ref.scene,
         css3DRenderer = _ref.css3DRenderer;
 
-    if (!inited) {
-      var css3DRendererSetSize = function css3DRendererSetSize() {
-        var rendererWidth = (0, _evenNumber["default"])(fiveElement.clientWidth);
-        var rendererHeight = (0, _evenNumber["default"])(fiveElement.clientHeight);
-        css3DRenderer.setSize(rendererWidth, rendererHeight);
-      };
-
-      css3DRendererSetSize();
-      resizeObserver = new ResizeObserver(css3DRendererSetSize);
-      css3DRenderer.domElement.style.position = 'absolute';
-      css3DRenderer.domElement.style.top = '0';
-      css3DRenderer.domElement.style.userSelect = 'none';
-      css3DRenderer.domElement.style.pointerEvents = 'none';
-
-      var renderEveryFrame = function renderEveryFrame() {
-        if (stopRenderFlag) return;
-        requestAnimationFrameId = requestAnimationFrame(renderEveryFrame);
-        css3DRenderer.render(scene, five.camera);
-      };
-
-      render = function render() {
-        var _resizeObserver;
-
-        scene.add(css3DObject);
-        (_resizeObserver = resizeObserver) === null || _resizeObserver === void 0 ? void 0 : _resizeObserver.observe(fiveElement);
-        renderEveryFrame();
-
-        if (mode === 'behind' && mesh) {
-          five.scene.add(mesh);
-          disposers.push(function () {
-            return mesh && five.scene.remove(mesh);
-          });
-        }
-      };
-    } else {
-      render = function render() {
-        scene.add(css3DObject);
-      };
-    }
+    var render = function () {
+      if (!inited) {
+        var css3DRendererSetSize = function css3DRendererSetSize() {
+          var rendererWidth = (0, _evenNumber["default"])(fiveElement.clientWidth);
+          var rendererHeight = (0, _evenNumber["default"])(fiveElement.clientHeight);
+          css3DRenderer.setSize(rendererWidth, rendererHeight);
+        };
+
+        css3DRendererSetSize();
+        resizeObserver = new ResizeObserver(css3DRendererSetSize);
+        css3DRenderer.domElement.style.position = 'absolute';
+        css3DRenderer.domElement.style.top = '0';
+        css3DRenderer.domElement.style.userSelect = 'none';
+        css3DRenderer.domElement.style.pointerEvents = 'none';
+
+        var renderEveryFrame = function renderEveryFrame() {
+          if (stopRenderFlag) return;
+          requestAnimationFrameId = requestAnimationFrame(renderEveryFrame);
+          css3DRenderer.render(scene, five.camera);
+        };
+
+        return function () {
+          var _resizeObserver;
+
+          scene.add(css3DObject);
+          (_resizeObserver = resizeObserver) === null || _resizeObserver === void 0 ? void 0 : _resizeObserver.observe(fiveElement);
+          renderEveryFrame();
+
+          if (mode === 'behind' && mesh) {
+            five.scene.add(mesh);
+            disposers.push(function () {
+              return mesh && five.scene.remove(mesh);
+            });
+          }
+        };
+      } else {
+        return function () {
+          scene.add(css3DObject);
+        };
+      }
+    }();
 
     if (frontModeUnInited) {
       var wrapper = fiveElement.parentElement || document.body;

package/plugins/CameraMovementPlugin/index.js

@@ -1,12 +1,40 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.CameraMovementPlugin = void 0;
 
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.promise.js");
+
+require("core-js/modules/es.object.assign.js");
+
+require("core-js/modules/es.string.repeat.js");
+
+require("core-js/modules/web.timers.js");
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
 var _five = require("@realsee/five");
 
 var TWEEN = _interopRequireWildcard(require("@tweenjs/tween.js"));
@@ -23,10 +51,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
-
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-
 var getLongitudeParams = function getLongitudeParams(from, to, rotation) {
   var PI = Math.PI;
   var PI_2 = PI * 2;
@@ -55,10 +79,10 @@ var CameraMovementPlugin = function CameraMovementPlugin(five) {
   var state = {};
 
   var move = /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(args, duration) {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(args, duration) {
       var opts,
           _args = arguments;
-      return regeneratorRuntime.wrap(function _callee$(_context) {
+      return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
@@ -180,14 +204,14 @@ var CameraMovementPlugin = function CameraMovementPlugin(five) {
   };
 
   var rotate = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(args, duration) {
+    var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(args, duration) {
       var opts,
           _getAnimeParams,
           from,
           to,
           _args2 = arguments;
 
-      return regeneratorRuntime.wrap(function _callee2$(_context2) {
+      return _regenerator["default"].wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:

package/plugins/CameraMovementPlugin/typing.js

@@ -1,5 +1,7 @@
 "use strict";
 
+require("core-js/modules/es.object.define-property.js");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });

package/plugins/ModelChassisCompassPlugin/index.d.ts

@@ -1,12 +1,16 @@
 import type { FivePlugin } from '@realsee/five';
 export interface ModelChassisCompassPluginParameterType {
-    northRad?: number;
-    fbxUrl?: string;
+    north_rad?: number;
+    fbx_url?: string;
+}
+export interface ModelChassisCompassPluginData {
+    north_rad?: number;
+    fbx_url?: string;
 }
 export interface ModelChassisCompassPluginExportType {
     enable: () => void;
     disable: () => void;
-    load: (northRad?: number, fbxUrl?: string) => Promise<boolean>;
+    load: (data?: ModelChassisCompassPluginData) => Promise<boolean>;
 }
 /**
  * 模型底盘指南针插件