[javascript] Universal Viewer를 활용한 의료 영상 시각화 기능
의료 분야에서는 영상 데이터를 시각화하여 의사나 연구자들이 진단과 연구에 활용합니다. Universal Viewer는 오픈 소스 도구로, 다양한 종류의 의료 영상을 효과적으로 시각화할 수 있게 도와줍니다.
Universal Viewer란?
Universal Viewer는 HTML5와 JavaScript로 구현된 오픈 소스 영상 시각화 도구입니다. 이 도구를 사용하면 DICOM, NIFTI, JPEG 등 다양한 의료 영상 형식을 웹 브라우저에서 로드하여 2D와 3D 시각화를 할 수 있습니다.
의료 영상 시각화 기능 구현하기
아래는 Universal Viewer를 활용하여 의료 영상을 시각화하는 기능을 구현한 예제입니다.
<!DOCTYPE html>
<html>
<head>
<title>의료 영상 시각화</title>
<script src="https://unpkg.com/openseadragon@2.4.0/openseadragon.min.js"></script>
<script>
function loadViewer() {
var viewer = OpenSeadragon({
id: "viewer",
prefixUrl: "openseadragon-images/",
showNavigator: true,
tileSources: [
{
type: "image",
url: "example.dcm"
}
]
});
}
</script>
</head>
<body onload="loadViewer()">
<div id="viewer" style="width: 100%; height: 500px;"></div>
</body>
</html>
위 예제는 HTML 문서 안에 Universal Viewer를 로드하고, 의료 영상 파일을 로드하여 시각화하는 기능을 구현한 것입니다. tileSources 속성에 의료 영상 파일의 정보를 입력하여 영상을 로드하고, showNavigator 속성을 true로 설정하여 탐색기를 활성화시킵니다.