使用方法

引入依赖

npm i dicom-ui-tang 或者 yarn add dicom-ui-tang

main.js 注册

import { createApp } from 'vue' import App from './App.vue'

import dicomUi from 'dicom-ui-tang' import 'dicom-ui-tang/lib/dicom-ui-tang.css'

createApp(App).use(dicomUi).mount('#app')

使用 dicom-ui

<dicom-viewer :imageIds="imageIds"></dicom-viewer> imageIds 传入带 wadouri 协议头的 imageId 集合，数据类型如下： [ 'wadouri:https://xxx1.dcm', 'wadouri:https://xxx2.dcm', 'wadouri:https://xxx3.dcm', 'wadouri:https://xxx4.dcm' ]

结节待更新

points数组 1左右 2上下 3层 LPS坐标

1、加一个结节清屏功能。 2、锁定的结节颜色调整为红色。 3、自动跳转指定的结节位置。 4、右边结节列表过长，会撑开布局。上方可以加一个border-top 5、添加鼠标滑动显示worldPoint坐标。 -> 最好不要加 6、是否选中和锁定可以去掉，通过图标颜色去判定。 7、右边结节显示布局可以添加结节统计、多选、排序等功能

数据结构 const FrameOfReferenceUID = viewport.getFrameOfReferenceUID(); const annotation = { highlighted: true, invalidated: true, metadata: { viewPlaneNormal: <Types.Point3>[...viewPlaneNormal], enabledElement, viewUp: <Types.Point3>[...viewUp], FrameOfReferenceUID, referencedImageId, toolName: this.getToolName(), volumeId, }, data: { label: '', handles: { // No need a textBox textBox: { hasMoved: false, worldPosition: null, worldBoundingBox: null, }, points: [ <Types.Point3>[...worldPos], <Types.Point3>[...worldPos], <Types.Point3>[...worldPos], <Types.Point3>[...worldPos], ], activeHandleIndex: null, }, segmentationId: null, }, };