diff --git a/packages/lb-annotation/src/core/pointCloud/index.ts b/packages/lb-annotation/src/core/pointCloud/index.ts index 50ed0faf..e11da6e2 100644 --- a/packages/lb-annotation/src/core/pointCloud/index.ts +++ b/packages/lb-annotation/src/core/pointCloud/index.ts @@ -267,15 +267,14 @@ export class PointCloud extends EventListener { }); } - public setHighlightColor(selectedId: string) { + public setHighlightColor(selectedId?: string) { this.scene.children.forEach((child) => { if (!(child instanceof THREE.Group)) return; - const color = child.name === `box${selectedId}` ? this.highlightColor : child.userData.defaultColor; + const color = selectedId && child.name === `box${selectedId}` ? this.highlightColor : child.userData.defaultColor; child.children.forEach((grandson) => { this.updateMaterialColor(grandson, color); }); }); - this.render(); } private updateMaterialColor(child: THREE.Object3D, color: THREE.ColorRepresentation) { diff --git a/packages/lb-components/src/components/pointCloudView/PointCloud3DView.tsx b/packages/lb-components/src/components/pointCloudView/PointCloud3DView.tsx index bf5e79bb..ae3a0e81 100644 --- a/packages/lb-components/src/components/pointCloudView/PointCloud3DView.tsx +++ b/packages/lb-components/src/components/pointCloudView/PointCloud3DView.tsx @@ -250,8 +250,11 @@ const PointCloud3D: React.FC = ({ currentData, config, highlig */ const zoom = ptCtx.topViewInstance?.pointCloudInstance?.camera.zoom ?? 1; ptCtx.mainViewInstance?.updateCameraZoom(zoom); - ptCtx.mainViewInstance?.setHighlightColor(selectedId); } + // when create new box, need to wait for a moment to init box. + ptCtx.mainViewInstance?.setHighlightColor(selectedId); + ptCtx.mainViewInstance?.render(); + }, [selectedBox?.info?.id]); useEffect(() => { diff --git a/packages/lb-components/src/components/pointCloudView/PointCloudListener.tsx b/packages/lb-components/src/components/pointCloudView/PointCloudListener.tsx index facacdab..7ab0e4a9 100644 --- a/packages/lb-components/src/components/pointCloudView/PointCloudListener.tsx +++ b/packages/lb-components/src/components/pointCloudView/PointCloudListener.tsx @@ -322,6 +322,8 @@ const PointCloudListener: React.FC = ({ updateSelectedBox(selectBox); if (ptCtx.mainViewInstance && ptCtx.selectedPointCloudBox) { ptCtx.mainViewInstance.generateBox(ptCtx.selectedPointCloudBox); + ptCtx.mainViewInstance.setHighlightColor(selectBox.id); + ptCtx.mainViewInstance.render(); } } }; diff --git a/packages/lb-components/src/components/pointCloudView/hooks/usePointCloudViews.ts b/packages/lb-components/src/components/pointCloudView/hooks/usePointCloudViews.ts index 2b366dd4..870e830f 100644 --- a/packages/lb-components/src/components/pointCloudView/hooks/usePointCloudViews.ts +++ b/packages/lb-components/src/components/pointCloudView/hooks/usePointCloudViews.ts @@ -581,6 +581,7 @@ export const synchronizeTopView = ( // Control the 3D view data to create box mainViewInstance.generateBox(newBoxParams); + mainViewInstance.setHighlightColor(newBoxParams.id); mainViewInstance.render(); const { pointCloud2dOperation, pointCloudInstance } = topViewInstance; diff --git a/packages/lb-components/src/components/pointCloudView/hooks/useUpdatePointCloudColor.ts b/packages/lb-components/src/components/pointCloudView/hooks/useUpdatePointCloudColor.ts index 4f81f2f7..260f187e 100644 --- a/packages/lb-components/src/components/pointCloudView/hooks/useUpdatePointCloudColor.ts +++ b/packages/lb-components/src/components/pointCloudView/hooks/useUpdatePointCloudColor.ts @@ -125,14 +125,19 @@ const useUpdatePointCloudColor = (setResourceLoading: any, config: any) => { * Update the relevant content of the original point cloud again * This method maintains the same judgment logic as the original topViewSlectedChanged, and only triggers an update when one box is selected */ + let newSelectedBox; if (selectedIDs && selectedIDs.length === 1) { - const newSelectedBox = pointCloudBoxList.find((item) => item.id === selectedIDs[0]); + newSelectedBox = pointCloudBoxList.find((item) => item.id === selectedIDs[0]); topViewSelectedChanged({ trigger, newSelectedBox, }); } mainViewInstance.generateBoxes(pointCloudBoxList); + if (newSelectedBox) { + mainViewInstance.setHighlightColor(newSelectedBox.id); + mainViewInstance.render(); + } } /**