From c5782a79856b27b29e02ab74d3a1310625a39ca0 Mon Sep 17 00:00:00 2001 From: guhaomine <18380425155@163.com> Date: Thu, 22 Feb 2024 18:57:45 +0800 Subject: [PATCH] fix: preview objects --- .../src/businessNew/pages/execute.ts | 19 +++++++- .../components/useCardObject.ts | 47 ++++++++++--------- .../datasets/datasetSearch/searchScenario.vue | 8 ++-- .../src/views/ontology/scenario/index.vue | 6 +-- frontend/pc-tool/src/pages/execute.ts | 26 ++++++---- 5 files changed, 69 insertions(+), 37 deletions(-) diff --git a/frontend/image-tool/src/businessNew/pages/execute.ts b/frontend/image-tool/src/businessNew/pages/execute.ts index b510d541..1730ea0c 100644 --- a/frontend/image-tool/src/businessNew/pages/execute.ts +++ b/frontend/image-tool/src/businessNew/pages/execute.ts @@ -1,7 +1,7 @@ import { FlowAction, IPageHandler } from '../types'; import { useInjectBSEditor } from '../context'; import pageModes from '../configs/mode'; -import { MsgType } from 'image-editor'; +import { AnnotateObject, MsgType } from 'image-editor'; import useDataFlow from '../hook/useDataflow'; import useCommon from '../hook/useCommon'; @@ -23,6 +23,7 @@ export function execute(): IPageHandler { await loadRecord(); await Promise.all([loadClasses(), loadDateSetClassification(), loadModels()]); await editor.loadManager.loadSceneData(0); + await focusObject(); } catch (error: any) { editor.handleErr(error, 'Load Error'); } @@ -32,7 +33,21 @@ export function execute(): IPageHandler { editor.dataManager.pollDataModelResult(); } } - + async function focusObject() { + let objectId = editor.bsState.query.focus; + if (objectId) { + let findObject: AnnotateObject | undefined; + const frame = editor.state.frames.find((frame) => { + const objects = editor.dataManager.getFrameObject(frame.id); + findObject = objects?.find((o) => o.uuid == objectId); + return !!findObject; + }); + if (frame && findObject) { + await editor.loadFrame(editor.getFrameIndex(frame.id)); + editor.selectByTrackId(findObject.userData.trackId); + } + } + } function onAction(action: FlowAction) { console.log(action); switch (action) { diff --git a/frontend/main/src/views/datasets/datasetContent/components/useCardObject.ts b/frontend/main/src/views/datasets/datasetContent/components/useCardObject.ts index be7c9e6d..4a6677c2 100644 --- a/frontend/main/src/views/datasets/datasetContent/components/useCardObject.ts +++ b/frontend/main/src/views/datasets/datasetContent/components/useCardObject.ts @@ -14,6 +14,7 @@ import { debounce } from 'lodash-es'; export enum OBJECT_TYPE { POLYGON = 'POLYGON', RECTANGLE = 'RECTANGLE', + BOUNDING_BOX = 'BOUNDING_BOX', POLYLINE = 'POLYLINE', RECT = '2D_RECT', BOX2D = '2D_BOX', @@ -32,6 +33,7 @@ const AnnotationTypeMap: Record = { rect: OBJECT_TYPE.RECT, box2d: OBJECT_TYPE.BOX2D, POLYGON: OBJECT_TYPE.POLYGON, + BOUNDING_BOX: OBJECT_TYPE.RECTANGLE, RECTANGLE: OBJECT_TYPE.RECTANGLE, POLYLINE: OBJECT_TYPE.POLYLINE, }; @@ -215,26 +217,16 @@ export default function useCardObject() { return renderImage?.url && renderImage?.extraInfo; }; const onImgLoad = (data: any) => { - const info = data.content && data.content[0]?.file?.extraInfo; - if (!svg.value) return; + const info = data.content && (data.content ?? [])[0]?.files[0].file?.extraInfo; + if (!svg.value || !info) return; const imgDom = svg.value as HTMLImageElement; const { clientWidth, clientHeight } = imgDom as HTMLImageElement; const naturalWidth = info?.width || imgDom.naturalWidth; const naturalHeight = info?.height || imgDom.naturalHeight; - // const aspect = naturalWidth / naturalHeight; - // const fitAspect = clientWidth / clientHeight; - size.value.width = naturalWidth; size.value.height = naturalHeight; size.value.svgWidth = clientWidth; size.value.svgHeight = clientHeight; - // if (aspect > fitAspect) { - // size.value.svgWidth = clientHeight * aspect; - // size.value.svgHeight = clientHeight; - // } else { - // size.value.svgWidth = clientWidth; - // size.value.svgHeight = clientWidth / aspect; - // } size.value.init = true; }; const updatePcResult = (target: any[], { objects, selectedSourceIds }: any, info: any) => { @@ -390,9 +382,13 @@ export default function useCardObject() { const { contour, id, type, meta = {} } = item; const { points = [], interior = [] } = contour || item || {}; let _points: any = []; - if (type === OBJECT_TYPE.RECTANGLE) { - if (points && points.length === 2) { - const newPoints = points.map((p) => { + if ([OBJECT_TYPE.BOUNDING_BOX, OBJECT_TYPE.RECTANGLE].includes(type)) { + let rectData = points; + if (rectData && rectData.length === 4) { + rectData = [rectData[0], rectData[2]]; + } + if (rectData && rectData.length === 2) { + const newPoints = rectData.map((p) => { return convert(p); }); const rect = [ @@ -418,7 +414,6 @@ export default function useCardObject() { uuid: id, }; }); - return result; }; @@ -493,6 +488,7 @@ export function useImgCard(props: { */ const updateImageObject = () => { let results: any[] = []; + console.log(props.object); onImgLoad(props.data); if ( props.showAnnotation !== false && @@ -564,7 +560,6 @@ export function useImgCard(props: { }; const getPlaceImg = () => { const placeImgType = props.info?.type === datasetTypeEnum.LIDAR_BASIC ? placeImgFull : placeImg; - console.log(props.data); const pc = props.data.content ? props.data.content.filter((item) => regLidar.test(item.name))[0] : { files: null }; @@ -670,6 +665,7 @@ export function useSearchCard(props: { }; const updatePcObject = () => { const results: { id: string; points: string }[] = []; + console.log(props); if ( props.info?.type === datasetTypeEnum.LIDAR_FUSION || props.info?.type === datasetTypeEnum.LIDAR_BASIC @@ -680,6 +676,7 @@ export function useSearchCard(props: { const size = getSize(svg.value); state.imgTransform = ''; + console.log(object); if (info && object) { const contour = object.contour || object; const { center3D, rotation3D, size3D } = contour; @@ -718,7 +715,8 @@ export function useSearchCard(props: { const img = imgs?.length ? imgs[state.imgIndex] : null; file = img?.files && img?.files[0]?.file; } else if (props.info?.type === datasetTypeEnum.IMAGE) { - file = props.data?.content && props.data?.content[0]?.file; + const content = props.data.content as any; + file = content && content[0]?.files[0]?.file; } if (file) { const extraInfo = file?.extraInfo; @@ -964,12 +962,14 @@ export function useSearchCard(props: { offsetX = Math.max(-__x, Math.min(__x, offsetX)); offsetY = Math.max(-__y, Math.min(__y, offsetY)); } + return { offsetX, offsetY, scale: scale, }; }; + const { contour = {}, id, type, meta = {} } = object; const { points = [], interior = [] } = contour; let _points: any = []; @@ -986,9 +986,13 @@ export function useSearchCard(props: { .join(' '); }; - if (type === OBJECT_TYPE.RECTANGLE) { - if (points && points.length === 2) { - const newPoints = points.map((point) => { + if ([OBJECT_TYPE.RECTANGLE, OBJECT_TYPE.BOUNDING_BOX].includes(type)) { + let rectData = points; + if (rectData && rectData.length === 4) { + rectData = [rectData[0], rectData[2]]; + } + if (rectData && rectData.length === 2) { + const newPoints = rectData.map((point) => { const _x = imgToView_X(cX - (cX - point.x - offsetX) * scale); const _y = imgToView_Y(cY - (cY - point.y - offsetY) * scale); return [_x, _y]; @@ -1010,6 +1014,7 @@ export function useSearchCard(props: { const coord = el.coordinate; return getPoints(coord); }); + console.log('[updateCssTransform]--------', naturalHeight, object, offsetX, offsetY, scale); updateCssTransform(imgToView_X(offsetX), imgToView_Y(offsetY), scale); results.push({ points: _points, diff --git a/frontend/main/src/views/datasets/datasetSearch/searchScenario.vue b/frontend/main/src/views/datasets/datasetSearch/searchScenario.vue index 67ce85d2..9c51ca15 100644 --- a/frontend/main/src/views/datasets/datasetSearch/searchScenario.vue +++ b/frontend/main/src/views/datasets/datasetSearch/searchScenario.vue @@ -256,6 +256,7 @@ ? classification.value.map((item) => item.split('^')[1]).toString() : undefined, }); + const _list: any[] = []; const dataIds = Array.from(new Set(res.list?.map((item) => item.dataId))) .filter((item: any) => !dataInfo.value[item]) @@ -296,6 +297,7 @@ _list.push(e); }); }); + console.log(_list); if (flag) { list.value = list.value.concat(_list) || []; } else { @@ -329,9 +331,9 @@ } return null; }); - const trackId = object.trackId || object.classAttributes.trackId; - if (!recordId || !trackId) return; - goToTool({ recordId: recordId, dataId: object.dataId, focus: trackId }, info.value?.type); + const objectId = object.id || object.classAttributes.id; + if (!recordId || !objectId) return; + goToTool({ recordId: recordId, dataId: object.dataId, focus: objectId }, info.value?.type); }; const handleExport = () => { diff --git a/frontend/main/src/views/ontology/scenario/index.vue b/frontend/main/src/views/ontology/scenario/index.vue index 782255f0..44023f79 100644 --- a/frontend/main/src/views/ontology/scenario/index.vue +++ b/frontend/main/src/views/ontology/scenario/index.vue @@ -280,9 +280,9 @@ } return null; }); - const trackId = object.trackId || object.classAttributes.trackId; - if (!recordId || !trackId) return; - goToTool({ recordId: recordId, dataId: object.dataId, focus: trackId }, info.value?.type); + const objectId = object.id || object.classAttributes.id; + if (!recordId || !objectId) return; + goToTool({ recordId: recordId, dataId: object.dataId, focus: objectId }, info.value?.type); }; const handleExport = () => { diff --git a/frontend/pc-tool/src/pages/execute.ts b/frontend/pc-tool/src/pages/execute.ts index 89ff7b37..f8e4eb7d 100644 --- a/frontend/pc-tool/src/pages/execute.ts +++ b/frontend/pc-tool/src/pages/execute.ts @@ -49,7 +49,7 @@ export function execute(): IPageHandler { } // load first data await editor.loadFrame(0, false); - focusObject(); + await focusObject(); } catch (error: any) { editor.handleErr(error, editor.lang('load-error')); } @@ -60,13 +60,23 @@ export function execute(): IPageHandler { } } - function focusObject() { - let trackId = editor.bsState.query.focus; - if (trackId) { - editor.selectByTrackId(trackId); - let selection = editor.pc.selection; - let object3D = selection.find((item) => item instanceof Box) as Box; - object3D && editor.focusObject(object3D); + async function focusObject() { + let objectId = editor.bsState.query.focus; + if (objectId) { + let findObject:any; + const frame = editor.state.frames.find(frame=>{ + const objects = editor.dataManager.getFrameObject(frame.id); + findObject = objects?.find(o=>o.uuid==objectId); + return !!findObject; + }) + if(frame&&findObject){ + await editor.loadFrame(editor.getFrameIndex(frame.id)) + editor.selectByTrackId(findObject.userData.trackId); + let selection = editor.pc.selection; + let object3D = selection.find((item) => item instanceof Box) as Box; + object3D && editor.focusObject(object3D); + } + } }