@realsee/dnalogel 0.1.0

package/plugins/ModelViewPlugin/index.js

@@ -0,0 +1,199 @@
+"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); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.ModelViewPlugin = void 0;
+
+var THREE = _interopRequireWildcard(require("three"));
+
+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; }
+
+/**
+ * Five 模型插件
+ * @template ExportType 导出方法
+ */
+var ModelViewPlugin = function ModelViewPlugin(five) {
+  var needsRender = true;
+  var scene = new THREE.Scene();
+  var camera = new THREE.PerspectiveCamera(60, 1, 0.1, 1000);
+  var model = new THREE.Object3D();
+  {
+    var light = new THREE.DirectionalLight(0xffffff, 0.5);
+    light.position.copy(new THREE.Vector3(1, 1, 1));
+    scene.add(light);
+  }
+  {
+    var _light = new THREE.DirectionalLight(0xffffff, 0.3);
+
+    scene.add(_light);
+  }
+  {
+    var _light2 = new THREE.AmbientLight(0xffffff, 0.3);
+
+    scene.add(_light2);
+  }
+  scene.add(model);
+  var renderer = null;
+
+  var initRendererIfNeeds = function initRendererIfNeeds() {
+    if (!five.renderer) return;
+
+    if (!renderer) {
+      renderer = new THREE.WebGLRenderer({
+        antialias: false,
+        alpha: true
+      });
+      renderer.setPixelRatio(five.renderer.getPixelRatio());
+      renderer.outputEncoding = THREE.sRGBEncoding;
+      renderer.setClearColor(0x181a1c, 0);
+      renderer.autoClear = true;
+    }
+
+    return renderer;
+  };
+
+  var modelWillLoad = function modelWillLoad() {
+    model.traverse(function (object) {
+      if (object instanceof THREE.Mesh) {
+        var materials = [].concat(object.material);
+        materials.forEach(function (material) {
+          return material.dispose();
+        });
+      }
+    });
+    scene.remove(model);
+    model = new THREE.Object3D();
+    scene.add(model);
+    update();
+  };
+
+  var modelLoaded = function modelLoaded() {
+    function cloneMaterial(material) {
+      material = material.clone();
+      material.uniforms.modelAlpha.value = 1;
+
+      if (material.uniforms.map.value) {
+        material.uniforms.map.value.needsUpdate = true;
+      }
+
+      return material;
+    }
+
+    function cloneModel(model) {
+      if (model instanceof THREE.Mesh) {
+        var geometry = model.geometry;
+        var material = Array.isArray(model.material) ? model.material.map(cloneMaterial) : cloneMaterial(model.material);
+        return new THREE.Mesh(geometry, material);
+      } else if (model instanceof THREE.Group) {
+        var group = new THREE.Group();
+        model.children.forEach(function (object) {
+          return group.add(cloneModel(object));
+        });
+        return group;
+      } else {
+        var object3D = new THREE.Object3D();
+        model.children.forEach(function (object) {
+          return object3D.add(cloneModel(object));
+        });
+        return object3D;
+      }
+    }
+
+    scene.remove(model);
+    model = cloneModel(five.model);
+    scene.add(model);
+    update();
+  };
+
+  var appendTo = function appendTo(element) {
+    var size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var renderer = initRendererIfNeeds();
+    if (!renderer) return;
+    element.appendChild(renderer.domElement);
+    refresh(size);
+    var positionType = window.getComputedStyle(element).position;
+    if (positionType !== 'relative' && positionType !== 'absolute' && positionType !== 'fixed' && positionType !== 'sticky') element.style.position = 'relative';
+  };
+
+  var refresh = function refresh() {
+    var size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    if (!renderer) return;
+    var element = renderer.domElement;
+    var container = element.parentNode;
+
+    if (container && container.nodeName) {
+      var _size$width = size.width,
+          width = _size$width === void 0 ? container.offsetWidth : _size$width,
+          _size$height = size.height,
+          height = _size$height === void 0 ? container.offsetHeight : _size$height;
+      renderer.setSize(width, height); // 修改摄像机 aspect 比值
+
+      camera.aspect = width / height;
+      camera.updateProjectionMatrix();
+    }
+
+    needsRender = true;
+  };
+
+  var cameraDistance = function cameraDistance() {
+    var bounding = five.model.bounding;
+    var fov = camera.fov,
+        aspect = camera.aspect;
+    var radius = Math.sqrt(Math.pow(bounding.max.x - bounding.min.x + 2, 2) + Math.pow(bounding.max.y - bounding.min.y + 2, 2) + Math.pow(bounding.max.z - bounding.min.z + 2, 2)); // fit screen
+
+    var distance = radius / 2 / Math.tan(Math.PI * fov / 360);
+    if (aspect < 1) distance = distance / aspect;
+    return isNaN(distance) ? radius : distance;
+  };
+
+  var update = function update() {
+    var _five$getPose = five.getPose(),
+        longitude = _five$getPose.longitude,
+        latitude = _five$getPose.latitude;
+
+    var distance = cameraDistance();
+    var lookAt = five.model.bounding.getCenter(new THREE.Vector3());
+    var longitudeDistance = distance * Math.cos(latitude);
+    var cameraPosition = new THREE.Vector3();
+    cameraPosition.x = Math.sin(longitude) * longitudeDistance + lookAt.x;
+    cameraPosition.z = Math.cos(longitude) * longitudeDistance + lookAt.z;
+    cameraPosition.y = Math.sin(latitude) * distance + lookAt.y;
+    camera.position.copy(cameraPosition);
+    camera.lookAt(lookAt);
+    needsRender = true;
+  };
+
+  var render = function render() {
+    if (needsRender !== true) return;
+    if (!renderer) return;
+    if (!renderer.domElement.parentNode) return;
+    var parentNode = renderer.domElement.parentNode;
+    if (parentNode.offsetWidth === 0) return;
+    renderer.render(scene, camera);
+    needsRender = false;
+  };
+
+  var dispose = function dispose() {
+    if (renderer) renderer.dispose();
+    renderer = null;
+  };
+
+  five.on('modelLoaded', modelLoaded);
+  five.on('modelWillLoad', modelWillLoad);
+  five.on('cameraDirectionUpdate', update);
+  five.on('dispose', dispose);
+  five.on('renderFrame', render);
+  return {
+    appendTo: appendTo,
+    refresh: refresh
+  };
+};
+
+exports.ModelViewPlugin = ModelViewPlugin;
+var _default = ModelViewPlugin;
+exports["default"] = _default;

package/plugins/PanoCursorRaycasterPlugin/PanoCursorRaycasterPluginUsage.d.ts

@@ -0,0 +1,48 @@
+/// <reference types="react" />
+import { Intersection } from '@realsee/five';
+export declare type StateType = {
+    fixDistance: number;
+    originPoint: Intersection['point'];
+} & Intersection;
+export interface PanoCursorRaycasterPluginUsageProps {
+    enable?: boolean;
+    pointAxesHelperEnable?: boolean;
+    movePointTowradsCameraEnable?: boolean;
+    dashLineFollowCursor?: boolean;
+}
+/**
+ * **PanoCursorRaycaster** 全景鼠标碰撞监测应用举例：选择四个点生成矩形区域，然后在此区域中放置视频广告。
+ *
+ * ### Usage
+ *
+ * ```ts
+ * import PanoCursorRaycasterPlugin from '@realsee/dnalogel/plugins/PanoCursorRaycasterPlugin'
+ * const five = new Five({ plugins: [[PanoCursorRaycasterPlugin, 'panoCursorRaycasterPlugin', {}]] })
+ *
+ * // 计算当前鼠标在当前点位全景中的碰撞监测结果。
+ * const res: Five.Intersection = panoCursorRaycasterPlugin.intersection()
+ * // 在点位上添加辅助坐标轴
+ * panoCursorRaycasterPlugin.pointAxesHelper(res.point)
+ *
+ *
+ * ```
+ *
+ * `Five.Intersection` 数据结构声明：
+ *
+ * ```ts
+ * export declare interface Intersection {
+ *   // 焦点坐标
+ *   point: THREE.Vector3;
+ *   // 焦点面片
+ *   face?: {
+ *     normal: THREE.Vector3;
+ *   };
+ *   // 焦点距离
+ *   distance: number;
+ * }
+ * ```
+ *
+ * > **注意事项**: 仅限有鼠标场景的碰撞监测，触摸屏不可用。
+ * @returns
+ */
+export declare function PanoCursorRaycasterPluginUsage(props: PanoCursorRaycasterPluginUsageProps): JSX.Element;

package/plugins/PanoCursorRaycasterPlugin/components/MovePointTowardsCamera.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import * as THREE from 'three';
+import { StateType } from '../PanoCursorRaycasterPluginUsage';
+export default function MovePointTowardsCamera(props: {
+    state: StateType[];
+    pointColors: string[];
+    setState: React.Dispatch<React.SetStateAction<StateType[]>>;
+    movePointTowardsCamera: (point: THREE.Vector3, distance: number) => THREE.Vector3;
+}): JSX.Element | null;

package/plugins/PanoCursorRaycasterPlugin/components/MovePointTowardsCamera.js

@@ -0,0 +1,113 @@
+"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); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = MovePointTowardsCamera;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _antd = require("antd");
+
+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 _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+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 MovePointTowardsCamera(props) {
+  if (!props.movePointTowardsCamera) return null; // 用于临时保存点的偏移数据
+
+  var _React$useState = React.useState([]),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      fixDistance = _React$useState2[0],
+      setFixDistance = _React$useState2[1];
+
+  (0, React.useEffect)(function () {
+    // 监听撤销
+    if (props.state.length < fixDistance.length) {
+      setFixDistance(fixDistance.slice(0, props.state.length));
+    }
+  }, [props.state.length, fixDistance.length]);
+  var handlePointFix = React.useCallback(function (value, index) {
+    var render = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    fixDistance[index] = value;
+    setFixDistance(_toConsumableArray(fixDistance));
+    if (!render) return;
+    var _state = props.state;
+    var point = _state[index].originPoint;
+    _state[index].fixDistance = value;
+    _state[index].point = props.movePointTowardsCamera(point, value / 100);
+    props.setState(_toConsumableArray(_state));
+  }, [props.state]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "PanoCursorRaycasterPluginUsage-Slider"
+  }, props.state.map(function (item, idx) {
+    var params = {
+      min: -10,
+      max: 20,
+      step: 0.1,
+      defaultValue: 0
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      key: idx
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "inline-block flag-circle",
+      style: {
+        backgroundColor: props.pointColors[idx]
+      }
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "inline-block slider",
+      style: {
+        width: 100
+      }
+    }, /*#__PURE__*/React.createElement(_antd.Slider, _extends({}, params, {
+      value: fixDistance[idx],
+      tipFormatter: function tipFormatter(value) {
+        return value + 'cm';
+      },
+      onChange: function onChange(value) {
+        return handlePointFix(value, idx);
+      },
+      onAfterChange: function onAfterChange(value) {
+        return handlePointFix(value, idx, true);
+      }
+    }))), /*#__PURE__*/React.createElement("div", {
+      className: "inline-block",
+      style: {
+        width: 50
+      }
+    }, /*#__PURE__*/React.createElement(_antd.InputNumber, _extends({}, params, {
+      value: fixDistance[idx],
+      size: "small",
+      formatter: function formatter(value) {
+        return "".concat(value, " cm");
+      },
+      onChange: function onChange(value) {
+        return handlePointFix(value, idx, true);
+      }
+    }))));
+  }));
+}

package/plugins/PanoCursorRaycasterPlugin/components/PointAxesHelper.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import * as THREE from 'three';
+import { Vector3 } from 'three';
+import { StateType } from '../PanoCursorRaycasterPluginUsage';
+export default function PointAxesHelper(props: {
+    state: StateType;
+    pointAxesHelper?: (point: Vector3, length?: number, fixDistance?: number) => {
+        clear: () => void;
+        pointAxesHelperMesh: THREE.Group;
+    };
+}): JSX.Element;

package/plugins/PanoCursorRaycasterPlugin/components/PointAxesHelper.js

@@ -0,0 +1,25 @@
+"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); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = PointAxesHelper;
+
+var React = _interopRequireWildcard(require("react"));
+
+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 PointAxesHelper(props) {
+  // 添加辅助坐标轴
+  (0, React.useEffect)(function () {
+    if (!props.pointAxesHelper) return;
+    var point = props.state.point;
+    var disposer = props.pointAxesHelper(point).clear;
+    return disposer;
+  }, [props.state]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null);
+}

package/plugins/PanoCursorRaycasterPlugin/index.d.ts

@@ -0,0 +1,49 @@
+import * as THREE from 'three';
+import type { FivePlugin, Intersection } from '@realsee/five';
+import { Vector3 } from 'three';
+export interface PanoCursorRaycasterPluginParameterType {
+}
+export interface PanoCursorRaycasterPluginExportType {
+    /**
+     * @description: 获取鼠标与模型的焦点位置
+     * @return {Intersection | null} 鼠标与模型的焦点位置
+     */
+    intersection: () => Intersection | null;
+    /**
+     * @description: 辅助坐标轴
+     * @param {Vector3} point: 坐标轴原点的位置
+     * @param {number} length: 坐标轴线长度，单位：米，默认值：2
+     * @param {number} fixDistance: 为避免被模型遮挡，默认向camera方向移动0.1m，默认值：0.1
+     * @return {{clear: () => void; pointAxesHelperMesh: THREE.Group}} clear: 清理函数；pointAxesHelperMesh: 辅助坐标轴mesh
+     */
+    pointAxesHelper: (point: Vector3, length?: number, fixDistance?: number) => {
+        clear: () => void;
+        pointAxesHelperMesh: THREE.Group;
+    };
+    /**
+     * @description: 将一个点在camera和点的向量上移动。传入点的位置和相对移动的距离，返回一个新的位置
+     * @param {Vector3} point: 点
+     * @param {number} distance: 向camera相对移动的距离（正方向为：点 -> 摄像头）
+     * @return {Vector3} 计算移动后的位置
+     */
+    movePointTowardsCamera: (point: Vector3, distance: number) => Vector3;
+    /**
+     * @description: 某个点是否可见
+     * @param {Vector3} point: 要检测的点
+     * @param {number} distanceError: 允许的误差，如果点有可能打在模型后，则传入一个误差值，通常为0.01
+     * @return {boolean}: 是否可见
+     */
+    canSeePoint: (point: Vector3, distanceError?: number) => boolean;
+    /**
+     * @description: 清理函数
+     * @return {() => void} 清理函数
+     */
+    destroy: () => void;
+}
+/**
+ * 全景中对当前鼠标的位置进行碰撞监测
+ * @param five
+ * @return
+ */
+export declare const PanoCursorRaycasterPlugin: FivePlugin<PanoCursorRaycasterPluginParameterType, PanoCursorRaycasterPluginExportType>;
+export default PanoCursorRaycasterPlugin;

package/plugins/PanoCursorRaycasterPlugin/index.js

@@ -0,0 +1,119 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.PanoCursorRaycasterPlugin = void 0;
+
+var _three = require("three");
+
+var _createLine = _interopRequireDefault(require("../../shared-utils/createLine"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure undefined"); }
+
+/**
+ * 全景中对当前鼠标的位置进行碰撞监测
+ * @param five
+ * @return
+ */
+var PanoCursorRaycasterPlugin = function PanoCursorRaycasterPlugin(five, _ref) {
+  _objectDestructuringEmpty(_ref);
+
+  var state = {
+    intersection: null,
+    disposers: []
+  };
+
+  var updateIntersection = function updateIntersection(intersection) {
+    state.intersection = intersection;
+  };
+
+  var clearIntersection = function clearIntersection() {
+    state.intersection = null;
+  };
+
+  five.on('modelLoaded', function () {
+    five.on('intersectionOnModelUpdate', updateIntersection);
+    five.on('intersectionHidden', clearIntersection);
+  });
+  five.on('dispose', function () {
+    five.off('intersectionOnModelUpdate', updateIntersection);
+    five.off('intersectionHidden', clearIntersection);
+  });
+
+  var pointAxesHelper = function pointAxesHelper(point) {
+    var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
+    var fixDistance = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0.1;
+    var halfLength = length / 2;
+    var helperCenterPoint = movePointTowardsCamera(point, fixDistance);
+    var p = helperCenterPoint;
+    var pointAxesHelperMesh = new _three.Group();
+    pointAxesHelperMesh.add((0, _createLine["default"])(new _three.Vector3(p.x + halfLength, p.y, p.z), new _three.Vector3(p.x - halfLength, p.y, p.z), new _three.Vector3(1, 0, 0)), (0, _createLine["default"])(new _three.Vector3(p.x, p.y + halfLength, p.z), new _three.Vector3(p.x, p.y - halfLength, p.z), new _three.Vector3(0, 1, 0)), (0, _createLine["default"])(new _three.Vector3(p.x, p.y, p.z + halfLength), new _three.Vector3(p.x, p.y, p.z - halfLength), new _three.Vector3(0, 0, 1)));
+    five.scene.add(pointAxesHelperMesh);
+    five.needsRender = true; // 清理函数
+
+    var clear = function clear() {
+      five.scene.remove(pointAxesHelperMesh);
+    };
+
+    state.disposers.push(clear);
+    return {
+      clear: clear,
+      pointAxesHelperMesh: pointAxesHelperMesh
+    };
+  };
+
+  var canSeePoint = function canSeePoint(point) {
+    var _five$camera, _five$model$intersect;
+
+    var distanceError = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    var cameraPosition = five === null || five === void 0 ? void 0 : (_five$camera = five.camera) === null || _five$camera === void 0 ? void 0 : _five$camera.position;
+    if (!cameraPosition) return false;
+    var distance = point.distanceTo(cameraPosition);
+    var direction = point.sub(cameraPosition).normalize();
+    var raycaster = new _three.Raycaster(cameraPosition, direction);
+    var intersection = (_five$model$intersect = five.model.intersectRaycaster(raycaster)) === null || _five$model$intersect === void 0 ? void 0 : _five$model$intersect[0];
+    if (intersection && intersection.distance + distanceError < distance) return false;
+    return true;
+  };
+
+  var intersection = function intersection() {
+    return state.intersection;
+  };
+
+  var destroy = function destroy() {
+    var _state$disposers, _state$disposers$forE;
+
+    (_state$disposers = state.disposers) === null || _state$disposers === void 0 ? void 0 : (_state$disposers$forE = _state$disposers.forEach) === null || _state$disposers$forE === void 0 ? void 0 : _state$disposers$forE.call(_state$disposers, function (d) {
+      return d === null || d === void 0 ? void 0 : d();
+    });
+    five.off('intersectionOnModelUpdate', updateIntersection);
+    five.off('intersectionHidden', clearIntersection);
+  };
+
+  var movePointTowardsCamera = function movePointTowardsCamera(point, distance) {
+    // 原点 position
+    var originPoint = point.clone(); // camera position
+
+    var cameraPosition = five.camera.position.clone(); // 移动的向量
+
+    var fixVector3 = cameraPosition.sub(originPoint).setLength(distance); // 向量相加
+
+    var newPoint = fixVector3.add(originPoint);
+    return newPoint;
+  };
+
+  return {
+    intersection: intersection,
+    pointAxesHelper: pointAxesHelper,
+    movePointTowardsCamera: movePointTowardsCamera,
+    destroy: destroy,
+    canSeePoint: canSeePoint
+  };
+};
+
+exports.PanoCursorRaycasterPlugin = PanoCursorRaycasterPlugin;
+var _default = PanoCursorRaycasterPlugin;
+exports["default"] = _default;

package/plugins/PanoCursorRaycasterPlugin/utils/addLineToFive.d.ts

@@ -0,0 +1,5 @@
+import { Vector3 } from 'three';
+export default function addLineToFive(five: any, point1: Vector3, point2: Vector3, color?: Vector3): {
+    clear: () => void;
+    line: import("@realsee/five/line").Line;
+};

package/plugins/PanoCursorRaycasterPlugin/utils/addLineToFive.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = addLineToFive;
+
+var _createLine = _interopRequireDefault(require("../../../shared-utils/createLine"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function addLineToFive(five, point1, point2, color) {
+  var line = (0, _createLine["default"])(point1, point2, color, false);
+  five.scene.add(line);
+  five.needsRender = true;
+
+  var clear = function clear() {
+    five === null || five === void 0 ? void 0 : five.scene.remove(line);
+  };
+
+  return {
+    clear: clear,
+    line: line
+  };
+}

package/plugins/PanoCursorRaycasterPlugin/utils/createLine.d.ts

@@ -0,0 +1,3 @@
+import { Vector3 } from 'three';
+import { Line } from '@realsee/five/line';
+export default function creatLine(point1: Vector3, point2: Vector3, color?: Vector3, dashed?: boolean): Line;

package/plugins/PanoCursorRaycasterPlugin/utils/createLine.js

@@ -0,0 +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); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = creatLine;
+
+var THREE = _interopRequireWildcard(require("three"));
+
+var _line = require("@realsee/five/line");
+
+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 creatLine(point1, point2) {
+  var color = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : new THREE.Vector3(1, 1, 1);
+  var dashed = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+  var line = new _line.Line(point1, point2);
+  line.setMaterial({
+    dashed: dashed,
+    color: color,
+    linewidth: 1
+  });
+  line.remove(line.points);
+  return line; // const material = dash
+  //   ? new LineDashedMaterial({ color, dashSize: 0.1, gapSize: 0.05, scale: 0.2 })
+  //   : new THREE.LineBasicMaterial({ color })
+  // const geometry = new THREE.BufferGeometry().setFromPoints([point1, point2])
+  // const line = new THREE.Line(geometry, material)
+  // return line
+}

package/plugins/PanoCursorRaycasterPlugin/utils/vecror3.d.ts

@@ -0,0 +1,7 @@
+import { Vector3 } from 'three';
+declare const vector3: ({ x, y, z }: {
+    x: number;
+    y: number;
+    z: number;
+}) => Vector3;
+export default vector3;