I am trying to set the dimensions of the rectangular widget before actual interaction starts and draw a rectangular widget as per the dimensions set by the user.

This does not let me draw a rectangle as the point1 and point2 is same because the addition didnot happen. Can i get any suggestions or advice on how to achieve that??

Thank you for replying. I have tried using handleROI.setCorners(point1, point2) which does allow me to draw a quadrilateral but does not retain the shape of a rectangle. The first image is when the interactions is complete one edge is not visible and the next image is when i zoom in all the four edges are visible.

My understanding is getPoint1() and getPoint2() are the coordinates of the diagonals. Is that correct? Also is there any function to enforce the angles(all four) of the widget?

My understanding is getPoint1() and getPoint2() are the coordinates of the diagonals. Is that correct?

Correct.

The oddities you see may be due to the fact that the points are not in aligned in the same plane in world coordinates.
You might want to double check the points you pass to the setCorners().

Thanks again for the suggestion. It pointed me in the right direction. I was calculating the (x,y ) value for point2 but overlooked the z value and used 0 instead which was causing that weird behavior. Using the z value same as point1 fixed it.

Hello Again,
I am back with another question. I am setting a rectangle widget to the scene using setCorner() function. My question is if there is a way i can draw the rectangle widget with fixed corners without firing it inside handleROI.onInteractiveEvent().

type or paste code here
const handleROI = widgetManager.addWidget(widgetROI);
handleROI.onIteractionEvent(()=>{
const point1 = handleROI.getPoint1();
// to convert world coordinates into display coordinates
const point1Display = handleROI.computeWorldToDisplay(renderer, point1[0], point1[1], point1[2])
const dx = Math.abs(point1Display[0] + parseInt(roiDimensions.length));
const dy = Math.abs(point1Display[1] + parseInt(roiDimensions.width));
console.log(' handleROI point2', dx, dy, 0);
const point2 = handleROI.computeDisplayToWorld(renderer, dx, dy, 0)
handleROI.setPoints(point1, point2)
}

Right now the cursor needs to be inside the renderwindow for the widget to appear. My goal is to make the widget appear when user add the corners through a text box outside the renderwindow.