Open craulii opened 1 month ago
Justificación para Prioridad: La HU001 es fundamental para la funcionalidad de cargar y visualizar múltiples imágenes DICOM, facilitando la carga y análisis de series de imágenes. Esta capacidad es crucial para la eficiencia del flujo de trabajo del usuario y la funcionalidad general de la aplicación. Sin esta función no tendría sentido el desplazarse entre imagenes, es decir, es la piedra angular de este proyecto.
const handleFileChange = async (event) => {
const file = event.target.files[0];
if (file) {
const zip = new JSZip();
const zipContent = await file.arrayBuffer();
const zipFile = await zip.loadAsync(zipContent);
const imageEntries = [];
zipFile.forEach((relativePath, zipEntry) => {
if (!zipEntry.dir && zipEntry.name.endsWith('.dcm')) {
imageEntries.push({ name: zipEntry.name, entry: zipEntry });
}
});
imageEntries.sort((a, b) => a.name.localeCompare(b.name));
const imagePromises = imageEntries.map((imageEntry) => imageEntry.entry.async('arraybuffer'));
Promise.all(imagePromises).then((imageBuffers) => {
const validImages = [];
imageBuffers.forEach((buffer, index) => {
try {
const blob = new Blob([buffer], { type: 'application/dicom' });
const imageId = cornerstoneWADOImageLoader.wadouri.fileManager.add(blob);
validImages.push(imageId);
} catch (error) {
console.warn('No es una imagen DICOM válida:', index, error);
}
});
setImages(validImages);
if (validImages.length > 0) {
loadImage(validImages[0]);
}
});
}
};
<label htmlFor="file-upload" className="custom-file-upload">
Subir Archivo ZIP
</label>
<input id="file-upload" type="file" accept=".zip" onChange={handleFileChange} />
DicomViewer.js
.custom-file-upload {
background-color: #1f4068;
color: #ffffff;
padding: 10px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
text-align: center;
}
input[type="file"] {
display: none;
}
Styles.css
const loadImage = (imageId) => {
if (imageCache.current[imageId]) {
displayImage(imageCache.current[imageId]);
} else {
cornerstone.loadImage(imageId).then((image) => {
imageCache.current[imageId] = image;
displayImage(image);
}).catch((error) => {
console.error('Error cargando imagen:', error);
});
}
};
const displayImage = (image) => { const element = divRef.current; if (element) { cornerstone.displayImage(element, image); updateViewport(); } };
const handleImageChange = (index) => {
if (index >= 0 && index < images.length) {
setCurrentImageIndex(index);
}
};
const nextImage = () => {
if (currentImageIndex < images.length - 1) {
setCurrentImageIndex(currentImageIndex + 1);
}
};
const prevImage = () => {
if (currentImageIndex > 0) {
setCurrentImageIndex(currentImageIndex - 1);
}
};
const updateViewport = () => {
const element = divRef.current;
if (element) {
const viewport = cornerstone.getViewport(element);
if (viewport) {
viewport.voi.windowWidth = 256 * contrast;
viewport.voi.windowCenter = 128 + brightness;
viewport.invert = inverted;
cornerstone.setViewport(element, viewport);
}
}
};