ivmartel / dwv

DICOM Web Viewer: open source zero footprint medical image library.
https://ivmartel.github.io/dwv/
GNU General Public License v3.0
1.66k stars 593 forks source link

Unable to use the Draw tool #1731

Closed naccib closed 6 days ago

naccib commented 2 months ago

Environment

I am using React 18 with TypeScript. DWV is instantiated like so:

// One time setup
    useEffect(() => {
        if(app) {
            return;
        }

        if(seriesCollection.length === 0) {
            console.log('No series found');
            return;
        }

        console.log('Setting up viewer...');

        const newApp = new App();
        const viewConfig = new ViewConfig(ROOT_ID);

        const opts = new AppOptions({'*': [viewConfig] });

        opts.tools = {
            Scroll: new ToolConfig(),
            ZoomAndPan: new ToolConfig(),
            Draw: new ToolConfig(['Rectangle', 'Ruler', 'Ellipse', 'Arrow', 'Circle'])  
        };

        newApp.init(opts);

        const series = seriesCollection[0];

        newApp.loadFiles(series.files);

        newApp.addEventListener('load', () => {
            console.log('Finished loading DICOM files.');

            setImagesLoadingComplete(true);

            newApp.setTool('Scroll');
        });

        setApp(newApp);
    }, [app, seriesCollection]);

Bug description

DWV errors on click with the Draw tool selected (using any shape). First, it errors with:

this[#Ki][this[#Vr]] is not a constructor
TypeError: this[#Ki][this[#Vr]] is not a constructor
    at #Kr (draw.js:275:1)
    at #_r (draw.js:258:1)
    at #jr (draw.js:236:1)
    at mousedown (draw.js:382:1)
    at Array.n (toolboxController.js:241:1)
    at He.fireEvent (listen.js:70:1)
    at #Re (drawLayer.js:659:1)

Then, after each second or so, it errors with:

Cannot read properties of null (reading 'getX')
TypeError: Cannot read properties of null (reading 'getX')
    at #$r (draw.js:325:1)
    at mousemove (draw.js:397:1)
    at Array.n (toolboxController.js:241:1)
    at He.fireEvent (listen.js:70:1)
    at #Re (drawLayer.js:659:1)
ivmartel commented 2 months ago

How do you activate the draw tool? Check https://github.com/ivmartel/dwv-react for a react integration example.

ivmartel commented 6 days ago

I hope the link helped and that you could solve your issue. Closing for now, feel free to comment if you need.