dicom-ui-tang v2.0.10
使用方法
引入依赖
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, }, };