開源醫學影像平台---Cornerstonejs學習筆記<3>

Viewports

每個Enabled Element都有一個Viewport ，描述了應如何渲染Image 。

可以通過getViewport（）函數獲取啟用元素的視口參數，並使用setViewport（）函數進行設置。可以在API文檔的Viewport對象定義中找到Viewport的可用屬性。查看示例。

Images

Image Loaders返回一個圖像對象。

可以在API文檔的Image object definition中找到Image的可用屬性。

Pixel Coordinate System

當參考圖像中的單個像素時，使用像素坐標系，並支持子像素精度。坐標系的原點是0.0,0.0是圖像中左上像素的左上角，列是行，圖像中右下像素的右下角是行。因此，坐標0.5,0.5是左上像素的中心。

1. pageToPixel（）函數可用於將從瀏覽器事件獲得的坐標轉換為像素坐標系中的坐標。
2. 函數setToPixelCoordinateSystem（）可用於將畫布上下文設置為像素坐標系。在處理CornerstoneImageRendered事件以在圖像頂部繪制幾何圖形時，這很有用。
3. 該坐標系與在DICOM灰度軟拷貝表示狀態圖形標注模塊中為使用PIXEL標注單位繪制的圖形所指定的坐標系統匹配。
4. 使用Math.ceil（）從像素坐標系轉換為整數像素數（用於查找像素數據中的像素值）

Rendering Loop

Cornerstone Enabled Elements的Viewport（例如，開窗，平移，縮放等）更改通過基於requestAnimationFrame的渲染循環進行更新。

在大多數現代瀏覽器中，呈現循環都使用requestAnimationFrame（RAF）方法。如果RAF不可用，則使用setTimeout和clearTimeout為其填充16 ms計時器。

當啟用或禁用元素與Cornerstone一起使用時，將逐個元素啟用渲染循環。

工作流程如下：

1. 向RAF注冊了draw（）回調；
2. 在屏幕上顯示一幀后，瀏覽器就會調用draw（）；
3. 接到回調后
   • 如果計划將元素重新渲染，則將其渲染並向RAF重新注冊draw（）；
   • 如果沒有計划重新渲染該元素，則不執行任何工作，並且向RAF重新注冊該回調；
   • 如果元素被禁用（），則不重新注冊該回調，從而結束呈現循環。

這意味着：

• cornerstone.draw（）和cornerstone.invalidate（）不會觸發立即渲染viewport.。而是將圖像標記為需要重新渲染。
• 每個基石元素都會注冊自己的RAF循環；
• 如果在60 Hz系統上渲染時間超過16毫秒，則跳過渲染幀；否則，將跳過渲染幀。
• 即使渲染時間比16 ms短得多，每幀只能進行一次渲染。
• 所有交互（例如，窗口，平移，縮放等）都將合並並在下一幀中呈現。

Libraries

Cornerstone是一個開源項目，旨在提供一個完整的基於Web的醫學成像平台。它提供了可以一起使用或獨立使用的模塊化庫。

 Cornerstone ecosystem的核心元素是Cornerstone Core library，通常稱為Cornerstone。這是處理 image rendering pipeline, loading, caching, 和viewport transformations的庫.

除了核心庫之外，Cornerstone開發團隊還支持其他幾個庫，這些庫為開發復雜的成像應用程序提供了生態系統。

Library	描述
Cornerstone Core	中央庫，提供圖像渲染，加載，緩存和viewport轉換
Cornerstone Tools	對構建工具的擴展支持，對鼠標，鍵盤和觸摸設備的支持。
Cornerstone WADO Image Loader	用於DICOM Part 10文件的圖像加載器
Cornerstone Web Image Loader	用於Web圖像文件（PNG，JPEG）的圖像加載器
Cornerstone Math	支持工具開發的數學實用函數和類
dicomParser	強大的DICOM Part 10解析庫

Rendering Pipeline

Cornerstone將根據圖像（例如，灰度，顏色，標簽圖，viewport 偽彩色）類型從多個圖像渲染管道中進行選擇。

Rendering Pipeline Workflow

渲染路徑	描述
renderGrayscaleImage	灰度圖像的默認渲染管道。包括模態和VOI LUT轉換。
renderPseudoColorImage	設置視口顏色圖屬性時使用。這將在模態LUT和VOI LUT變換之后將偽彩色LUT變換應用於像素數據。
renderColorImage	彩色圖像的默認渲染管道。除非Image 的rgba屬性設置為true，否則所有像素的Alpha均保持不透明。
renderWebImage	用於瀏覽器已加載的圖像（PNG，JPEG）的自定義渲染管道。如果未應用VOI LUT轉換（windowWidth，windowCenter，invert），則可以直接從Image getImage函數繪制畫布。
renderLabelMapImage	標簽圖的渲染管道。偽彩色LUT變換直接應用於存儲的像素數據。沒有應用模態或VOI LUT轉換。

Metadata Providers

Metadata Provider是JavaScript功能充當用於訪問在Cornerstone與圖像有關的metadata的接口。用戶可以定義自己的提供程序功能，以返回每個特定圖像所需的任何metadata。

醫學圖像通常帶有很多非像素metadata，例如圖像的像素間距，患者ID或掃描獲取日期。對於某些文件類型（例如DICOM），此信息存儲在文件頭中，並且可以在應用程序中讀取和解析並傳遞這些信息。與其他（例如JPEG，PNG）一起，需要獨立於實際像素數據提供此信息。但是，即使對於DICOM圖像，應用程序開發人員通常也可以獨立於從服務器到客戶端的像素數據傳輸來提供元數據，因為這樣可以大大提高性能。

為了處理這些情況，Cornerstone提供了用於Metadata Providers的定義和使用的基礎結構。metadata提供程序只是簡單的函數，它們接受Image Id和指定的metadata類型，然后返回metadata本身。

這是一個metadata提供程序的簡單示例，它返回一個對象，該對象包含單個特定圖像（Image ID：'ct:// 1'）的圖像平面metadata：

function metaDataProvider(type, imageId)
  if (type === 'imagePlaneModule') {
    if (imageId === 'ct://1') {
        return {
            frameOfReferenceUID: "1.3.6.1.4.1.5962.99.1.2237260787.1662717184.1234892907507.1411.0",
            rows: 512,
            columns: 512,
            rowCosines: {
                x: 1,
                y: 0,
                z: 0
            },
            columnCosines: {
                x: 0,
                y: 1,
                z: 0
            },
            imagePositionPatient: {
                x: -250,
                y: -250,
                z: -399.100006
            },
            rowPixelSpacing: 0.976562,
            columnPixelSpacing: 0.976562
        };
    }
  }
}

// Register this provider with CornerstoneJS
cornerstone.metaData.addProvider(metaDataProvider);

// Retrieve this metaData
var imagePlaneModule = cornerstone.metaData.get('imagePlaneModule', 'ct://1');

Basics

• Cornerstone允許注冊多個Metadata提供者。
• 每個提供者都可以提供開發人員所需的任何信息。
• 當請求圖像的Metadata時，Cornerstone將遍歷已知的提供程序，直到為指定的元數據類型檢索定義的Metadata集。
• 可以使用可選的優先級值將提供程序添加到Cornerstone中，以影響調用它們的順序。
• 當Cornerstone WADO Image Loader加載DICOM圖像時，它們的元數據將被解析並自動添加到Metadata提供程序中。
• 在Cornerstone Tools中，特定的Metadata類型用於提供工具的Metadata。