diff --git a/docs/source/conf.py b/docs/source/conf.py index 5a71b78..60e2ef5 100644 --- a/docs/source/conf.py +++ b/docs/source/conf.py @@ -22,7 +22,7 @@ author = 'LinkunGao' # The full version, including alpha/beta/rc tags -release = 'v1.11.1' +release = 'v1.11.2' # -- General configuration --------------------------------------------------- diff --git a/docs/source/release/release.md b/docs/source/release/release.md index 882da06..761fca3 100644 --- a/docs/source/release/release.md +++ b/docs/source/release/release.md @@ -567,3 +567,8 @@ width=800> ``` - result ![](../_static/images/release_1_11_1.jpg) + +## Release v1.11.2 + +- design drag function for contrast area +- design change contrast value function diff --git a/package-lock.json b/package-lock.json index a95bd41..fe8488b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "copper3d_visualisation", - "version": "1.11.1", + "version": "1.11.2", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "copper3d_visualisation", - "version": "1.11.1", + "version": "1.11.2", "license": "Apache-2.0", "dependencies": { "@types/dat.gui": "^0.7.7", diff --git a/package.json b/package.json index 53cf008..d2b523c 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "copper3d_visualisation", "description": "A 3d visualisation package base on threejs provides multiple scenes and Nrrd image load funtion.", - "version": "1.11.1", + "version": "1.11.2", "main": "dist/bundle.umd.js", "moudle": "dist/bundle.esm.js", "types": "dist/types/index.d.ts", diff --git a/src/Utils/nrrd_tool.ts b/src/Utils/nrrd_tool.ts index 179b04b..5c7e022 100644 --- a/src/Utils/nrrd_tool.ts +++ b/src/Utils/nrrd_tool.ts @@ -67,6 +67,7 @@ export class nrrd_tools { private previousDrawingImage: HTMLImageElement = new Image(); private paintedImage: paintImageType | undefined; private readyToUpdate: boolean = true; + private addContrastArea: boolean = false; /** * undo */ @@ -176,8 +177,9 @@ export class nrrd_tools { this.container.appendChild(this.contrast2Area); this.container.appendChild(this.contrast3Area); this.container.appendChild(this.contrast4Area); + this.addContrastArea = true; } - private initDiplayContrastCavas( + private initDiplayContrastCanvas( contrastCanvas: HTMLCanvasElement, contrastCtx: CanvasRenderingContext2D, contrastOrigin: HTMLCanvasElement @@ -197,7 +199,7 @@ export class nrrd_tools { const p = document.createElement("p"); p.innerText = text; p.style.position = "absolute"; - p.style.bottom = "10px"; + p.style.bottom = "5px"; return p; } setContrastSize(width: number, height: number) { @@ -207,7 +209,7 @@ export class nrrd_tools { setContrast1OriginCanvas(slice: any) { this.contrast1Slice = slice; this.contrast1OriginCanvas = this.contrast1Slice.canvas; - this.initDiplayContrastCavas( + this.initDiplayContrastCanvas( this.displayContrast1Canvas, this.displayContrast1Ctx, this.contrast1OriginCanvas @@ -217,7 +219,7 @@ export class nrrd_tools { setContrast2OriginCanvas(slice: any) { this.contrast2Slice = slice; this.contrast2OriginCanvas = this.contrast2Slice.canvas; - this.initDiplayContrastCavas( + this.initDiplayContrastCanvas( this.displayContrast2Canvas, this.displayContrast2Ctx, this.contrast2OriginCanvas @@ -227,7 +229,7 @@ export class nrrd_tools { setContrast3OriginCanvas(slice: any) { this.contrast3Slice = slice; this.contrast3OriginCanvas = this.contrast3Slice.canvas; - this.initDiplayContrastCavas( + this.initDiplayContrastCanvas( this.displayContrast3Canvas, this.displayContrast3Ctx, this.contrast3OriginCanvas @@ -237,7 +239,7 @@ export class nrrd_tools { setContrast4OriginCanvas(slice: any) { this.contrast4Slice = slice; this.contrast4OriginCanvas = this.contrast4Slice.canvas; - this.initDiplayContrastCavas( + this.initDiplayContrastCanvas( this.displayContrast4Canvas, this.displayContrast4Ctx, this.contrast4OriginCanvas @@ -251,29 +253,75 @@ export class nrrd_tools { this.displayContrast2Canvas.width = this.displayContrast2Canvas.width; this.displayContrast3Canvas.width = this.displayContrast3Canvas.width; this.displayContrast4Canvas.width = this.displayContrast4Canvas.width; + + if (this.Is_Shift_Pressed) { + this.contrast1Slice.index = this.slice.index; + this.contrast2Slice.index = this.slice.index; + this.contrast3Slice.index = this.slice.index; + this.contrast4Slice.index = this.slice.index; + this.contrast1Slice.repaint.call(this.contrast1Slice); + this.contrast2Slice.repaint.call(this.contrast2Slice); + this.contrast3Slice.repaint.call(this.contrast3Slice); + this.contrast4Slice.repaint.call(this.contrast4Slice); + } + // resize and redraw - this.initDiplayContrastCavas( + this.initDiplayContrastCanvas( this.displayContrast1Canvas, this.displayContrast1Ctx, this.contrast1OriginCanvas ); - this.initDiplayContrastCavas( + this.initDiplayContrastCanvas( this.displayContrast2Canvas, this.displayContrast2Ctx, this.contrast2OriginCanvas ); - this.initDiplayContrastCavas( + this.initDiplayContrastCanvas( this.displayContrast3Canvas, this.displayContrast3Ctx, this.contrast3OriginCanvas ); - this.initDiplayContrastCavas( + this.initDiplayContrastCanvas( this.displayContrast4Canvas, this.displayContrast4Ctx, this.contrast4OriginCanvas ); } + private updateContrastAreaValue(value: number, flag: string) { + switch (flag) { + case "lowerThreshold": + this.contrast1Slice.volume.lowerThreshold = value; + this.contrast2Slice.volume.lowerThreshold = value; + this.contrast3Slice.volume.lowerThreshold = value; + this.contrast4Slice.volume.lowerThreshold = value; + break; + case "upperThreshold": + this.contrast1Slice.volume.upperThreshold = value; + this.contrast2Slice.volume.upperThreshold = value; + this.contrast3Slice.volume.upperThreshold = value; + this.contrast4Slice.volume.upperThreshold = value; + break; + case "windowLow": + this.contrast1Slice.volume.windowLow = value; + this.contrast2Slice.volume.windowLow = value; + this.contrast3Slice.volume.windowLow = value; + this.contrast4Slice.volume.windowLow = value; + break; + case "windowHigh": + this.contrast1Slice.volume.windowHigh = value; + this.contrast2Slice.volume.windowHigh = value; + this.contrast3Slice.volume.windowHigh = value; + this.contrast4Slice.volume.windowHigh = value; + break; + } + + this.contrast1Slice.volume.repaintAllSlices(); + this.contrast2Slice.volume.repaintAllSlices(); + this.contrast3Slice.volume.repaintAllSlices(); + this.contrast4Slice.volume.repaintAllSlices(); + } + dragImageWithMode(controls: TrackballControls, opts?: nrrdDragImageOptType) { let oldIndex: number = this.slice.index; let move: number; @@ -400,6 +448,8 @@ export class nrrd_tools { * clear and redraw canvas */ this.slice.repaint.call(this.slice); + + this.addContrastArea && this.updateContrastArea(); this.drawingCanvasLayer1.width = this.drawingCanvasLayer1.width; this.displayCanvas.width = this.displayCanvas.width; @@ -744,6 +794,7 @@ export class nrrd_tools { this.originCanvas.width = this.originCanvas.width; this.slice.repaint.call(this.slice); this.redrawDisplayCanvas(); + this.updateContrastArea(); } requestAnimationFrame(updateCanvas); @@ -921,8 +972,10 @@ export class nrrd_tools { 1 ) .name("Lower Threshold") - .onChange(() => { + .onChange((value) => { this.readyToUpdate = false; + this.addContrastArea && + this.updateContrastAreaValue(value, "lowerThreshold"); }) .onFinishChange(() => { this.slice.volume.repaintAllSlices(); @@ -937,8 +990,10 @@ export class nrrd_tools { 1 ) .name("Upper Threshold") - .onChange(() => { + .onChange((value) => { this.readyToUpdate = false; + this.addContrastArea && + this.updateContrastAreaValue(value, "upperThreshold"); }) .onFinishChange(() => { this.slice.volume.repaintAllSlices(); @@ -953,8 +1008,10 @@ export class nrrd_tools { 1 ) .name("Window Low") - .onChange(() => { + .onChange((value) => { this.readyToUpdate = false; + this.addContrastArea && + this.updateContrastAreaValue(value, "windowLow"); }) .onFinishChange(() => { this.slice.volume.repaintAllSlices(); @@ -969,8 +1026,10 @@ export class nrrd_tools { 1 ) .name("Window High") - .onChange(() => { + .onChange((value) => { this.readyToUpdate = false; + this.addContrastArea && + this.updateContrastAreaValue(value, "windowHigh"); }) .onFinishChange(() => { this.slice.volume.repaintAllSlices(); diff --git a/src/index.ts b/src/index.ts index c286a05..6d1d019 100644 --- a/src/index.ts +++ b/src/index.ts @@ -34,7 +34,7 @@ import { import "./css/style.css"; console.log( - "%cMedtech Heart Plugin %cBeta:v1.11.1", + "%cMedtech Heart Plugin %cBeta:v1.11.2", "padding: 3px;color:white; background:#023047", "padding: 3px;color:white; background:#f50a25" );