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.

Sign up for GitHub

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

Add options to tool hydrate method #1776

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open

Add options to tool hydrate method #1776

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e52ee09
Add options to tool hydrate method
jmhmd Jan 23, 2025
1fa2892
Add option to pass an existing tool instance to the hydrate method, s…
jmhmd Jan 23, 2025
698ef5e
PR review updates
jmhmd Jan 29, 2025
8d5080a
Update api
jmhmd Jan 29, 2025
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
32 changes: 32 additions & 0 deletions common/reviews/api/tools.api.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -231,6 +231,10 @@ export class AngleTool extends AnnotationTool {
// (undocumented)
static hydrate: (viewportId: string, points: Types_2.Point3[], options?: {
annotationUID?: string;
instance?: AngleTool;
referencedImageId?: string;
viewplaneNormal?: Types_2.Point3;
viewUp?: Types_2.Point3;
}) => AngleAnnotation;
// (undocumented)
isDrawing: boolean;
Expand Down Expand Up @@ -645,6 +649,10 @@ export class ArrowAnnotateTool extends AnnotationTool {
// (undocumented)
static hydrate: (viewportId: string, points: Types_2.Point3[], text?: string, options?: {
annotationUID?: string;
instance?: ArrowAnnotateTool;
referencedImageId?: string;
viewplaneNormal?: Types_2.Point3;
viewUp?: Types_2.Point3;
}) => ArrowAnnotation;
// (undocumented)
isDrawing: boolean;
Expand Down Expand Up @@ -1244,6 +1252,10 @@ export class CircleROITool extends AnnotationTool {
// (undocumented)
static hydrate: (viewportId: string, points: Types_2.Point3[], options?: {
annotationUID?: string;
instance?: CircleROITool;
referencedImageId?: string;
viewplaneNormal?: Types_2.Point3;
viewUp?: Types_2.Point3;
}) => CircleROIAnnotation;
// (undocumented)
isDrawing: boolean;
Expand Down Expand Up @@ -2231,6 +2243,10 @@ export class EllipticalROITool extends AnnotationTool {
// (undocumented)
static hydrate: (viewportId: string, points: Types_2.Point3[], options?: {
annotationUID?: string;
instance?: EllipticalROITool;
referencedImageId?: string;
viewplaneNormal?: Types_2.Point3;
viewUp?: Types_2.Point3;
}) => EllipticalROIAnnotation;
// (undocumented)
isDrawing: boolean;
Expand Down Expand Up @@ -3639,6 +3655,10 @@ export class LengthTool extends AnnotationTool {
// (undocumented)
static hydrate: (viewportId: string, points: Types_2.Point3[], options?: {
annotationUID?: string;
instance?: LengthTool;
referencedImageId?: string;
viewplaneNormal?: Types_2.Point3;
viewUp?: Types_2.Point3;
}) => LengthAnnotation;
// (undocumented)
isDrawing: boolean;
Expand Down Expand Up @@ -4406,6 +4426,10 @@ export class ProbeTool extends AnnotationTool {
// (undocumented)
static hydrate: (viewportId: string, points: Types_2.Point3[], options?: {
annotationUID?: string;
instance?: ProbeTool;
referencedImageId?: string;
viewplaneNormal?: Types_2.Point3;
viewUp?: Types_2.Point3;
}) => ProbeAnnotation;
// (undocumented)
isDrawing: boolean;
Expand Down Expand Up @@ -4737,6 +4761,10 @@ export class RectangleROITool extends AnnotationTool {
// (undocumented)
static hydrate: (viewportId: string, points: Types_2.Point3[], options?: {
annotationUID?: string;
instance?: RectangleROITool;
referencedImageId?: string;
viewplaneNormal?: Types_2.Point3;
viewUp?: Types_2.Point3;
}) => RectangleROIAnnotation;
// (undocumented)
isDrawing: boolean;
Expand Down Expand Up @@ -5676,6 +5704,10 @@ export class SplineROITool extends ContourSegmentationBaseTool {
static hydrate: (viewportId: string, points: Types_2.Point3[], options?: {
annotationUID?: string;
splineType?: SplineTypesEnum;
instance?: SplineROITool;
referencedImageId?: string;
viewplaneNormal?: Types_2.Point3;
viewUp?: Types_2.Point3;
}) => SplineROIAnnotation;
// (undocumented)
protected isContourSegmentationTool(): boolean;
Expand Down
26 changes: 21 additions & 5 deletions packages/tools/examples/dynamicallyAddAnnotations/angleToolUI.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,11 @@ function createFormElement(): HTMLFormElement {
<br>
<button style="margin-left: 52px;" type="button" id="${coordType}-stack">Add Stack</button>
<button type="button" id="${coordType}-volume">Add Volume</button>
${
coordType === 'image'
? `<button type="button" id="${coordType}-volume-imageId">Add to specific image in volume (first imageId/inferior-most image in volume)</button> `
: ''
}
<br><br>
`;
});
Expand All @@ -76,30 +81,41 @@ function addButtonListeners(form: HTMLFormElement): void {
const buttons = form.querySelectorAll('button');
buttons.forEach((button) => {
button.addEventListener('click', () => {
const [type, viewportType] = button.id.split('-') as [
const [type, viewportType, useImageId] = button.id.split('-') as [
'canvas' | 'image',
keyof typeof typeToIdMap
keyof typeof typeToIdMap,
'imageId'?
];
const enabledElement = getEnabledElementByViewportId(
typeToIdMap[viewportType]
);
const viewport = enabledElement.viewport;
const imageId = useImageId && viewport.getImageIds()[0];
const coords = getCoordinates(form, type);
const currentImageId = viewport.getCurrentImageId() as string;

const worldPoint1 =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.point1)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.point1
)
: viewport.canvasToWorld(coords.point1);

const worldPoint2 =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.point2)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.point2
)
: viewport.canvasToWorld(coords.point2);

const worldPoint3 =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.point3)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.point3
)
: viewport.canvasToWorld(coords.point3);

AngleTool.hydrate(viewport.id, [worldPoint1, worldPoint2, worldPoint3]);
Expand Down
21 changes: 17 additions & 4 deletions packages/tools/examples/dynamicallyAddAnnotations/arrowAnnotateToolUI.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,11 @@ function createFormElement(): HTMLFormElement {
<br>
<button style="margin-left: 52px;" type="button" id="${coordType}-stack">Add Stack</button>
<button type="button" id="${coordType}-volume">Add Volume</button>
${
coordType === 'image'
? `<button type="button" id="${coordType}-volume-imageId">Add to specific image in volume (first imageId/inferior-most image in volume)</button> `
: ''
}
<br><br>
`;
});
Expand All @@ -64,14 +69,16 @@ function addButtonListeners(form: HTMLFormElement): void {
const buttons = form.querySelectorAll('button');
buttons.forEach((button) => {
button.addEventListener('click', () => {
const [type, viewportType] = button.id.split('-') as [
const [type, viewportType, useImageId] = button.id.split('-') as [
'canvas' | 'image',
keyof typeof typeToIdMap
keyof typeof typeToIdMap,
'imageId'?
];
const enabledElement = getEnabledElementByViewportId(
typeToIdMap[viewportType]
);
const viewport = enabledElement.viewport;
const imageId = useImageId && viewport.getImageIds()[0];
const coords = getCoordinates(form, type);
const textInput = form.querySelector(`#${type}-text`) as HTMLInputElement;
const text = textInput ? textInput.value : '';
Expand All @@ -80,12 +87,18 @@ function addButtonListeners(form: HTMLFormElement): void {

const point1 =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.point1)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.point1
)
: viewport.canvasToWorld(coords.point1);

const point2 =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.point2)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.point2
)
: viewport.canvasToWorld(coords.point2);

ArrowAnnotateTool.hydrate(viewport.id, [point1, point2], text);
Expand Down
25 changes: 20 additions & 5 deletions packages/tools/examples/dynamicallyAddAnnotations/circleROIToolUI.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,11 @@ function createFormElement(): HTMLFormElement {
<br>
<button style="margin-left: 52px;" type="button" id="${coordType}-stack">Add Stack</button>
<button type="button" id="${coordType}-volume">Add Volume</button>
${
coordType === 'image'
? `<button type="button" id="${coordType}-volume-imageId">Add to specific image in volume (first imageId/inferior-most image in volume)</button> `
: ''
}
<br><br>
`;
});
Expand All @@ -62,28 +67,38 @@ function addButtonListeners(form: HTMLFormElement): void {
const buttons = form.querySelectorAll('button');
buttons.forEach((button) => {
button.addEventListener('click', () => {
const [type, viewportType] = button.id.split('-') as [
const [type, viewportType, useImageId] = button.id.split('-') as [
'canvas' | 'image',
keyof typeof typeToIdMap
keyof typeof typeToIdMap,
'imageId'?
];
const enabledElement = getEnabledElementByViewportId(
typeToIdMap[viewportType]
);
const viewport = enabledElement.viewport;
const imageId = useImageId && viewport.getImageIds()[0];
const coords = getCoordinates(form, type);
const currentImageId = viewport.getCurrentImageId() as string;

const worldCenter =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.center)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.center
)
: viewport.canvasToWorld(coords.center);

const worldRadiusPoint =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.radiusPoint)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.radiusPoint
)
: viewport.canvasToWorld(coords.radiusPoint);

CircleROITool.hydrate(viewport.id, [worldCenter, worldRadiusPoint]);
CircleROITool.hydrate(viewport.id, [worldCenter, worldRadiusPoint], {
referencedImageId: imageId,
});
});
});
}
Expand Down
13 changes: 10 additions & 3 deletions packages/tools/examples/dynamicallyAddAnnotations/ellipticalROIToolUI.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,11 @@ function createFormElement(): HTMLFormElement {
<br>
<button style="margin-left: 52px;" type="button" id="${coordType}-stack">Add Stack</button>
<button type="button" id="${coordType}-volume">Add Volume</button>
${
coordType === 'image'
? `<button type="button" id="${coordType}-volume-imageId">Add to specific image in volume (first imageId/inferior-most image in volume)</button> `
: ''
}
<br><br>
`;
});
Expand All @@ -81,20 +86,22 @@ function addButtonListeners(form: HTMLFormElement): void {
const buttons = form.querySelectorAll('button');
buttons.forEach((button) => {
button.addEventListener('click', () => {
const [type, viewportType] = button.id.split('-') as [
const [type, viewportType, useImageId] = button.id.split('-') as [
'canvas' | 'image',
keyof typeof typeToIdMap
keyof typeof typeToIdMap,
'imageId'?
];
const enabledElement = getEnabledElementByViewportId(
typeToIdMap[viewportType]
);
const viewport = enabledElement.viewport;
const imageId = useImageId && viewport.getImageIds()[0];
const coords = getCoordinates(form, type);
const currentImageId = viewport.getCurrentImageId() as string;

const convertPoint = (point: Point2): Point3 =>
type === 'image'
? (utilities.imageToWorldCoords(currentImageId, point) as Point3)
? (utilities.imageToWorldCoords(imageId || currentImageId, point) as Point3)
: viewport.canvasToWorld(point);

const points: Point3[] = [
Expand Down
21 changes: 17 additions & 4 deletions packages/tools/examples/dynamicallyAddAnnotations/lengthToolUI.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,11 @@ function createFormElement(): HTMLFormElement {
<br>
<button style="margin-left: 52px;" type="button" id="${coordType}-stack">Add Stack</button>
<button type="button" id="${coordType}-volume">Add Volume</button>
${
coordType === 'image'
? `<button type="button" id="${coordType}-volume-imageId">Add to specific image in volume (first imageId/inferior-most image in volume)</button> `
: ''
}
<br><br>
`;
});
Expand All @@ -63,25 +68,33 @@ function addButtonListeners(form: HTMLFormElement): void {
const buttons = form.querySelectorAll('button');
buttons.forEach((button) => {
button.addEventListener('click', () => {
const [type, viewportType] = button.id.split('-') as [
const [type, viewportType, useImageId] = button.id.split('-') as [
'canvas' | 'image',
keyof typeof typeToIdMap
keyof typeof typeToIdMap,
'imageId'?
];
const enabledElement = getEnabledElementByViewportId(
typeToIdMap[viewportType]
);
const viewport = enabledElement.viewport;
const imageId = useImageId && viewport.getImageIds()[0];
const coords = getCoordinates(form, type);
const currentImageId = viewport.getCurrentImageId() as string;

const worldStart =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.topLeft)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.topLeft
)
: viewport.canvasToWorld(coords.topLeft);

const worldEnd =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.topRight)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.topRight
)
: viewport.canvasToWorld(coords.topRight);

LengthTool.hydrate(viewport.id, [worldStart, worldEnd]);
Expand Down
16 changes: 13 additions & 3 deletions packages/tools/examples/dynamicallyAddAnnotations/probeToolUI.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,11 @@ function createFormElement(): HTMLFormElement {
<br>
<button style="margin-left: 52px;" type="button" id="${coordType}-stack">Add Stack</button>
<button type="button" id="${coordType}-volume">Add Volume</button>
${
coordType === 'image'
? `<button type="button" id="${coordType}-volume-imageId">Add to specific image in volume (first imageId/inferior-most image in volume)</button> `
: ''
}
<br><br>
`;
});
Expand All @@ -53,20 +58,25 @@ function addButtonListeners(form: HTMLFormElement): void {
const buttons = form.querySelectorAll('button');
buttons.forEach((button) => {
button.addEventListener('click', () => {
const [type, viewportType] = button.id.split('-') as [
const [type, viewportType, useImageId] = button.id.split('-') as [
'canvas' | 'image',
keyof typeof typeToIdMap
keyof typeof typeToIdMap,
'imageId'?
];
const enabledElement = getEnabledElementByViewportId(
typeToIdMap[viewportType]
);
const viewport = enabledElement.viewport;
const imageId = useImageId && viewport.getImageIds()[0];
const coords = getCoordinates(form, type);
const currentImageId = viewport.getCurrentImageId() as string;

const worldStart =
type === 'image'
? utilities.imageToWorldCoords(currentImageId, coords.topLeft)
? utilities.imageToWorldCoords(
imageId || currentImageId,
coords.topLeft
)
: viewport.canvasToWorld(coords.topLeft);

ProbeTool.hydrate(viewport.id, [worldStart]);
Expand Down
Loading
Loading