Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(seg): Refactor LabelmapBaseTool and SphereScissorsTool to fix sphere bug in stack #1772

Merged
merged 7 commits into from
Jan 22, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
104 changes: 10 additions & 94 deletions common/reviews/api/tools.api.md
Original file line number Diff line number Diff line change
Expand Up @@ -3448,28 +3448,7 @@ export class LabelmapBaseTool extends BaseTool {
acceptReject: boolean;
}): unknown;
// (undocumented)
createEditData(element: any): {
volumeId: string;
referencedVolumeId: any;
segmentsLocked: number[] | [];
imageId?: undefined;
override?: undefined;
} | {
imageId: string;
segmentsLocked: number[] | [];
override: {
voxelManager: Types_2.IVoxelManager<number> | Types_2.IVoxelManager<Types_2.RGB>;
imageData: vtkImageData;
};
volumeId?: undefined;
referencedVolumeId?: undefined;
} | {
imageId: string;
segmentsLocked: number[] | [];
volumeId?: undefined;
referencedVolumeId?: undefined;
override?: undefined;
};
protected createEditData(element: any): EditDataReturnType;
// (undocumented)
protected createHoverData(element: any, centerCanvas?: any): {
brushCursor: {
Expand Down Expand Up @@ -3511,78 +3490,15 @@ export class LabelmapBaseTool extends BaseTool {
segmentColor: Types_2.Color;
};
// (undocumented)
protected getOperationData(element?: any): {
points: any;
segmentIndex: number;
previewColors: any;
viewPlaneNormal: any;
toolGroupId: string;
segmentationId: string;
viewUp: any;
strategySpecificConfiguration: any;
preview: unknown;
createMemo: (segmentId: string, segmentationVoxelManager: any, preview: any) => LabelmapMemo.LabelmapMemo;
override: {
voxelManager: Types_2.IVoxelManager<number>;
imageData: vtkImageData;
};
segmentsLocked: number[];
imageId?: string;
imageIds?: string[];
volumeId?: string;
referencedVolumeId?: string;
} | {
points: any;
segmentIndex: number;
previewColors: any;
viewPlaneNormal: any;
toolGroupId: string;
segmentationId: string;
viewUp: any;
strategySpecificConfiguration: any;
preview: unknown;
createMemo: (segmentId: string, segmentationVoxelManager: any, preview: any) => LabelmapMemo.LabelmapMemo;
volumeId: string;
referencedVolumeId: any;
segmentsLocked: number[] | [];
imageId?: undefined;
override?: undefined;
} | {
points: any;
segmentIndex: number;
previewColors: any;
viewPlaneNormal: any;
toolGroupId: string;
segmentationId: string;
viewUp: any;
strategySpecificConfiguration: any;
preview: unknown;
createMemo: (segmentId: string, segmentationVoxelManager: any, preview: any) => LabelmapMemo.LabelmapMemo;
imageId: string;
segmentsLocked: number[] | [];
override: {
voxelManager: Types_2.IVoxelManager<number> | Types_2.IVoxelManager<Types_2.RGB>;
imageData: vtkImageData;
};
volumeId?: undefined;
referencedVolumeId?: undefined;
} | {
points: any;
segmentIndex: number;
previewColors: any;
viewPlaneNormal: any;
toolGroupId: string;
segmentationId: string;
viewUp: any;
strategySpecificConfiguration: any;
preview: unknown;
createMemo: (segmentId: string, segmentationVoxelManager: any, preview: any) => LabelmapMemo.LabelmapMemo;
imageId: string;
segmentsLocked: number[] | [];
volumeId?: undefined;
referencedVolumeId?: undefined;
override?: undefined;
};
protected getEditData({ viewport, representationData, segmentsLocked, segmentationId, volumeOperation, }: {
viewport: any;
representationData: any;
segmentsLocked: any;
segmentationId: any;
volumeOperation?: boolean;
}): EditDataReturnType;
// (undocumented)
protected getOperationData(element?: any): ModifiedLabelmapToolOperationData;
// (undocumented)
protected _hoverData?: {
brushCursor: any;
Expand Down
52 changes: 52 additions & 0 deletions packages/adapters/examples/segmentationVolume/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ import {
restart,
createSegmentation
} from "../segmentationVolume/utils";
import addDropDownToToolbar from "../../../../utils/demo/helpers/addDropdownToToolbar";

setTitleAndDescription(
"DICOM SEG VOLUME",
Expand Down Expand Up @@ -119,6 +120,7 @@ const state = {
segmentationId: "LOAD_SEG_ID:" + cornerstone.utilities.uuidv4(),
referenceImageIds: [],
skipOverlapping: false,
segmentationIds: [],
segImageIds: [],
devConfig: { ...dicomMap.values().next().value }
};
Expand Down Expand Up @@ -169,6 +171,7 @@ function createSegmentationRepresentation() {

csToolsSegmentation.addLabelmapRepresentationToViewportMap(segMap);
}

// ============================= //
addButtonToToolbar({
id: "LOAD_DICOM",
Expand Down Expand Up @@ -203,6 +206,7 @@ addButtonToToolbar({

await loadSegmentation(arrayBuffer, state);
createSegmentationRepresentation();
updateSegmentationDropdown();
},
container: group1
});
Expand All @@ -221,8 +225,11 @@ addButtonToToolbar({
id: "CREATE_SEGMENTATION",
title: "Create Empty SEG",
onClick: async () => {
const segmentationId = cornerstone.utilities.uuidv4();
state.segmentationId = segmentationId;
await createSegmentation(state);
createSegmentationRepresentation();
updateSegmentationDropdown();
},
container: group2
});
Expand All @@ -240,10 +247,55 @@ addUploadToToolbar({
}

createSegmentationRepresentation();
updateSegmentationDropdown();
},
container: group2
});

function updateSegmentationDropdown() {
// remove the previous dropdown
const previousDropdown = document.getElementById("segmentation-dropdown");
if (previousDropdown) {
previousDropdown.remove();
}

state.segmentationIds = csToolsSegmentation.state
.getSegmentations()
.map(seg => seg.segmentationId);

state.segmentationId =
csToolsSegmentation.activeSegmentation.getActiveSegmentation(
state.viewportIds[0]
).segmentationId;

// Create a map with objects that can have properties set on them
const optionsMap = new Map(
state.segmentationIds.map(id => [
id,
{ id, label: id, selected: id === state.segmentationId }
])
);

addDropDownToToolbar({
container: group2,
id: "segmentation-dropdown",
options: {
defaultIndex: state.segmentationIds.indexOf(state.segmentationId),
map: optionsMap
},
onSelectedValueChange: (key: string | number) => {
state.viewportIds.forEach(viewportId => {
csToolsSegmentation.activeSegmentation.setActiveSegmentation(
viewportId,
key.toString()
);
});

updateSegmentationDropdown();
}
});
}

addButtonToToolbar({
id: "EXPORT_SEGMENTATION",
title: "Export SEG",
Expand Down
34 changes: 18 additions & 16 deletions packages/core/src/RenderingEngine/StackViewport.ts
Original file line number Diff line number Diff line change
Expand Up @@ -856,26 +856,28 @@ class StackViewport extends Viewport {

this.setInterpolationType(InterpolationType.LINEAR);

const transferFunction = this.getTransferFunction();
setTransferFunctionNodes(
transferFunction,
this.initialTransferFunctionNodes
);
if (!this.useCPURendering) {
const transferFunction = this.getTransferFunction();
setTransferFunctionNodes(
transferFunction,
this.initialTransferFunctionNodes
);

const nodes = getTransferFunctionNodes(transferFunction);
const nodes = getTransferFunctionNodes(transferFunction);

const RGBPoints = nodes.reduce((acc, node) => {
acc.push(node[0], node[1], node[2], node[3]);
return acc;
}, []);
const RGBPoints = nodes.reduce((acc, node) => {
acc.push(node[0], node[1], node[2], node[3]);
return acc;
}, []);

const defaultActor = this.getDefaultActor();
const matchedColormap = colormapUtils.findMatchingColormap(
RGBPoints,
defaultActor.actor
);
const defaultActor = this.getDefaultActor();
const matchedColormap = colormapUtils.findMatchingColormap(
RGBPoints,
defaultActor.actor
);

this.setColormap(matchedColormap);
this.setColormap(matchedColormap);
}
}

public resetToDefaultProperties(): void {
Expand Down
71 changes: 53 additions & 18 deletions packages/docs/docs/getting-started/vue-angular-react-etc.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ id: vue-angular-react-etc
title: 'React, Vue, Angular, etc.'
---


Here are some examples of how to use cornerstone3D with React, Vue, Angular, etc.
We have made it easy to use cornerstone3D with your favorite framework.

Expand All @@ -15,26 +14,65 @@ Follow the links below to see how to use cornerstone3D with your favorite framew
- [Community maintained project](https://github.com/yanqzsu/ng-cornerstone)
- [Cornerstone3D with Next.js](https://github.com/cornerstonejs/nextjs-cornerstone3d)


## Vite

To update your Vite configuration, use the CommonJS plugin, exclude `dicom-image-loader` from optimization, and include `dicom-parser`. We plan to convert `dicom-image-loader` to an ES module, eliminating the need for exclusion in the future.

```javascript
import { viteCommonjs } from "@originjs/vite-plugin-commonjs"

import { viteCommonjs } from '@originjs/vite-plugin-commonjs';

export default defineConfig({
plugins: [viteCommonjs()],
optimizeDeps: {
exclude: ["@cornerstonejs/dicom-image-loader"],
include: ["dicom-parser"],
exclude: ['@cornerstonejs/dicom-image-loader'],
include: ['dicom-parser'],
},
})
});
```

## Troubleshooting

### 1. @icr/polyseg-wasm Build Issues

If you're using 3D segmentation features and encounter issues with `@icr/polyseg-wasm`, add the following to your Vite configuration:

```javascript
build: {
rollupOptions: {
external: ["@icr/polyseg-wasm"],
}
},
```

### 2. Path Resolution Issues with @cornerstonejs/core

## Webpack
If you encounter the error "No known conditions for "./types" specifier in "@cornerstonejs/core" package" during build (while development works fine), add the following alias to your Vite configuration:

```javascript
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
'@root': fileURLToPath(new URL('./', import.meta.url)),
"@cornerstonejs/core": fileURLToPath(new URL('node_modules/@cornerstonejs/core/dist/esm', import.meta.url)),
},
},
```

### 3. Tool Name Minification Issues

If you experience issues with tool names being minified (e.g., LengthTool being registered as "FE"), you can prevent minification by adding:

```javascript
build: {
minify: false,
}
```

:::note
These solutions have been tested primarily on macOS but may also apply to other operating systems. If you're using Vuetify or other Vue frameworks, these configurations might need to be adjusted based on your specific setup.
:::

### 4. Webpack

For webpack, simply install the cornerstone3D library and import it into your project.

Expand All @@ -60,18 +98,15 @@ Similar to the configuration above, use the CommonJS plugin converting commonjs
```javascript
import { defineConfig } from 'vite';
import { svelte } from '@sveltejs/vite-plugin-svelte';
import { viteCommonjs } from "@originjs/vite-plugin-commonjs"
import { viteCommonjs } from '@originjs/vite-plugin-commonjs';

export default defineConfig({
plugins: [
svelte(),
viteCommonjs(),
],
optimizeDeps: {
exclude: ["@cornerstonejs/dicom-image-loader"],
include: ["dicom-parser"],
}
})
plugins: [svelte(), viteCommonjs()],
optimizeDeps: {
exclude: ['@cornerstonejs/dicom-image-loader'],
include: ['dicom-parser'],
},
});
```

:::note Tip
Expand Down
3 changes: 0 additions & 3 deletions packages/tools/examples/PolySegWasmSurfaceToContour/index.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
import type { Types } from '@cornerstonejs/core';
import {
RenderingEngine,
Enums,
setVolumesForViewports,
volumeLoader,
CONSTANTS,
geometryLoader,
eventTarget,
} from '@cornerstonejs/core';
import {
Expand All @@ -14,7 +12,6 @@ import {
setTitleAndDescription,
setCtTransferFunctionForVolumeActor,
addButtonToToolbar,
downloadSurfacesData,
addManipulationBindings,
addLabelToToolbar,
} from '../../../../utils/demo/helpers';
Expand Down
Loading
Loading