@labelbee/lb-components 1.10.0-alpha.2 → 1.10.0-alpha.3

package/es/components/pointCloudView/PointCloudListener.js

@@ -1 +1,345 @@
-import{PointCloudContext as Q}from"./PointCloudContext.js";import{useRotate as X}from"./hooks/useRotate.js";import{useBoxes as Z}from"./hooks/useBoxes.js";import{useSingleBox as ee}from"./hooks/useSingleBox.js";import{useSphere as te}from"./hooks/useSphere.js";import{useContext as oe,useEffect as d}from"react";import{CommonToolUtils as re,AttributeUtils as ne,EToolName as b,cTool as se}from"@labelbee/lb-annotation";import{message as C}from"antd";import{connect as ie}from"react-redux";import{a2MapStateToProps as ae}from"../../store/annotation/map.js";import{useCustomToolInstance as le}from"../../hooks/annotation.js";import{useStatus as ue}from"./hooks/useStatus.js";import{jsonParser as ce}from"../../utils/index.js";import{usePointCloudViews as de}from"./hooks/usePointCloudViews.js";import{LabelBeeContext as pe}from"../../store/ctx.js";import{useHistory as me}from"./hooks/useHistory.js";import{useAttribute as fe}from"./hooks/useAttribute.js";import{useConfig as be}from"./hooks/useConfig.js";import{usePolygon as Pe}from"./hooks/usePolygon.js";import{useTranslation as ye}from"react-i18next";var ve=Object.defineProperty,we=Object.defineProperties,Ce=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,he=Object.prototype.hasOwnProperty,xe=Object.prototype.propertyIsEnumerable,j=(l,r,a)=>r in l?ve(l,r,{enumerable:!0,configurable:!0,writable:!0,value:a}):l[r]=a,h=(l,r)=>{for(var a in r||(r={}))he.call(r,a)&&j(l,a,r[a]);if(O)for(var a of O(r))xe.call(r,a)&&j(l,a,r[a]);return l},x=(l,r)=>we(l,Ce(r));const{EPolygonPattern:ge}=se,ke=({currentData:l,config:r,checkMode:a,configString:A,imgIndex:g})=>{const t=oe(Q),{changeSelectedBoxValid:D,selectNextBox:T,selectPrevBox:E,updateSelectedBox:k,deleteSelectedPointCloudBoxAndPolygon:R}=ee(),{selectedSphere:P,updatePointCloudSphere:K}=te(),{clearAllResult:y,updatePointCloudPattern:N}=ue(),H=ce(l.result),{copySelectedBoxes:U,pasteSelectedBoxes:z,copiedBoxes:F}=Z({config:r}),{toolInstanceRef:i}=le({basicInfo:H}),{updateRotate:v}=X({currentData:l}),{updatePointCloudData:m,topViewSelectedChanged:S}=de(),{redo:_,undo:L,pushHistoryWithList:q,pushHistoryUnderUpdatePolygon:G}=me(),{syncThreeViewsAttribute:B}=fe(),{syncAllViewsConfig:M,reRenderTopViewRange:W}=be(),{selectedPolygon:I}=Pe(),{t:w}=ye(),f=e=>{var o;const{topViewInstance:n}=t;!n||(o=n.pointCloud2dOperation)==null||o.updateSelectedPolygonsPoints(e)},Y=(e,o)=>{var n;const{topViewInstance:s,mainViewInstance:u}=t;if(!s)return;const{pointCloud2dOperation:c}=s;switch(e){case"q":{v(2);break}case"e":v(-2);break;case"g":v(180);break;case"u":{const p=c.pattern===ge.Normal?b.Rect:b.Polygon;N(p);const J={[b.Polygon]:w("PolygonPattern"),[b.Rect]:w("RectPattern")};C.success(w("ChangePatternMsg",{pattern:J[p]})),c.clearActiveStatus(),c.clearDrawingStatus()}break;case"+":u==null||u.updatePointSize(!0);break;case"-":u==null||u.updatePointSize(!1);break;case"v":t.setPointCloudValid(!t.valid);break;case"tab":if(o.shiftKey){E();break}T(),o.preventDefault();break;case"f":D();break;case"arrowup":f({y:-1});break;case"arrowdown":f({y:1});break;case"arrowleft":f({x:-1});break;case"arrowright":f({x:1});break;case"delete":R();break;default:{if(((n=r.attributeList)==null?void 0:n.length)>0){const p=ne.getAttributeByKeycode(o.keyCode,r.attributeList);p!==void 0&&i.current.setDefaultAttribute(p)}return}}},$=(e,o)=>{switch(e){case"c":U();break;case"v":z();break;case"a":o.preventDefault(),t.selectedAllBoxes();break;case"z":{o.shiftKey?_():L();break}}},V=e=>{if(!re.hotkeyFilter(e)||a===!0)return;const o=e.key.toLocaleLowerCase();if(e.ctrlKey){$(o,e);return}Y(o,e)};return d(()=>{const{topViewInstance:e}=t;if(!!e)return window.addEventListener("keydown",V),()=>{window.removeEventListener("keydown",V)}},[t,F,r,t.pointCloudBoxList,t.polygonList]),d(()=>{M(r)},[A]),d(()=>{(r==null?void 0:r.radius)&&W(r==null?void 0:r.radius)},[r==null?void 0:r.radius]),d(()=>{m==null||m()},[g,t.mainViewInstance]),d(()=>{t.setHideAttributes([])},[g]),d(()=>{i.current.exportData=()=>[t.pointCloudBoxList,{valid:t.valid}],i.current.exportCustomData=()=>{var e,o,n;return{resultPolygon:(e=t.polygonList)!=null?e:[],resultLine:(o=t.lineList)!=null?o:[],resultPoint:(n=t.pointCloudSphereList)!=null?n:[]}},i.current.setDefaultAttribute=e=>{var o;B(e);const n=t.selectedPointCloudBox;if(n){n.attribute=e;const s=k(n);t.mainViewInstance&&S({newSelectedBox:n,newPointCloudList:s})}if(I&&G(x(h({},I),{attribute:e})),P){const s=K(x(h({},P),{attribute:e}));t.mainViewInstance&&((o=t.mainViewInstance)==null||o.generateSpheres(s),S({newSelectedSphere:P,newSphereList:s}))}},i.current.setSubAttribute=(e,o)=>{var n;const s=t.selectedPointCloudBox;if(s){const u=(n=s==null?void 0:s.subAttribute)!=null?n:{};s.subAttribute=x(h({},u),{[e]:o}),k(s)}},i.current.clearResult=()=>{y==null||y()},i.current.redo=()=>{_()},i.current.undo=()=>{L()},i.current.setValid=e=>{i.current.valid=e,setTimeout(()=>{t.setPointCloudValid(e),e===!1&&y()})},i.current.setForbidOperation=e=>{var o,n;(n=(o=t.topViewInstance)==null?void 0:o.pointCloud2dOperation)==null||n.setForbidOperation(e),e===!0&&t.setSelectedIDs(void 0)},i.current.setShowDefaultCursor=e=>{var o,n;(n=(o=t.topViewInstance)==null?void 0:o.pointCloud2dOperation)==null||n.setShowDefaultCursor(e)},i.current.asyncData=e=>{setTimeout(()=>{m==null||m(e)})}},[t.pointCloudBoxList,t.pointCloudSphereList,t.selectedID,t.valid,t.polygonList,t.lineList,t.mainViewInstance]),d(()=>{i.current.history={pushHistory:e=>{q({pointCloudBoxList:e})},initRecord:()=>{}}},[]),d(()=>{var e;const o=(e=t.topViewInstance)==null?void 0:e.toolInstance;if(!o||a)return;const n=c=>{B(c)},s=c=>{C.error(c)},u=c=>{C.info(c)};return o.on("syncAttribute",n),o.on("messageError",s),o.on("messageInfo",u),()=>{o.unbind("syncAttribute",n),o.unbind("messageError",s),o.unbind("messageInfo",u)}},[t.topViewInstance]),null};var Se=ie(ae,null,null,{context:pe})(ke);export{Se as default};
+import { PointCloudContext } from './PointCloudContext.js';
+import { useRotate } from './hooks/useRotate.js';
+import { useBoxes } from './hooks/useBoxes.js';
+import { useSingleBox } from './hooks/useSingleBox.js';
+import { useSphere } from './hooks/useSphere.js';
+import { useContext, useEffect } from 'react';
+import { CommonToolUtils, AttributeUtils, EToolName, cTool } from '@labelbee/lb-annotation';
+import { message } from 'antd';
+import { connect } from 'react-redux';
+import { a2MapStateToProps } from '../../store/annotation/map.js';
+import { useCustomToolInstance } from '../../hooks/annotation.js';
+import { useStatus } from './hooks/useStatus.js';
+import { jsonParser } from '../../utils/index.js';
+import { usePointCloudViews } from './hooks/usePointCloudViews.js';
+import { LabelBeeContext } from '../../store/ctx.js';
+import { useHistory } from './hooks/useHistory.js';
+import { useAttribute } from './hooks/useAttribute.js';
+import { useConfig } from './hooks/useConfig.js';
+import { usePolygon } from './hooks/usePolygon.js';
+import { useTranslation } from 'react-i18next';
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {enumerable: true, configurable: true, writable: true, value}) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const {EPolygonPattern} = cTool;
+const PointCloudListener = ({
+  currentData,
+  config,
+  checkMode,
+  configString,
+  imgIndex
+}) => {
+  const ptCtx = useContext(PointCloudContext);
+  const {
+    changeSelectedBoxValid,
+    selectNextBox,
+    selectPrevBox,
+    updateSelectedBox,
+    deleteSelectedPointCloudBoxAndPolygon
+  } = useSingleBox();
+  const {selectedSphere, updatePointCloudSphere} = useSphere();
+  const {clearAllResult, updatePointCloudPattern} = useStatus();
+  const basicInfo = jsonParser(currentData.result);
+  const {copySelectedBoxes, pasteSelectedBoxes, copiedBoxes} = useBoxes({config});
+  const {toolInstanceRef} = useCustomToolInstance({basicInfo});
+  const {updateRotate} = useRotate({currentData});
+  const {updatePointCloudData, topViewSelectedChanged} = usePointCloudViews();
+  const {redo, undo, pushHistoryWithList, pushHistoryUnderUpdatePolygon} = useHistory();
+  const {syncThreeViewsAttribute} = useAttribute();
+  const {syncAllViewsConfig, reRenderTopViewRange} = useConfig();
+  const {selectedPolygon} = usePolygon();
+  const {t} = useTranslation();
+  const updatePolygonOffset = (offset) => {
+    var _a;
+    const {topViewInstance} = ptCtx;
+    if (!topViewInstance) {
+      return;
+    }
+    (_a = topViewInstance.pointCloud2dOperation) == null ? void 0 : _a.updateSelectedPolygonsPoints(offset);
+  };
+  const keydownEvents = (lowerCaseKey, e) => {
+    var _a;
+    const {topViewInstance, mainViewInstance} = ptCtx;
+    if (!topViewInstance) {
+      return;
+    }
+    const {pointCloud2dOperation: TopPointCloudPolygonOperation} = topViewInstance;
+    switch (lowerCaseKey) {
+      case "q": {
+        updateRotate(2);
+        break;
+      }
+      case "e":
+        updateRotate(-2);
+        break;
+      case "g":
+        updateRotate(180);
+        break;
+      case "u":
+        {
+          const newToolName = TopPointCloudPolygonOperation.pattern === EPolygonPattern.Normal ? EToolName.Rect : EToolName.Polygon;
+          updatePointCloudPattern(newToolName);
+          const POLYGON_PATTERN = {
+            [EToolName.Polygon]: t("PolygonPattern"),
+            [EToolName.Rect]: t("RectPattern")
+          };
+          message.success(t("ChangePatternMsg", {pattern: POLYGON_PATTERN[newToolName]}));
+          TopPointCloudPolygonOperation.clearActiveStatus();
+          TopPointCloudPolygonOperation.clearDrawingStatus();
+        }
+        break;
+      case "+":
+        mainViewInstance == null ? void 0 : mainViewInstance.updatePointSize(true);
+        break;
+      case "-":
+        mainViewInstance == null ? void 0 : mainViewInstance.updatePointSize(false);
+        break;
+      case "v":
+        ptCtx.setPointCloudValid(!ptCtx.valid);
+        break;
+      case "tab":
+        if (e.shiftKey) {
+          selectPrevBox();
+          break;
+        }
+        selectNextBox();
+        e.preventDefault();
+        break;
+      case "f":
+        changeSelectedBoxValid();
+        break;
+      case "arrowup":
+        updatePolygonOffset({y: -1});
+        break;
+      case "arrowdown":
+        updatePolygonOffset({y: 1});
+        break;
+      case "arrowleft":
+        updatePolygonOffset({x: -1});
+        break;
+      case "arrowright":
+        updatePolygonOffset({x: 1});
+        break;
+      case "delete":
+        deleteSelectedPointCloudBoxAndPolygon();
+        break;
+      default: {
+        if (((_a = config.attributeList) == null ? void 0 : _a.length) > 0) {
+          const keyCode2Attribute = AttributeUtils.getAttributeByKeycode(e.keyCode, config.attributeList);
+          if (keyCode2Attribute !== void 0) {
+            toolInstanceRef.current.setDefaultAttribute(keyCode2Attribute);
+          }
+        }
+        return;
+      }
+    }
+  };
+  const ctrlKeydownEvents = (lowerCaseKey, e) => {
+    switch (lowerCaseKey) {
+      case "c":
+        copySelectedBoxes();
+        break;
+      case "v":
+        pasteSelectedBoxes();
+        break;
+      case "a":
+        e.preventDefault();
+        ptCtx.selectedAllBoxes();
+        break;
+      case "z": {
+        if (e.shiftKey) {
+          redo();
+        } else {
+          undo();
+        }
+        break;
+      }
+    }
+  };
+  const onKeyDown = (e) => {
+    if (!CommonToolUtils.hotkeyFilter(e) || checkMode === true) {
+      return;
+    }
+    const lowerCaseKey = e.key.toLocaleLowerCase();
+    if (e.ctrlKey) {
+      ctrlKeydownEvents(lowerCaseKey, e);
+      return;
+    }
+    keydownEvents(lowerCaseKey, e);
+  };
+  useEffect(() => {
+    const {topViewInstance} = ptCtx;
+    if (!topViewInstance) {
+      return;
+    }
+    window.addEventListener("keydown", onKeyDown);
+    return () => {
+      window.removeEventListener("keydown", onKeyDown);
+    };
+  }, [ptCtx, copiedBoxes, config, ptCtx.pointCloudBoxList, ptCtx.polygonList]);
+  useEffect(() => {
+    syncAllViewsConfig(config);
+  }, [configString]);
+  useEffect(() => {
+    if (config == null ? void 0 : config.radius) {
+      reRenderTopViewRange(config == null ? void 0 : config.radius);
+    }
+  }, [config == null ? void 0 : config.radius]);
+  useEffect(() => {
+    updatePointCloudData == null ? void 0 : updatePointCloudData();
+  }, [imgIndex, ptCtx.mainViewInstance]);
+  useEffect(() => {
+    ptCtx.setHideAttributes([]);
+  }, [imgIndex]);
+  useEffect(() => {
+    toolInstanceRef.current.exportData = () => {
+      return [ptCtx.pointCloudBoxList, {valid: ptCtx.valid}];
+    };
+    toolInstanceRef.current.exportCustomData = () => {
+      var _a, _b, _c;
+      return {
+        resultPolygon: (_a = ptCtx.polygonList) != null ? _a : [],
+        resultLine: (_b = ptCtx.lineList) != null ? _b : [],
+        resultPoint: (_c = ptCtx.pointCloudSphereList) != null ? _c : []
+      };
+    };
+    toolInstanceRef.current.setDefaultAttribute = (newAttribute) => {
+      var _a;
+      syncThreeViewsAttribute(newAttribute);
+      const selectBox = ptCtx.selectedPointCloudBox;
+      if (selectBox) {
+        selectBox.attribute = newAttribute;
+        const newPointCloudList = updateSelectedBox(selectBox);
+        if (ptCtx.mainViewInstance) {
+          topViewSelectedChanged({
+            newSelectedBox: selectBox,
+            newPointCloudList
+          });
+        }
+      }
+      if (selectedPolygon) {
+        pushHistoryUnderUpdatePolygon(__spreadProps(__spreadValues({}, selectedPolygon), {attribute: newAttribute}));
+      }
+      if (selectedSphere) {
+        const newSphereList = updatePointCloudSphere(__spreadProps(__spreadValues({}, selectedSphere), {
+          attribute: newAttribute
+        }));
+        if (ptCtx.mainViewInstance) {
+          (_a = ptCtx.mainViewInstance) == null ? void 0 : _a.generateSpheres(newSphereList);
+          topViewSelectedChanged({
+            newSelectedSphere: selectedSphere,
+            newSphereList
+          });
+        }
+      }
+    };
+    toolInstanceRef.current.setSubAttribute = (key, value) => {
+      var _a;
+      const selectBox = ptCtx.selectedPointCloudBox;
+      if (selectBox) {
+        const originSubAttribute = (_a = selectBox == null ? void 0 : selectBox.subAttribute) != null ? _a : {};
+        selectBox.subAttribute = __spreadProps(__spreadValues({}, originSubAttribute), {
+          [key]: value
+        });
+        updateSelectedBox(selectBox);
+      }
+    };
+    toolInstanceRef.current.clearResult = () => {
+      clearAllResult == null ? void 0 : clearAllResult();
+    };
+    toolInstanceRef.current.redo = () => {
+      redo();
+    };
+    toolInstanceRef.current.undo = () => {
+      undo();
+    };
+    toolInstanceRef.current.setValid = (valid) => {
+      toolInstanceRef.current.valid = valid;
+      setTimeout(() => {
+        ptCtx.setPointCloudValid(valid);
+        if (valid === false) {
+          clearAllResult();
+        }
+      });
+    };
+    toolInstanceRef.current.setForbidOperation = (forbidOperation) => {
+      var _a, _b;
+      (_b = (_a = ptCtx.topViewInstance) == null ? void 0 : _a.pointCloud2dOperation) == null ? void 0 : _b.setForbidOperation(forbidOperation);
+      if (forbidOperation === true) {
+        ptCtx.setSelectedIDs(void 0);
+      }
+    };
+    toolInstanceRef.current.setShowDefaultCursor = (showDefaultCursor) => {
+      var _a, _b;
+      (_b = (_a = ptCtx.topViewInstance) == null ? void 0 : _a.pointCloud2dOperation) == null ? void 0 : _b.setShowDefaultCursor(showDefaultCursor);
+    };
+    toolInstanceRef.current.asyncData = (newData) => {
+      setTimeout(() => {
+        updatePointCloudData == null ? void 0 : updatePointCloudData(newData);
+      });
+    };
+  }, [
+    ptCtx.pointCloudBoxList,
+    ptCtx.pointCloudSphereList,
+    ptCtx.selectedID,
+    ptCtx.valid,
+    ptCtx.polygonList,
+    ptCtx.lineList,
+    ptCtx.mainViewInstance
+  ]);
+  useEffect(() => {
+    toolInstanceRef.current.history = {
+      pushHistory: (result) => {
+        pushHistoryWithList({pointCloudBoxList: result});
+      },
+      initRecord: () => {
+      }
+    };
+  }, []);
+  useEffect(() => {
+    var _a;
+    const toolInstance = (_a = ptCtx.topViewInstance) == null ? void 0 : _a.toolInstance;
+    if (!toolInstance || checkMode) {
+      return;
+    }
+    const syncAttribute = (newAttribute) => {
+      syncThreeViewsAttribute(newAttribute);
+    };
+    const messageError = (error) => {
+      message.error(error);
+    };
+    const messageInfo = (info) => {
+      message.info(info);
+    };
+    toolInstance.on("syncAttribute", syncAttribute);
+    toolInstance.on("messageError", messageError);
+    toolInstance.on("messageInfo", messageInfo);
+    return () => {
+      toolInstance.unbind("syncAttribute", syncAttribute);
+      toolInstance.unbind("messageError", messageError);
+      toolInstance.unbind("messageInfo", messageInfo);
+    };
+  }, [ptCtx.topViewInstance]);
+  return null;
+};
+var PointCloudListener$1 = connect(a2MapStateToProps, null, null, {context: LabelBeeContext})(PointCloudListener);
+
+export { PointCloudListener$1 as default };
+//# sourceMappingURL=PointCloudListener.js.map

package/es/components/pointCloudView/PointCloudListener.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PointCloudListener.js","sources":["../../../src/components/pointCloudView/PointCloudListener.tsx"],"sourcesContent":["import { PointCloudContext } from './PointCloudContext';\nimport { useRotate } from './hooks/useRotate';\nimport { useBoxes } from './hooks/useBoxes';\nimport { useSingleBox } from './hooks/useSingleBox';\nimport { useSphere } from './hooks/useSphere';\nimport React, { useContext, useEffect } from 'react';\nimport { cTool, AttributeUtils, CommonToolUtils, EToolName } from '@labelbee/lb-annotation';\nimport { message } from 'antd';\nimport { connect } from 'react-redux';\nimport { a2MapStateToProps, IA2MapStateProps } from '@/store/annotation/map';\nimport { useCustomToolInstance } from '@/hooks/annotation';\nimport { useStatus } from './hooks/useStatus';\nimport { jsonParser } from '@/utils';\nimport { usePointCloudViews } from './hooks/usePointCloudViews';\nimport { LabelBeeContext } from '@/store/ctx';\nimport { useHistory } from './hooks/useHistory';\nimport { useAttribute } from './hooks/useAttribute';\nimport { ICoordinate } from '@labelbee/lb-utils/dist/types/types/common';\nimport { useConfig } from './hooks/useConfig';\nimport { usePolygon } from './hooks/usePolygon';\nimport { useTranslation } from 'react-i18next';\nimport { IFileItem } from '@/types/data';\n\nconst { EPolygonPattern } = cTool;\n\ninterface IProps extends IA2MapStateProps {\n  checkMode?: boolean;\n}\n\nconst PointCloudListener: React.FC<IProps> = ({\n  currentData,\n  config,\n  checkMode,\n  configString,\n  imgIndex,\n}) => {\n  const ptCtx = useContext(PointCloudContext);\n  const {\n    changeSelectedBoxValid,\n    selectNextBox,\n    selectPrevBox,\n    updateSelectedBox,\n    deleteSelectedPointCloudBoxAndPolygon,\n  } = useSingleBox();\n  const { selectedSphere, updatePointCloudSphere } = useSphere();\n  const { clearAllResult, updatePointCloudPattern } = useStatus();\n  const basicInfo = jsonParser(currentData.result);\n  const { copySelectedBoxes, pasteSelectedBoxes, copiedBoxes } = useBoxes({ config });\n  const { toolInstanceRef } = useCustomToolInstance({ basicInfo });\n  const { updateRotate } = useRotate({ currentData });\n  const { updatePointCloudData, topViewSelectedChanged } = usePointCloudViews();\n  const { redo, undo, pushHistoryWithList, pushHistoryUnderUpdatePolygon } = useHistory();\n  const { syncThreeViewsAttribute } = useAttribute();\n  const { syncAllViewsConfig, reRenderTopViewRange } = useConfig();\n  const { selectedPolygon } = usePolygon();\n  const { t } = useTranslation();\n\n  const updatePolygonOffset = (offset: Partial<ICoordinate>) => {\n    const { topViewInstance } = ptCtx;\n    if (!topViewInstance) {\n      return;\n    }\n    topViewInstance.pointCloud2dOperation?.updateSelectedPolygonsPoints(offset);\n  };\n\n  const keydownEvents = (lowerCaseKey: string, e: KeyboardEvent) => {\n    const { topViewInstance, mainViewInstance } = ptCtx;\n    if (!topViewInstance) {\n      return;\n    }\n\n    const { pointCloud2dOperation: TopPointCloudPolygonOperation } = topViewInstance;\n\n    switch (lowerCaseKey) {\n      case 'q': {\n        // Q - anticlockwise\n        updateRotate(2);\n        break;\n      }\n\n      case 'e':\n        // E - closewise\n        updateRotate(-2);\n\n        break;\n\n      case 'g':\n        // G ， overturn 180\n        updateRotate(180);\n\n        break;\n\n      case 'u':\n        {\n          // U , change TopOpereation Pattern\n          const newToolName =\n            TopPointCloudPolygonOperation.pattern === EPolygonPattern.Normal\n              ? EToolName.Rect\n              : EToolName.Polygon;\n          updatePointCloudPattern(newToolName);\n\n          // Tips\n          const POLYGON_PATTERN = {\n            [EToolName.Polygon]: t('PolygonPattern'),\n            [EToolName.Rect]: t('RectPattern'),\n          };\n          message.success(t('ChangePatternMsg', { pattern: POLYGON_PATTERN[newToolName] }));\n\n          // Clear Status\n          TopPointCloudPolygonOperation.clearActiveStatus();\n          TopPointCloudPolygonOperation.clearDrawingStatus();\n        }\n\n        break;\n\n      // +: Increase points size\n      case '+':\n        mainViewInstance?.updatePointSize(true);\n        break;\n\n      // -: Reduce points size\n      case '-':\n        mainViewInstance?.updatePointSize(false);\n        break;\n\n      case 'v':\n        ptCtx.setPointCloudValid(!ptCtx.valid);\n        break;\n\n      case 'tab':\n        if (e.shiftKey) {\n          selectPrevBox();\n          break;\n        }\n        selectNextBox();\n        e.preventDefault();\n        break;\n\n      case 'f':\n        changeSelectedBoxValid();\n        break;\n\n      case 'arrowup':\n        updatePolygonOffset({ y: -1 });\n        break;\n\n      case 'arrowdown':\n        updatePolygonOffset({ y: 1 });\n        break;\n\n      case 'arrowleft':\n        updatePolygonOffset({ x: -1 });\n        break;\n\n      case 'arrowright':\n        updatePolygonOffset({ x: 1 });\n        break;\n\n      case 'delete':\n        deleteSelectedPointCloudBoxAndPolygon();\n        break;\n\n      default: {\n        if (config.attributeList?.length > 0) {\n          const keyCode2Attribute = AttributeUtils.getAttributeByKeycode(\n            e.keyCode,\n            config.attributeList,\n          );\n\n          if (keyCode2Attribute !== undefined) {\n            toolInstanceRef.current.setDefaultAttribute(keyCode2Attribute);\n          }\n        }\n        return;\n      }\n    }\n  };\n\n  const ctrlKeydownEvents = (lowerCaseKey: string, e: KeyboardEvent) => {\n    switch (lowerCaseKey) {\n      case 'c':\n        copySelectedBoxes();\n        break;\n      case 'v':\n        pasteSelectedBoxes();\n        break;\n      case 'a':\n        e.preventDefault();\n        ptCtx.selectedAllBoxes();\n        break;\n      case 'z': {\n        if (e.shiftKey) {\n          redo();\n        } else {\n          undo();\n        }\n        break;\n      }\n\n      default:\n        break;\n    }\n  };\n\n  const onKeyDown = (e: KeyboardEvent) => {\n    if (!CommonToolUtils.hotkeyFilter(e) || checkMode === true) {\n      return;\n    }\n\n    const lowerCaseKey = e.key.toLocaleLowerCase();\n\n    if (e.ctrlKey) {\n      ctrlKeydownEvents(lowerCaseKey, e);\n      return;\n    }\n\n    keydownEvents(lowerCaseKey, e);\n  };\n\n  useEffect(() => {\n    const { topViewInstance } = ptCtx;\n    if (!topViewInstance) {\n      return;\n    }\n\n    window.addEventListener('keydown', onKeyDown);\n\n    return () => {\n      window.removeEventListener('keydown', onKeyDown);\n    };\n  }, [ptCtx, copiedBoxes, config, ptCtx.pointCloudBoxList, ptCtx.polygonList]);\n\n  useEffect(() => {\n    syncAllViewsConfig(config);\n  }, [configString]);\n\n  useEffect(() => {\n    if (config?.radius) {\n      reRenderTopViewRange(config?.radius);\n    }\n  }, [config?.radius]);\n\n  // Page switch data initialization\n  useEffect(() => {\n    updatePointCloudData?.();\n  }, [imgIndex, ptCtx.mainViewInstance]);\n\n  useEffect(() => {\n    ptCtx.setHideAttributes([]);\n  }, [imgIndex]);\n\n  // Update the listener of toolInstance.\n  useEffect(() => {\n    toolInstanceRef.current.exportData = () => {\n      return [ptCtx.pointCloudBoxList, { valid: ptCtx.valid }];\n    };\n\n    toolInstanceRef.current.exportCustomData = () => {\n      return {\n        resultPolygon: ptCtx.polygonList ?? [],\n        resultLine: ptCtx.lineList ?? [],\n        resultPoint: ptCtx.pointCloudSphereList ?? [],\n      };\n    };\n\n    toolInstanceRef.current.setDefaultAttribute = (newAttribute: string) => {\n      syncThreeViewsAttribute(newAttribute);\n      const selectBox = ptCtx.selectedPointCloudBox;\n      if (selectBox) {\n        selectBox.attribute = newAttribute;\n\n        const newPointCloudList = updateSelectedBox(selectBox);\n\n        if (ptCtx.mainViewInstance) {\n          // TODO: Poor performance.\n          topViewSelectedChanged({\n            newSelectedBox: selectBox,\n            newPointCloudList: newPointCloudList,\n          });\n        }\n      }\n      if (selectedPolygon) {\n        pushHistoryUnderUpdatePolygon({ ...selectedPolygon, attribute: newAttribute });\n      }\n      if (selectedSphere) {\n        const newSphereList = updatePointCloudSphere({\n          ...selectedSphere,\n          attribute: newAttribute,\n        });\n        if (ptCtx.mainViewInstance) {\n          ptCtx.mainViewInstance?.generateSpheres(newSphereList);\n          topViewSelectedChanged({\n            newSelectedSphere: selectedSphere,\n            newSphereList: newSphereList,\n          });\n        }\n      }\n    };\n\n    toolInstanceRef.current.setSubAttribute = (key: string, value: string) => {\n      const selectBox = ptCtx.selectedPointCloudBox;\n      if (selectBox) {\n        const originSubAttribute = selectBox?.subAttribute ?? {};\n\n        selectBox.subAttribute = {\n          ...originSubAttribute,\n          [key]: value,\n        };\n\n        updateSelectedBox(selectBox);\n      }\n    };\n    toolInstanceRef.current.clearResult = () => {\n      clearAllResult?.();\n    };\n\n    toolInstanceRef.current.redo = () => {\n      redo();\n    };\n\n    toolInstanceRef.current.undo = () => {\n      undo();\n    };\n\n    toolInstanceRef.current.setValid = (valid: boolean) => {\n      toolInstanceRef.current.valid = valid;\n\n      // Avoid triggering SetState operations in the reducer phase\n      setTimeout(() => {\n        ptCtx.setPointCloudValid(valid);\n\n        if (valid === false) {\n          clearAllResult();\n        }\n      });\n    };\n\n    /**\n     * TopView forbid all operations.\n     * @param forbidOperation\n     */\n    toolInstanceRef.current.setForbidOperation = (forbidOperation: boolean) => {\n      ptCtx.topViewInstance?.pointCloud2dOperation?.setForbidOperation(forbidOperation);\n      if (forbidOperation === true) {\n        // Clear Selected Status.\n        ptCtx.setSelectedIDs(undefined);\n      }\n    };\n\n    toolInstanceRef.current.setShowDefaultCursor = (showDefaultCursor: boolean) => {\n      ptCtx.topViewInstance?.pointCloud2dOperation?.setShowDefaultCursor(showDefaultCursor);\n    };\n\n    toolInstanceRef.current.asyncData = (newData: IFileItem) => {\n      // Next Tick to update.\n      setTimeout(() => {\n        updatePointCloudData?.(newData);\n      });\n    };\n  }, [\n    ptCtx.pointCloudBoxList,\n    ptCtx.pointCloudSphereList,\n    ptCtx.selectedID,\n    ptCtx.valid,\n    ptCtx.polygonList,\n    ptCtx.lineList,\n    ptCtx.mainViewInstance,\n  ]);\n\n  useEffect(() => {\n    toolInstanceRef.current.history = {\n      // Origin Result\n      pushHistory: (result: any[]) => {\n        // Rewrite\n        // TODO, The polygon is out of range.\n        pushHistoryWithList({ pointCloudBoxList: result });\n      },\n      initRecord: () => {},\n    };\n  }, []);\n\n  useEffect(() => {\n    const toolInstance = ptCtx.topViewInstance?.toolInstance;\n\n    if (!toolInstance || checkMode) {\n      return;\n    }\n    // TopViewOperation Emitter\n    const syncAttribute = (newAttribute: string) => {\n      syncThreeViewsAttribute(newAttribute);\n    };\n\n    const messageError = (error: string) => {\n      message.error(error);\n    };\n    const messageInfo = (info: string) => {\n      message.info(info);\n    };\n\n    toolInstance.on('syncAttribute', syncAttribute);\n    toolInstance.on('messageError', messageError);\n    toolInstance.on('messageInfo', messageInfo);\n\n    return () => {\n      toolInstance.unbind('syncAttribute', syncAttribute);\n      toolInstance.unbind('messageError', messageError);\n      toolInstance.unbind('messageInfo', messageInfo);\n    };\n  }, [ptCtx.topViewInstance]);\n\n  return null;\n};\n\nexport default connect(a2MapStateToProps, null, null, { context: LabelBeeContext })(\n  PointCloudListener,\n);\n"],"names":[],"mappings":"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"}

package/es/components/pointCloudView/PointCloudSegment.js

@@ -0,0 +1,57 @@
+import useSize from '../../hooks/useSize.js';
+import { a2MapStateToProps } from '../../store/annotation/map.js';
+import { LabelBeeContext } from '../../store/ctx.js';
+import { getClassName } from '../../utils/dom.js';
+import { PointCloud } from '@labelbee/lb-annotation';
+import React, { useRef, useContext, useEffect } from 'react';
+import { connect } from 'react-redux';
+import { PointCloudContext } from './PointCloudContext.js';
+import { usePointCloudViews } from './hooks/usePointCloudViews.js';
+
+const PointCloudSegment = ({currentData, config}) => {
+  const domRef = useRef(null);
+  const {setPtSegmentInstance, ptSegmentInstance} = useContext(PointCloudContext);
+  const size = useSize(domRef);
+  usePointCloudViews();
+  console.log("size", size);
+  useEffect(() => {
+    var _a;
+    if (!(size == null ? void 0 : size.width) || !domRef.current) {
+      return;
+    }
+    const orthographicParams = {
+      left: -size.width / 2,
+      right: size.width / 2,
+      top: size.height / 2,
+      bottom: -size.height / 2,
+      near: 100,
+      far: -100
+    };
+    const ptSegmentInstance2 = new PointCloud({
+      container: domRef.current,
+      isOrthographicCamera: true,
+      orthographicParams,
+      config
+    });
+    setPtSegmentInstance(ptSegmentInstance2);
+    if (currentData == null ? void 0 : currentData.url) {
+      debugger;
+      ptSegmentInstance2.loadPCDFile((_a = currentData == null ? void 0 : currentData.url) != null ? _a : "");
+    }
+  }, [size]);
+  useEffect(() => {
+    var _a;
+    if (ptSegmentInstance && currentData.url) {
+      console.log(currentData == null ? void 0 : currentData.url);
+      ptSegmentInstance.loadPCDFile((_a = currentData == null ? void 0 : currentData.url) != null ? _a : "");
+    }
+  }, [currentData, ptSegmentInstance]);
+  return /* @__PURE__ */ React.createElement("div", {
+    className: getClassName("point-cloud-layout"),
+    ref: domRef
+  });
+};
+var PointCloudSegment$1 = connect(a2MapStateToProps, null, null, {context: LabelBeeContext})(PointCloudSegment);
+
+export { PointCloudSegment$1 as default };
+//# sourceMappingURL=PointCloudSegment.js.map

package/es/components/pointCloudView/PointCloudSegment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PointCloudSegment.js","sources":["../../../src/components/pointCloudView/PointCloudSegment.tsx"],"sourcesContent":["import useSize from '@/hooks/useSize';\nimport { IA2MapStateProps, a2MapStateToProps } from '@/store/annotation/map';\nimport { LabelBeeContext } from '@/store/ctx';\nimport { getClassName } from '@/utils/dom';\nimport { PointCloud } from '@labelbee/lb-annotation';\nimport React, { useContext, useEffect, useRef, useState } from 'react';\nimport { connect } from 'react-redux';\nimport { PointCloudContext } from './PointCloudContext';\nimport { usePointCloudViews } from './hooks/usePointCloudViews';\n\nconst PointCloudSegment: React.FC<IA2MapStateProps> = ({ currentData, config }) => {\n  const domRef = useRef<HTMLDivElement>(null);\n  const { setPtSegmentInstance, ptSegmentInstance } = useContext(PointCloudContext);\n  const size = useSize(domRef);\n  const { updatePointCloudSegmentData } = usePointCloudViews();\n\n  console.log('size', size);\n  useEffect(() => {\n    if (!size?.width || !domRef.current) {\n      return;\n    }\n\n    const orthographicParams = {\n      left: -size.width / 2,\n      right: size.width / 2,\n      top: size.height / 2,\n      bottom: -size.height / 2,\n      near: 100,\n      far: -100,\n    };\n\n    const ptSegmentInstance = new PointCloud({\n      container: domRef.current,\n      isOrthographicCamera: true,\n      orthographicParams,\n      config,\n    });\n\n    setPtSegmentInstance(ptSegmentInstance);\n\n    // TODO\n    if (currentData?.url) {\n      debugger;\n      ptSegmentInstance.loadPCDFile(currentData?.url ?? '');\n    }\n  }, [size]);\n\n  // Template just for show\n  useEffect(() => {\n    if (ptSegmentInstance && currentData.url) {\n      console.log( currentData?.url);\n      ptSegmentInstance.loadPCDFile(currentData?.url ?? '');\n    }\n  }, [currentData, ptSegmentInstance]);\n\n  return <div className={getClassName('point-cloud-layout')} ref={domRef} />;\n};\n\nexport default connect(a2MapStateToProps, null, null, { context: LabelBeeContext })(\n  PointCloudSegment,\n);\n"],"names":[],"mappings":";;;;;;;;;;AAUA,MAAM,iBAAgD,GAAA,CAAC,CAAE,WAAA,EAAa,MAAa,CAAA,KAAA;AACjF,EAAA,MAAM,SAAS,MAAuB,CAAA,IAAA,CAAA,CAAA;AACtC,EAAM,MAAA,CAAE,oBAAsB,EAAA,iBAAA,CAAA,GAAsB,UAAW,CAAA,iBAAA,CAAA,CAAA;AAC/D,EAAA,MAAM,OAAO,OAAQ,CAAA,MAAA,CAAA,CAAA;AACrB,EAAwC,kBAAA,GAAA;AAExC,EAAA,OAAA,CAAQ,IAAI,MAAQ,EAAA,IAAA,CAAA,CAAA;AACpB,EAAA,SAAA,CAAU,MAAM;AAjBlB,IAAA,IAAA,EAAA,CAAA;AAkBI,IAAA,IAAI,EAAC,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,CAAM,KAAS,CAAA,IAAA,CAAC,OAAO,OAAS,EAAA;AACnC,MAAA,OAAA;AAAA,KAAA;AAGF,IAAA,MAAM,kBAAqB,GAAA;AAAA,MACzB,IAAA,EAAM,CAAC,IAAA,CAAK,KAAQ,GAAA,CAAA;AAAA,MACpB,KAAA,EAAO,KAAK,KAAQ,GAAA,CAAA;AAAA,MACpB,GAAA,EAAK,KAAK,MAAS,GAAA,CAAA;AAAA,MACnB,MAAA,EAAQ,CAAC,IAAA,CAAK,MAAS,GAAA,CAAA;AAAA,MACvB,IAAM,EAAA,GAAA;AAAA,MACN,GAAK,EAAA,CAAA,GAAA;AAAA,KAAA,CAAA;AAGP,IAAM,MAAA,kBAAA,GAAoB,IAAI,UAAW,CAAA;AAAA,MACvC,WAAW,MAAO,CAAA,OAAA;AAAA,MAClB,oBAAsB,EAAA,IAAA;AAAA,MACtB,kBAAA;AAAA,MACA,MAAA;AAAA,KAAA,CAAA,CAAA;AAGF,IAAqB,oBAAA,CAAA,kBAAA,CAAA,CAAA;AAGrB,IAAA,IAAI,2CAAa,GAAK,EAAA;AACpB,MAAA,SAAA;AACA,MAAkB,kBAAA,CAAA,WAAA,CAAY,CAAa,EAAA,GAAA,WAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,GAAA,KAAb,IAAoB,GAAA,EAAA,GAAA,EAAA,CAAA,CAAA;AAAA,KAAA;AAAA,GAAA,EAEnD,CAAC,IAAA,CAAA,CAAA,CAAA;AAGJ,EAAA,SAAA,CAAU,MAAM;AAhDlB,IAAA,IAAA,EAAA,CAAA;AAiDI,IAAI,IAAA,iBAAA,IAAqB,YAAY,GAAK,EAAA;AACxC,MAAA,OAAA,CAAQ,IAAK,WAAa,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,GAAA,CAAA,CAAA;AAC1B,MAAkB,iBAAA,CAAA,WAAA,CAAY,CAAa,EAAA,GAAA,WAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAA,GAAA,KAAb,IAAoB,GAAA,EAAA,GAAA,EAAA,CAAA,CAAA;AAAA,KAAA;AAAA,GAAA,EAEnD,CAAC,WAAa,EAAA,iBAAA,CAAA,CAAA,CAAA;AAEjB,EAAA,2CAAQ,KAAD,EAAA;AAAA,IAAK,WAAW,YAAa,CAAA,oBAAA,CAAA;AAAA,IAAuB,GAAK,EAAA,MAAA;AAAA,GAAA,CAAA,CAAA;AAAA,CAAA,CAAA;AAGlE,0BAAe,QAAQ,iBAAmB,EAAA,IAAA,EAAM,IAAM,EAAA,CAAE,SAAS,eAC/D,CAAA,CAAA,CAAA,iBAAA,CAAA;;;;"}

package/es/components/pointCloudView/PointCloudSideView.js

@@ -1 +1,129 @@
-import{PointCloudAnnotation as P}from"@labelbee/lb-annotation";import{getClassName as w}from"../../utils/dom.js";import{PointCloudContainer as v}from"./PointCloudLayout.js";import f,{useRef as y,useEffect as C}from"react";import{EPerspectiveView as V}from"@labelbee/lb-utils";import{PointCloudContext as j}from"./PointCloudContext.js";import{SizeInfoForView as B}from"./PointCloudInfos.js";import{connect as S}from"react-redux";import{a2MapStateToProps as b}from"../../store/annotation/map.js";import{usePointCloudViews as E}from"./hooks/usePointCloudViews.js";import{useSingleBox as I}from"./hooks/useSingleBox.js";import{useSphere as T}from"./hooks/useSphere.js";import D from"./components/EmptyPage/index.js";import N from"../../hooks/useSize.js";import{useTranslation as k}from"react-i18next";import{LabelBeeContext as M}from"../../store/ctx.js";import O from"../../utils/ToolUtils.js";import{useZoom as X}from"./hooks/useZoom.js";const L=(c,l,e=1)=>{const{width:u,height:i}=l,d={x:c.x+u*e/2,y:c.y+i*e/2},r={x:l.width/2,y:l.height/2};return{offsetX:(r.x-d.x)/e,offsetY:-(r.y-d.y)/e}},h=(c,l,e,u,i)=>{const{offsetX:d,offsetY:r}=L(c,e,l);if(i.camera.zoom=l,c){const a=Math.cos(u),o=Math.sin(u),x=d*a,p=d*o,{x:n,y:m,z:t}=i.initCameraPosition;i.camera.position.set(n-x,m-p,t+r)}i.camera.updateProjectionMatrix(),i.render()},U=({config:c,checkMode:l})=>{const e=f.useContext(j),{sideViewUpdateBox:u,sideViewUpdatePoint:i}=E(),{selectedBox:d}=I(),{selectedSphere:r}=T(),a=y(null),o=N(a),{t:x}=k(),{syncSideviewToolZoom:p}=X();return C(()=>{if(a.current){const n={width:a.current.clientWidth,height:a.current.clientHeight},m=new P({container:a.current,size:n,extraProps:{showDirectionLine:!1,forbidAddNew:!0,forbidDelete:!0},config:c,checkMode:l,toolName:O.getPointCloudToolList()});e.setSideViewInstance(m)}},[]),C(()=>{if(!o||!e.sideViewInstance)return;const{toolInstance:n,pointCloudInstance:m}=e.sideViewInstance;n.singleOn("renderZoom",(t,s)=>{if(e.selectedPointCloudBox){h(s,t,o,e.selectedPointCloudBox.rotation,m),p(s,t,o);return}r&&(h(s,t,o,0,m),p(s,t,o))}),n.singleOn("dragMove",({currentPos:t,zoom:s})=>{!e.selectedPointCloudBox&&!r||h(t,s,o,e.selectedPointCloudBox?e.selectedPointCloudBox.rotation:0,m)}),n.singleOn("updatePointByDrag",(t,s)=>{r&&(i==null||i(t,s[0]))}),n.singleOn("updatePolygonByDrag",t=>{if(e.selectedIDs.length===1&&t.length===1){const{newPolygon:s,originPolygon:g}=t[0];u(s,g)}})},[e,o]),C(()=>{var n;(n=e==null?void 0:e.sideViewInstance)==null||n.initSize(o)},[o]),f.createElement(v,{className:w("point-cloud-container","side-view"),title:x("SideView"),toolbar:f.createElement(B,{perspectiveView:V.Left})},f.createElement("div",{className:w("point-cloud-container","bottom-view-content")},f.createElement("div",{className:w("point-cloud-container","core-instance"),ref:a}),!d&&!r&&f.createElement(D,null)))};var Z=S(b,null,null,{context:M})(U);export{Z as default};
+import { PointCloudAnnotation } from '@labelbee/lb-annotation';
+import { getClassName } from '../../utils/dom.js';
+import { PointCloudContainer } from './PointCloudLayout.js';
+import React, { useRef, useEffect } from 'react';
+import { EPerspectiveView } from '@labelbee/lb-utils';
+import { PointCloudContext } from './PointCloudContext.js';
+import { SizeInfoForView } from './PointCloudInfos.js';
+import { connect } from 'react-redux';
+import { a2MapStateToProps } from '../../store/annotation/map.js';
+import { usePointCloudViews } from './hooks/usePointCloudViews.js';
+import { useSingleBox } from './hooks/useSingleBox.js';
+import { useSphere } from './hooks/useSphere.js';
+import EmptyPage from './components/EmptyPage/index.js';
+import useSize from '../../hooks/useSize.js';
+import { useTranslation } from 'react-i18next';
+import { LabelBeeContext } from '../../store/ctx.js';
+import ToolUtils from '../../utils/ToolUtils.js';
+import { useZoom } from './hooks/useZoom.js';
+
+const TransferCanvas2WorldOffset = (currentPos, size, zoom = 1) => {
+  const {width: w, height: h} = size;
+  const canvasCenterPoint = {
+    x: currentPos.x + w * zoom / 2,
+    y: currentPos.y + h * zoom / 2
+  };
+  const worldCenterPoint = {
+    x: size.width / 2,
+    y: size.height / 2
+  };
+  return {
+    offsetX: (worldCenterPoint.x - canvasCenterPoint.x) / zoom,
+    offsetY: -(worldCenterPoint.y - canvasCenterPoint.y) / zoom
+  };
+};
+const updateSideViewByCanvas2D = (currentPos, zoom, size, rotation, SidePointCloud) => {
+  const {offsetX, offsetY} = TransferCanvas2WorldOffset(currentPos, size, zoom);
+  SidePointCloud.camera.zoom = zoom;
+  if (currentPos) {
+    const cos = Math.cos(rotation);
+    const sin = Math.sin(rotation);
+    const offsetXX = offsetX * cos;
+    const offsetXY = offsetX * sin;
+    const {x, y, z} = SidePointCloud.initCameraPosition;
+    SidePointCloud.camera.position.set(x - offsetXX, y - offsetXY, z + offsetY);
+  }
+  SidePointCloud.camera.updateProjectionMatrix();
+  SidePointCloud.render();
+};
+const PointCloudSideView = ({config, checkMode}) => {
+  const ptCtx = React.useContext(PointCloudContext);
+  const {sideViewUpdateBox, sideViewUpdatePoint} = usePointCloudViews();
+  const {selectedBox} = useSingleBox();
+  const {selectedSphere} = useSphere();
+  const ref = useRef(null);
+  const size = useSize(ref);
+  const {t} = useTranslation();
+  const {syncSideviewToolZoom} = useZoom();
+  useEffect(() => {
+    if (ref.current) {
+      const size2 = {
+        width: ref.current.clientWidth,
+        height: ref.current.clientHeight
+      };
+      const pointCloudAnnotation = new PointCloudAnnotation({
+        container: ref.current,
+        size: size2,
+        extraProps: {showDirectionLine: false, forbidAddNew: true, forbidDelete: true},
+        config,
+        checkMode,
+        toolName: ToolUtils.getPointCloudToolList()
+      });
+      ptCtx.setSideViewInstance(pointCloudAnnotation);
+    }
+  }, []);
+  useEffect(() => {
+    if (!size || !ptCtx.sideViewInstance) {
+      return;
+    }
+    const {toolInstance, pointCloudInstance} = ptCtx.sideViewInstance;
+    toolInstance.singleOn("renderZoom", (zoom, currentPos) => {
+      if (ptCtx.selectedPointCloudBox) {
+        updateSideViewByCanvas2D(currentPos, zoom, size, ptCtx.selectedPointCloudBox.rotation, pointCloudInstance);
+        syncSideviewToolZoom(currentPos, zoom, size);
+        return;
+      }
+      if (selectedSphere) {
+        updateSideViewByCanvas2D(currentPos, zoom, size, 0, pointCloudInstance);
+        syncSideviewToolZoom(currentPos, zoom, size);
+      }
+    });
+    toolInstance.singleOn("dragMove", ({currentPos, zoom}) => {
+      if (!ptCtx.selectedPointCloudBox && !selectedSphere) {
+        return;
+      }
+      updateSideViewByCanvas2D(currentPos, zoom, size, ptCtx.selectedPointCloudBox ? ptCtx.selectedPointCloudBox.rotation : 0, pointCloudInstance);
+    });
+    toolInstance.singleOn("updatePointByDrag", (updatePoint, oldPointList) => {
+      if (selectedSphere) {
+        sideViewUpdatePoint == null ? void 0 : sideViewUpdatePoint(updatePoint, oldPointList[0]);
+      }
+    });
+    toolInstance.singleOn("updatePolygonByDrag", (updateList) => {
+      if (ptCtx.selectedIDs.length === 1 && updateList.length === 1) {
+        const {newPolygon, originPolygon} = updateList[0];
+        sideViewUpdateBox(newPolygon, originPolygon);
+      }
+    });
+  }, [ptCtx, size]);
+  useEffect(() => {
+    var _a;
+    (_a = ptCtx == null ? void 0 : ptCtx.sideViewInstance) == null ? void 0 : _a.initSize(size);
+  }, [size]);
+  return /* @__PURE__ */ React.createElement(PointCloudContainer, {
+    className: getClassName("point-cloud-container", "side-view"),
+    title: t("SideView"),
+    toolbar: /* @__PURE__ */ React.createElement(SizeInfoForView, {
+      perspectiveView: EPerspectiveView.Left
+    })
+  }, /* @__PURE__ */ React.createElement("div", {
+    className: getClassName("point-cloud-container", "bottom-view-content")
+  }, /* @__PURE__ */ React.createElement("div", {
+    className: getClassName("point-cloud-container", "core-instance"),
+    ref
+  }), !selectedBox && !selectedSphere && /* @__PURE__ */ React.createElement(EmptyPage, null)));
+};
+var PointCloudSideView$1 = connect(a2MapStateToProps, null, null, {context: LabelBeeContext})(PointCloudSideView);
+
+export { PointCloudSideView$1 as default };
+//# sourceMappingURL=PointCloudSideView.js.map

package/es/components/pointCloudView/PointCloudSideView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PointCloudSideView.js","sources":["../../../src/components/pointCloudView/PointCloudSideView.tsx"],"sourcesContent":["/**\n * @file PointCloud sideView - React Component\n * @createdate 2022-07-11\n * @author Ron <ron.f.luo@gmail.com>\n */\nimport { PointCloud, PointCloudAnnotation, THybridToolName } from '@labelbee/lb-annotation';\nimport { getClassName } from '@/utils/dom';\nimport { PointCloudContainer } from './PointCloudLayout';\nimport React, { useEffect, useRef } from 'react';\nimport { EPerspectiveView, IPointUnit, UpdatePolygonByDragList } from '@labelbee/lb-utils';\nimport { PointCloudContext } from './PointCloudContext';\nimport { SizeInfoForView } from './PointCloudInfos';\nimport { connect } from 'react-redux';\nimport { a2MapStateToProps, IA2MapStateProps } from '@/store/annotation/map';\nimport { usePointCloudViews } from './hooks/usePointCloudViews';\nimport { useSingleBox } from './hooks/useSingleBox';\nimport { useSphere } from './hooks/useSphere';\nimport EmptyPage from './components/EmptyPage';\nimport useSize from '@/hooks/useSize';\nimport { useTranslation } from 'react-i18next';\nimport { LabelBeeContext } from '@/store/ctx';\nimport ToolUtils from '@/utils/ToolUtils';\nimport { useZoom } from '@/components/pointCloudView/hooks/useZoom';\n\n/**\n * Get the offset from canvas2d-coordinate to world coordinate\n * @param currentPos\n * @param size\n * @param zoom\n * @returns\n */\nconst TransferCanvas2WorldOffset = (\n  currentPos: { x: number; y: number },\n  size: { width: number; height: number },\n  zoom = 1,\n) => {\n  const { width: w, height: h } = size;\n\n  const canvasCenterPoint = {\n    x: currentPos.x + (w * zoom) / 2, // 放大倍数之后的中心点的偏移量\n    y: currentPos.y + (h * zoom) / 2,\n  };\n\n  const worldCenterPoint = {\n    x: size.width / 2,\n    y: size.height / 2,\n  };\n\n  return {\n    offsetX: (worldCenterPoint.x - canvasCenterPoint.x) / zoom,\n    offsetY: -(worldCenterPoint.y - canvasCenterPoint.y) / zoom,\n  };\n};\n\nconst updateSideViewByCanvas2D = (\n  currentPos: { x: number; y: number },\n  zoom: number,\n  size: { width: number; height: number },\n  rotation: number,\n  SidePointCloud: PointCloud,\n) => {\n  const { offsetX, offsetY } = TransferCanvas2WorldOffset(currentPos, size, zoom);\n  SidePointCloud.camera.zoom = zoom;\n  if (currentPos) {\n    const cos = Math.cos(rotation);\n    const sin = Math.sin(rotation);\n    const offsetXX = offsetX * cos;\n    const offsetXY = offsetX * sin;\n    const { x, y, z } = SidePointCloud.initCameraPosition;\n    SidePointCloud.camera.position.set(x - offsetXX, y - offsetXY, z + offsetY);\n  }\n  SidePointCloud.camera.updateProjectionMatrix();\n  SidePointCloud.render();\n};\n\ninterface IProps {\n  checkMode?: boolean;\n}\n\nconst PointCloudSideView: React.FC<IA2MapStateProps & IProps> = ({ config, checkMode }) => {\n  const ptCtx = React.useContext(PointCloudContext);\n  const { sideViewUpdateBox, sideViewUpdatePoint } = usePointCloudViews();\n  const { selectedBox } = useSingleBox();\n  const { selectedSphere } = useSphere();\n  const ref = useRef<HTMLDivElement>(null);\n  const size = useSize(ref);\n  const { t } = useTranslation();\n  const { syncSideviewToolZoom } = useZoom();\n\n  useEffect(() => {\n    if (ref.current) {\n      const size = {\n        width: ref.current.clientWidth,\n        height: ref.current.clientHeight,\n      };\n\n      const pointCloudAnnotation = new PointCloudAnnotation({\n        container: ref.current,\n        size,\n        extraProps: { showDirectionLine: false, forbidAddNew: true, forbidDelete: true },\n        config,\n        checkMode,\n        toolName: ToolUtils.getPointCloudToolList() as THybridToolName,\n      });\n      ptCtx.setSideViewInstance(pointCloudAnnotation);\n      // };\n    }\n  }, []);\n\n  useEffect(() => {\n    // By the way as an initialization judgment\n    if (!size || !ptCtx.sideViewInstance) {\n      return;\n    }\n\n    const { toolInstance, pointCloudInstance } = ptCtx.sideViewInstance;\n\n    /**\n     * Synchronized 3d point cloud view displacement operations\n     *\n     * Change Orthographic Camera size\n     */\n    toolInstance.singleOn('renderZoom', (zoom: number, currentPos: any) => {\n      if (ptCtx.selectedPointCloudBox) {\n        updateSideViewByCanvas2D(\n          currentPos,\n          zoom,\n          size,\n          ptCtx.selectedPointCloudBox.rotation,\n          pointCloudInstance,\n        );\n        syncSideviewToolZoom(currentPos, zoom, size);\n        return;\n      }\n      if (selectedSphere) {\n        updateSideViewByCanvas2D(currentPos, zoom, size, 0, pointCloudInstance);\n        syncSideviewToolZoom(currentPos, zoom, size);\n      }\n    });\n\n    // Synchronized 3d point cloud view displacement operations\n    toolInstance.singleOn('dragMove', ({ currentPos, zoom }: any) => {\n      if (!ptCtx.selectedPointCloudBox && !selectedSphere) {\n        return;\n      }\n      updateSideViewByCanvas2D(\n        currentPos,\n        zoom,\n        size,\n        ptCtx.selectedPointCloudBox ? ptCtx.selectedPointCloudBox.rotation : 0,\n        pointCloudInstance,\n      );\n    });\n\n    toolInstance.singleOn(\n      'updatePointByDrag',\n      (updatePoint: IPointUnit, oldPointList: IPointUnit[]) => {\n        if (selectedSphere) {\n          sideViewUpdatePoint?.(updatePoint, oldPointList[0]);\n        }\n      },\n    );\n\n    toolInstance.singleOn('updatePolygonByDrag', (updateList: UpdatePolygonByDragList) => {\n      if (ptCtx.selectedIDs.length === 1 && updateList.length === 1) {\n        const { newPolygon, originPolygon } = updateList[0];\n        sideViewUpdateBox(newPolygon, originPolygon);\n      }\n    });\n  }, [ptCtx, size]);\n\n  useEffect(() => {\n    // Update Size\n    ptCtx?.sideViewInstance?.initSize(size);\n  }, [size]);\n\n  return (\n    <PointCloudContainer\n      className={getClassName('point-cloud-container', 'side-view')}\n      title={t('SideView')}\n      toolbar={<SizeInfoForView perspectiveView={EPerspectiveView.Left} />}\n    >\n      <div className={getClassName('point-cloud-container', 'bottom-view-content')}>\n        <div className={getClassName('point-cloud-container', 'core-instance')} ref={ref} />\n        {!selectedBox && !selectedSphere && <EmptyPage />}\n      </div>\n    </PointCloudContainer>\n  );\n};\n\nexport default connect(a2MapStateToProps, null, null, { context: LabelBeeContext })(\n  PointCloudSideView,\n);\n"],"names":[],"mappings":"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"}