Issue with Cornerstone3D StackContextPrefect Local

Hi everyone,

When I use the following code to call the createImageIdsAndCacheMetaData function, everything works fine and stackContextPrefetch functions correctly:

const imageIds = await createImageIdsAndCacheMetaData({
  StudyInstanceUID: '1.3.6.1.4.1.14519.5.2.1.7009.2403.334240657131972136850343327463',
  SeriesInstanceUID: '1.3.6.1.4.1.14519.5.2.1.7009.2403.226151125820845824875394858561',
  wadoRsRoot: 'https://d3t6nz73ql33tx.cloudfront.net/dicomweb',
});

However, when I use the following createImageIds function to load DICOM files from selected files, I’m encountering issues. Here is my code:


import * as cornerstone from "@cornerstonejs/core";
import * as cornerstoneDicomImageLoader from "@cornerstonejs/dicom-image-loader";
import { initDemo } from "/utils/demo/helpers";

export const createImageIds = async (files) => {
  initDemo();

  // Parallel file uploads using Promise.all
  const filePromises = Array.from(files).map(async (file) => {
    const imageId = cornerstoneDicomImageLoader.wadouri.fileManager.add(file);
    await cornerstone.imageLoader.loadAndCacheImage(imageId, {
      preScale: { enabled: true },
    });
    return imageId;
  });

  const imageIds = await Promise.all(filePromises);
  return imageIds;
};

Has anyone encountered a similar issue or can provide insights into what might be going wrong?

I don’t have any issues with imaging; my only problem is that I have to wait for a certain period of time until the entire process is completed when I load from local

I solved the issue by updating the createImageIds function as follows:

export const createImageIds = async (files) => {
    initDemo();
    // Parallel file uploads using Promise.all
    const filePromises = Array.from(files).map(async (file) => {
        const imageId = cornerstoneDicomImageLoader.wadouri.fileManager.add(file);
        return imageId;
    });

    const imageIds = await Promise.all(filePromises);
    return imageIds;
};
    const viewport = renderingEngine.getViewport(viewportIds[0]);

    // const stack = convertMultiframeImageIds(imageIds);
    await viewport.setStack(imageIds, 0);
    csToolsUtilities.stackContextPrefetch.enable(viewport.element);

This way it works as I want using stackContextPrefetch. If there is anything else I should be aware of, please let me know.

Thanks for posting your answer