使用LEADTOOLS HTML5 Medical Viewer从任何地方查看DICOM图像教程

原创
2020/11/18 15:12
阅读数 30

LEADTOOLS Recognition Imaging SDK是精选的LEADTOOLS SDK功能集,旨在在企业级文档自动化解决方案中构建端到端文档成像应用程序,这些解决方案需要OCR,MICR,OMR,条形码,表单识别和处理,PDF,打印捕获 ,档案,注释和图像查看功能。 这套功能强大的工具利用LEAD屡获殊荣的图像处理技术,智能识别可用于识别和提取任何类型的扫描或传真形式图像数据的文档功能。

点击下载LEADTOOLS Recognition Imaging SDK试用版

头部CT扫描的Gif从完全对比变为没有对比

DICOM是存储和传输医疗信息和图像的领先标准。LEADTOOLS提供功能齐全的零占用空间DICOM查看器,以显示DICOM图像和来自所有学科和方式的研究。我们的可定制Web解决方案非常适合需要快速DICOM查看器且具有高级功能(例如3D体积渲染,DICOM叠加,软拷贝呈现状态等)的任何开发人员。

仅需以下几行代码,便可以将功能强大的DICOM查看器嵌入到任何网页中,该查看器可以进行窗口级别,缩放,缩放,堆栈滚动等操作。请访问我们的文档以获取有关如何在Medical Viewer中加载和显示DICOM图像的完整教程。

window.onload = function () {
    // Get the parent DIV
    var imageViewerDiv = document.getElementById("MedicalViewerParentDiv");
    // Create the medical viewer control, and specify the number or rows and columns.
    var viewer = new lt.Controls.Medical.MedicalViewer(imageViewerDiv, 2, 2);
    // [optional] Update the splitter size so it become thick and easy to move.
    viewer.get_gridLayout().set_splitterSize(7);
    // Create a cell name
    var cellName = "MedicalCell" + Date.now();
    // Create a cell. It will contain an image or a series of images, based on how many Frames are added (see below for mor details).
    var cell = new lt.Controls.Medical.Cell(viewer, viewer.get_divId(), 1, 1);
    // Set the show border to "true", to show a border around the cell.
    cell.set_showFrameBorder(true);
    // Add the cell to the viewer.
    viewer.layout.get_items().add(cell);
    // [optional] Select the cell (it can also be selected by clicking on it.)
    cell.set_selected(true);
    // Now create a frame object which will hold the image inside the cell.
    var cellFrame = new lt.Controls.Medical.Frame(cell);
    // Add the frame to the cell class.
    cell.get_frames().add(cellFrame);
    // we are now going to download an image from LEADTOOLS medical web service demo.
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function (data) { if(this.readyState == 4 && this.status == 200) {
    // here we got the authentication code that we need to retrieve the images from LEADTOOLS database.
    authenticationCode = encodeURIComponent(this.responseText);
    // now, this is the MRTI info that contains the image information, width, height, tiles...etc.
    var mrtiInfo = new lt.Controls.Medical.MRTIImage();
    // The image dpi.
    mrtiInfo.fullDpi = lt.LeadSizeD.create(150, 150);
    // the tile size, recommended value is 256
    mrtiInfo.tileSize = lt.LeadSizeD.create(256, 256);
    mrtiInfo.frameIndex = 0;
    // does this image support window level.
    mrtiInfo.supportWindowLevel = true;
    // different resolution for the image.
    var resolutions = [
    { width: 2460, height: 2970 },
    { width: 1230, height: 1485},
    { width: 615, height: 742 },
    { width: 307, height: 371 },
    { width: 153, height: 185},
    { width: 76, height: 92 },
    ];
    mrtiInfo.resolutions = [];
    for (var i = 0; i < resolutions.length; i++) { mrtiInfo.resolutions[i]=lt.LeadSizeD.create( resolutions[i].width, resolutions[i].height ); }
    // the image width and height. cellFrame.set_width(mrtiInfo.resolutions[0].width);
    cellFrame.set_height(mrtiInfo.resolutions[0].height);
    // the image full size.
    mrtiInfo.fullSize=lt.LeadSizeD.create(
    cellFrame.get_width(), cellFrame.get_height() );
    // now we need the image URL, var
    imageUri="http://localhost/MedicalWebService/ObjectRetrieveService.svc" ; imageUri +="/GetImageTile?auth=" ;
    imageUri +=authenticationCode; // this the image instance UID, change this if you want to retrieve anything else.
    imageUri +="&instance=1.2.840.114257.1.9.1245.56421.52314.1187852.12457" ;
    mrtiInfo.imageUri=imageUri;
    // set this info to the cell frame.
    cellFrame.mrtiInfo=mrtiInfo;
    // now we need to set the information for the image so we cando window level.
    var imageInfo=new lt.Controls.Medical.DICOMImageInformation();
    // set the image width and height.
    imageInfo.width=2460;
    imageInfo.height=2970;
    // bits per pixel for the image
    imageInfo.bitsPerPixel=16;
    // low and high bit.
    imageInfo.lowBit=0;
    imageInfo.highBit=11;
    // other information, setting some of them to zero means that the toolkit will try and calculate it by itself, but you can always get those values from the DicomDataSet.
    imageInfo.modalityIntercept=0; imageInfo.modalitySlope=1;
    imageInfo.minValue=0; imageInfo.maxValue=0;
    imageInfo.windowWidth=0;
    imageInfo.windowCenter=0;
    imageInfo.signed=false;
    imageInfo.photometricInterpretation="MONOCHROME1" ;
    imageInfo.firstStoredPixelValueMapped=0;
    // set information tothe frame.
    cellFrame.set_information(imageInfo); } };
    // We are trying here to get an image from the Leadtools database, we need to login and get the authentication code.
    xhttp.open( "POST", "http://localhost/MedicalWebService/AuthenticationService.svc/AuthenticateUser" , true );
    xhttp.setRequestHeader("Content-Type", "application/json; charset=UTF-8" );
    // we log in as a 'guest' , after calling the below line, we will receive the authentication code sent via 'onreadystatechange' above.
    xhttp.send(
    JSON.stringify({ userName: "<Medical Web Service User Name>" ,
    password: "<Medical Web Service Password>" ,
    userData: "" , })
    );
    // [optional] Add an action that allows the user to move the loaded image using either the mouse or by touch and drag. we are adding an offset action.
    cell.setCommand(1, new lt.Controls.Medical.OffsetAction());
    // [optional] Add an action that allows the user to do window level on the image.
    cell.setCommand(2, new lt.Controls.Medical.WindowLevelAction());
    // [optional] Run the action. Now if the user clicks or touches the image and drags it, the image will move correspondingly.
    cell.runCommand(2);
    // [optional] Create an overlay text that will appear at the top of the loaded image.
    var overlay=new lt.Controls.Medical.OverlayText();
    // [optional] Set the aligment for the overlay text.

    overlay.set_alignment(lt.Controls.Medical.OverlayAlignment.topLeft);
    // [optional] Set the row index of overlay
    text. overlay.set_positionIndex(0);
    // [optional] add window level overlay text, this will change when you click and drag the mouse.
    overlay.set_type(lt.Controls.Medical.OverlayTextType.windowLevel);
    }

 

试试看!

要自己进行测试,请确保从我们的网站上免费获得最新的LEADTOOLS SDK评估(如果还没有的话)。该试用版有效期为60天,并提供无限制的聊天和电子邮件支持。

支持

需要帮助来获取此样本吗?请联系我们的支持团队以获取免费技术支持!有关价格或许可问题,您可以联系我们的销售团队。

请继续关注,因为正如我们之前的帖子中所承诺的那样,我们将提供更多教程,程序员可以使用它们来开发直接影响数据捕获、识别、交换和其他紧迫业务需求的应用程序。

试用版下载>>>

LEADTOOLS 使用教程>>>


想要购买LEADTOOLS正版授权,或了解更多产品信息请点击【咨询在线客服】

展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部