Как передать путь файла dicom в библиотеку краеугольного камня и отобразить его?
Я хочу отобразить изображение Dicom с моего веб-сайта. Так что я нашел библиотеку краеугольного камня, чтобы сделать это.
Итак, это код:
<!DOCTYPE HTML>
<html>
<head>
<!-- twitter bootstrap CSS stylesheet - included to make things pretty, not needed or used by cornerstone -->
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<link href="cornerstone.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="page-header">
<br>
</div>
<div class="row">
<form class="form-horizontal">
<div class="form-group">
<input type="file" id="selectFile" >
</div>
</form>
</div>
<div style="width:512px;height:512px;position:relative;color: white;display:inline-block;border-style:solid;border-color:black;"
oncontextmenu="return false"
class='disable-selection noIbar'
unselectable='on'
onselectstart='return false;'
onmousedown='return false;'>
<div id="dicomImage"
style="width:512px;height:512px;top:0px;left:0px; position:absolute">
</div>
</div>
</div>
</body>
<!-- jquery - currently a dependency and thus required for using cornerstoneWADOImageLoader -->
<script src="jquery.min.js"></script>
<!-- include the cornerstone library -->
<script src="cornerstone.min.js"></script>
<!-- include the dicomParser library as the WADO image loader depends on it -->
<script src="dicomParser.min.js"></script>
<!-- include the cornerstoneWADOImageLoader library -->
<script src="cornerstoneWADOImageLoader.min.js"></script>
<script src="../dist/cornerstoneFileImageLoader.js"></script>
<!-- jpeg 2000 codec -->
<script src="jpx.min.js"></script>
<script>
$(document).ready(function() {
var element = $('#dicomImage').get(0);
cornerstone.enable(element);
// Listen for the change event on our input element so we can get the
// file selected by the user
$('#selectFile').on('change', function(e) {
// Add the file to the cornerstoneFileImageLoader and get unique
// number for that file
var file = e.target.files[0];
alert("cambio il file");
var index = cornerstoneFileImageLoader.addFile(file);
// create an imageId for this image
var imageId = "dicomfile://" + index;
// load and display this image into the element
var element = $('#dicomImage').get(0);
cornerstone.loadImage(uriImageDesktop).then(function(image) {
cornerstone.displayImage(element, image);
});
});
});
</script>
</html>
С помощью этого кода я могу отобразить одну HTML-страницу с помощью средства выбора файлов. С помощью этого компонента я могу перейти на свой компьютер, а затем библиотека загрузить изображение Dicom.
Теперь я хочу передать из URL путь моего изображения Dicom.
Поэтому я пытаюсь сделать это
var uriImageDesktop = "C:\Users\michele\Desktop\deflate_tests\image";
// load and display this image into the element
var element = $('#dicomImage').get(0);
cornerstone.loadImage(uriImageDesktop).then(function(image) {
cornerstone.displayImage(element, image);
});
на данный момент я записал статичное изображение dicom, но оно не найдено.
Итак, вопрос в том, как я могу передать путь из моего файла dicom и затем отобразить его?
1 ответ
Здесь вам не хватает загрузчика изображений. Cornerstone требует, чтобы загрузчик изображений преобразовал вашу ссылку в объект изображения, читаемый краеугольным камнем. Если вы посмотрите репозиторий на github от краеугольного камня, вы найдете два загрузчика изображений. Загрузчик изображений WADO может использоваться для чтения файлов DICOM. Вам нужно будет создать серверную часть для обслуживания файлов DICOM, поскольку браузер не сможет получить доступ к файлам сервера. Если у вас есть uri для доступа к файлу DICOM:
import * as cornerstone from "cornerstone-core"
import * as cornerstoneWADOImageLoader from "cornerstone-wado-image-loader"
cornerstoneWADOImageLoader.external.cornerstone = cornerstone
const uriServed = "http://xxx/deflate_tests/image"
const element = $('#dicomImage').get(0);
cornerstone.loadImage("wadouri:" + uriServed).then(image => {
cornerstone.displayImage(element, image);
});
NB: если у вас нет npm, просто сделайте ссылку на файлы.js как скрипты вместо импорта (или вы также можете импортировать их в ES6+)
Возможно, формат URI неверен. Пример не содержит схемы. Что-то вроде
file://c:/Users/user/Desktop/images/image.dcm
может работать лучше