零足跡(Zero-footprint)應用程序的需求日益增長，而在醫療行業中的需求增長尤為突出。LEADTOOLS是唯一一款功能全面的，提供了12/16位灰度級客戶端調窗(window-leveling)的醫療程序開發包。

LEADTOOLS HTML5和JavaScript 查看器控件為創建跨平臺的、無痕HTML5 DICOM查看器提供了無與倫比的速度和全面的功能。

LEADTOOLS HTML5 DICOM Viewer功能介紹：

• HTML5/JavaScript Viewer Control可創建跨平臺的圖像查看功能
• 同時支持鼠標和多點觸控（手勢）輸入
• 擁有醫學影像“調窗”、Series Stack和圖像處理等功能
• 隨時隨地通過本地存檔或DICOM通信連接遠程PACS查看DICOM圖像
• 原生HTML5圖像注釋和標記
• 完整的HTML5 DICOM查看器源代碼

使用RESTful Web Service查詢和檢索DICOM圖像

服務器組件使用RESTful Web Service 連接本地文檔或任何可訪問的遠程PACS系統。此服務可處理所有的PACS通信（即C-FIND，C-MOVE，C-STORE等），并通過JSON鏈接查看器控件。

 搜索文檔，選擇一個病人，study 和series后，圖像就開始流向查看器。首先，服務器會發送一張需要被即刻顯示的JPEG壓縮圖像，在后臺，服務器注入調窗數據，并保留圖像幀。

在下面的代碼片段中，輸入的數據被收集，然后通過JSON發送到服務器。接下來，該應該程序可以處理接收到的服務器響應，解析數據并填充studies 和series列表。

function DoSearch() {
queryOptions.PatientsOptions = {};
queryOptions.StudiesOptions = {};
queryOptions.PatientsOptions.PatientID = pid;
queryOptions.PatientsOptions.PatientName = pName;
queryOptions.StudiesOptions.AccessionNumber = accession;
queryOptions.StudiesOptions.ReferDoctorName = RefDrName;
queryOptions.StudiesOptions.ModalitiesInStudy = modalitiesInStudy;

if (document.getElementById("QueryLocal").checked) {
SetQueryMode(QueryMode.Local);
}
else {
SetQueryMode(QueryMode.PACS);
}

searchPage.SearchStudies(queryOptions);
}

function OnSearchStudiesSuccess ( studies ) {
if (null == studiesGrid) {
InitializeStudiesGrid();
}

studiesGrid.resetActiveCell();
studiesGrid.getOptions().autoHeight = true;
studiesGrid.setData(studies);
studiesGrid.updateRowCount();
studiesGrid.render();
$(studiesGridName).show();

$('html, body').animate({
scrollTop: $(studiesGridName).offset().top
}, 1000);
}

客戶端DICOM圖像調窗

由于大多數DICOM數據集包含12/16位灰度圖像數據和只顯示8位的監測儀，因此圖像調窗與初始化圖像同等重要。為何客戶端調窗如此重要？沒有圖像調窗，參數必須被發送到處理調窗的服務器，將其轉換為8位圖像，并將其返回給客戶端。隨著圖像的增大，加上醫務人員手機和平板電腦等設備查看圖像時，大量的數據往返于客戶端和服務器之間會嚴重影響查看器性能。

LEADTOOLS利用無損壓縮并將原始DICOM圖像數據存儲在緩存，正好解決了大量數據往返于客戶端和服務器時造成的性能受損的問題。

正如下列代碼和截圖所示，首次顯示圖像或滾動至窗口視圖時，調窗按鈕被禁用。一旦顯示，會發生請求只服務器，并且原始DICOM圖像數據開始流向客戶端。一兩秒后，調窗按鈕被激活，并展示出一個帶有當前調窗值的標簽。

function LoadImages(instances, xmlData) {

Clear();
_images = [];

for (var instanceIndex = 0; instanceIndex < framesLength; instanceIndex++) {
var loadImageElement = document.createElement('img');
var frame = new ImageFrame();

frame.FrameIndex = instanceIndex;
if (multiFrame) {
frame.FrameNumber = instanceIndex + 1;
frame.Instance = instances[0];
frame.DicomData = xmlData;
frame.ImageInformation = (instanceIndex == 0) ? DicomHelper.GetDicomImageInformation(xmlData) : _images[0].ImageInformation;
}
else {
frame.FrameNumber = 1;
frame.Instance = instances[instanceIndex];
frame.DicomData = (instanceIndex == 0) ? xmlData : null;
frame.ImageInformation = (instanceIndex == 0) ? DicomHelper.GetDicomImageInformation(xmlData) : null;
}

frame.ImageElement = loadImageElement;

loadImageElement.src = objectRetrieveProxy.GetImageUrl(frame);
}
}

function OnDrawImage() {
var currentIndex = _stackInteractiveMode.get_frameIndex();

_dicomLoader.DrawImage(currentIndex);

if (!_dicomLoader.IsImageDataAvailable(currentIndex)) {
DisableWindowLevel();
}
else {
EnableWindowLevel();
}
}