使用html查看dicom,使用LEADTOOLS HTML5 Medical Viewer从任何地方查看DICOM图像教程
LEADTOOLS Recognition Imaging SDK是精选的LEADTOOLS SDK功能集,旨在在企业级文档自动化解决方案中构建端到端文档成像应用程序,这些解决方案需要OCR,MICR,OMR,条形码,表单识别和处理,PDF,打印捕获 ,档案,注释和图像查看功能。 这套功能强大的工具利用LEAD屡获殊荣的图像处理技术,智能识别可用于识别和提取任何类型的扫描或传真形式图像数据的文档功能。
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: "" ,
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正版授权,或了解更多产品信息请点击【咨询在线客服】
使用html查看dicom,使用LEADTOOLS HTML5 Medical Viewer从任何地方查看DICOM图像教程相关推荐
- html5位图图像,LEADTOOLS HTML5图像教程
简介 零空间占用图像应用程序的概念已经出现了一段时间,越来越多的人在日常任务中开始依赖移动设备和平板电脑,这个概念又重新流行了起来.平台和操作系统的多样性是一个挑战.相同的应用程序会运行在任意的桌面. ...
- LEADTOOLS HTML5/JavaScript 实现客户端图像处理
实现零足迹(zero footprint)应用程序的方法虽多,然而许多的应用只是简单的把所有的图片推给服务器端处理,图像处理性能和质量就大打折扣.有了LEADTOOLS JavaScript库,这些问 ...
- html5 ocr图片识别,OCR识别控件LEADTOOLS HTML5案例:整页OCR识别
由于移动设备的处理能力和储存空间限制,在移动设备上执行光学字符识别(OCR)一直以来都是一项较大的挑战.随着LEADTOOLS HTML5的出现,在移动设备上执行光学字符识别(OCR)变成可能.凭借L ...
- html图片查看代码实现,如何用HTML5实现图片预览和查看原图的功能
html5实现图片预览和查看原图 html5实现图片预览和查看原图相对以前容易多了,在以前,为了安全,web端的js是不能读取文件的本地真实路径的,只能将图片上传到服务器上,再取图片的链接,这样才能实 ...
- html5实现图片预览和查看原图
html5提供了很多新的API,减轻了很多开发者的工作,比如这次要讲解的FileReader和naturalWidth,naturalHeight就能实现图片预览和查看原图功能 html5 从一开始就 ...
- HTML5点击图片查看大图,科技常识:HTML5 实现图片预览和查看原图
今天小编跟大家讲解下有关HTML5 实现图片预览和查看原图 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关HTML5 实现图片预览和查看原图 的相关资料,希望小伙伴们看了有所帮助. htm ...
- 【转载】dos下通过wmic命令查看硬盘和内存/CPU信息(windows自带命令查看硬件信息)
更新时间:2014年05月11日 00:26:16 投稿:mdxy-dxy 这篇文章主要介绍了windows系统自带命令查看硬件信息,怎样dos命令查看硬盘和内存/CPU信息的方法,需要的朋友可以 ...
- windows查看usb信息命令_【VPS】Linux VPS查看系统信息命令大全
本文转自老左笔记,自用mark 系统 # uname -a # 查看内核/操作系统/CPU信息 # head -n 1 /etc/issue # 查看操作系统版本 # cat /proc/cpuinf ...
- 查看python内部模块命令,内置函数,查看python已经安装的模块命令
查看python内部模块命令,内置函数,查看python已经安装的模块命令 可以用dir(modules) 或者用 pip list 或者用 help('modules') 或者用 python -m ...
- ps查看所有php进程,ps命令就是最基本进程查看命令
1.ps是什么? 要对进程进行监测和控制,首先必须要了解当前进程的情况,也就是需要查看当前进程,ps命令就是最基本进程查看命令.使用该命令可以确定有哪些进程正在运行和运行的状态.进程是否结束.进程有没 ...
最新文章
- oracle独立事务,Oracle中独立事务的处理
- [html] HTML5拖拽事件的顺序是什么?
- Ubuntu安装pycharm并且激活
- 基于维特比算法的概率路径
- 波士顿房价预测python决策树_机器学习·波士顿房价预测模型
- python爬虫实例100例-Python 练习实例1
- 药店管理系统/APP/小程序/网站
- 全球国家和地区代码列表
- 基于stm32风力摆控制系统(电赛获得省一)
- vscode如何快捷键一键生成vue模板
- 高质量PWM数字功放芯片
- 新手小白如何从0到1学会电商运营,这3个方法带你月入五位数
- 有限自动机字符串匹配
- C语言递归函数求n!的两种写法---详细讲解
- docker-bridge如何通信
- 数学建模参赛技巧 --- 论文撰写
- 【Linux】解决Centos软件安装源出错
- SQLDbx工具连接Oracle数据库
- Java设计模式之Builder模式
- 开源Excel报表工具:jxls