ross/dv3d
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance error handling for graphics rendering and update external image loader registration

Browse Source
This commit is contained in:
Ross
2026-03-16 11:09:04 +00:00
parent 8dc4bb0aaa
commit adff7caffd
2 changed files with 65 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dicom-viewer/package.json
+1 -1
View File
@@ -5,7 +5,7 @@
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "tsc && vite build && cp dist/index.js /home/ross/rad/rad/rad/static/dv3d/index.js", "build": "tsc && vite build && cp dist/index.js /home/ross/penracourses/rad/rad/static/dv3d/index.js",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview" "preview": "vite preview"
}, },
dicom-viewer/src/App.tsx
+64 -42
View File
@@ -442,8 +442,18 @@ function App({ container_id, imageStacks, autoCacheStack, annotationJson, viewer
const onError = (ev: ErrorEvent) => { const onError = (ev: ErrorEvent) => {
try { try {
const msg = ev && ev.message ? String(ev.message) : ''; const msg = ev && ev.message ? String(ev.message) : '';
if (msg.includes('releaseGraphicsResources') || msg.includes('openGLTexture')) { // Detect known rendering/WebGL-related errors and actor/colormap issues
console.error('Detected graphics resource error:', ev); if (
msg.includes('releaseGraphicsResources') ||
msg.includes('openGLTexture') ||
msg.includes('getDefaultActor') ||
msg.includes('setColormapGPU') ||
msg.includes("can't access property \"actor\"") ||
// generic rendering failure
msg.toLowerCase().includes('webgl') ||
msg.toLowerCase().includes('colormap')
) {
console.error('Detected graphics/rendering error:', ev);
setGraphicsErrorMessage(msg || null); setGraphicsErrorMessage(msg || null);
setGraphicsErrorVisible(true); setGraphicsErrorVisible(true);
} }
@@ -456,8 +466,16 @@ function App({ container_id, imageStacks, autoCacheStack, annotationJson, viewer
try { try {
const reason = (ev && (ev as any).reason) || ''; const reason = (ev && (ev as any).reason) || '';
const text = typeof reason === 'string' ? reason : (reason && reason.message) ? reason.message : String(reason); const text = typeof reason === 'string' ? reason : (reason && reason.message) ? reason.message : String(reason);
if (text.includes('releaseGraphicsResources') || text.includes('openGLTexture')) { if (
console.error('Detected graphics resource rejection:', ev); text.includes('releaseGraphicsResources') ||
text.includes('openGLTexture') ||
text.includes('getDefaultActor') ||
text.includes('setColormapGPU') ||
text.includes("can't access property \"actor\"") ||
text.toLowerCase().includes('webgl') ||
text.toLowerCase().includes('colormap')
) {
console.error('Detected graphics/rendering rejection:', ev);
setGraphicsErrorMessage(text || null); setGraphicsErrorMessage(text || null);
setGraphicsErrorVisible(true); setGraphicsErrorVisible(true);
} }
@@ -1402,47 +1420,51 @@ function App({ container_id, imageStacks, autoCacheStack, annotationJson, viewer
dicomImageLoaderInit(); dicomImageLoaderInit();
// Register client-side image loader for external images (JPEG/PNG/blob/data) // Register client-side image loader for external images (JPEG/PNG/blob/data)
try { try {
imageLoader.registerImageLoader('external', async (imageId: string) => { imageLoader.registerImageLoader('external', (imageId: string) => {
// imageId expected as 'external:<url>' const promise = (async () => {
const url = imageId.replace(/^external:/, ''); // imageId expected as 'external:<url>'
const img = new Image(); const url = imageId.replace(/^external:/, '');
img.crossOrigin = 'anonymous'; const img = new Image();
img.src = url; img.crossOrigin = 'anonymous';
await new Promise((resolve, reject) => { img.src = url;
img.onload = () => resolve(true); await new Promise((resolve, reject) => {
img.onerror = (e) => reject(e); img.onload = () => resolve(true);
}); img.onerror = (e) => reject(e);
});
const w = img.naturalWidth || img.width; const w = img.naturalWidth || img.width;
const h = img.naturalHeight || img.height; const h = img.naturalHeight || img.height;
const canvas = document.createElement('canvas'); const canvas = document.createElement('canvas');
canvas.width = w; canvas.width = w;
canvas.height = h; canvas.height = h;
const ctx = canvas.getContext('2d'); const ctx = canvas.getContext('2d');
if (!ctx) throw new Error('Unable to create canvas context'); if (!ctx) throw new Error('Unable to create canvas context');
ctx.drawImage(img, 0, 0, w, h); ctx.drawImage(img, 0, 0, w, h);
const im = ctx.getImageData(0, 0, w, h); const im = ctx.getImageData(0, 0, w, h);
const image = { const image = {
imageId, imageId,
minPixelValue: 0, minPixelValue: 0,
maxPixelValue: 255, maxPixelValue: 255,
slope: 1.0, slope: 1.0,
intercept: 0, intercept: 0,
rows: h, rows: h,
columns: w, columns: w,
height: h, height: h,
width: w, width: w,
color: true, color: true,
rgba: true, rgba: true,
sizeInBytes: im.data.length, sizeInBytes: im.data.length,
getPixelData: () => im.data, getPixelData: () => im.data,
// Some Cornerstone APIs expect `getImageData` or `getCanvas` - provide canvas and ImageData // Some Cornerstone APIs expect `getImageData` or `getCanvas` - provide canvas and ImageData
getImageData: () => im, getImageData: () => im,
getCanvas: () => canvas, getCanvas: () => canvas,
} as any; } as any;
return image; return image;
})();
return { promise };
}); });
} catch (e) { } catch (e) {
console.warn('Failed to register external image loader', e); console.warn('Failed to register external image loader', e);