1. 程式人生 > >Cornerstone.js使用相關

Cornerstone.js使用相關

pla 網站 希望 簡介 mea 第三方 font 不存在 rain

官網地址:https://github.com/chafey/cornerstone

簡介:

Cornerstone is an open source project with a goal to deliver a complete web based medical imaging platform. This repository contains the Cornerstone Core component which is a lightweight JavaScript library for displaying medical images in modern web browsers that support the HTML5 canvas element. Cornerstone Core is not meant to be a complete application itself, but instead a component that can be used as part of larger more complex applications. See the OHIF Viewer for an example of using the various Cornerstone libraries to build a simple study viewer.

Cornerstone Core is agnostic to the actual container used to store image pixels as well as the transport mechanism used to get the image data. In fact, Cornerstone Core itself has no ability to read/parse or load images and instead depends on one or more ImageLoaders to function. The goal here is to avoid constraining developers to work within a single container and transport (e.g. DICOM) since images are stored in a variety of formats (including proprietary). By providing flexibility with respect to the container and transport, the highest performance image display may be obtained as no conversion to an alternate container or transport is required. It is hoped that developers feel empowered to load images from any type of image container using any kind of transport. See the CornerstoneWADOImageLoader project for an example of a DICOM WADO based Image Loader.

基石是一個開源項目,目標是提供一個完整的基於網絡的醫學成像平臺。該存儲庫包含Cornerstone核心組件,它是一個輕量級的JavaScript庫,用於在支持HTML5 canvas元素的現代Web瀏覽器中顯示醫學圖像。Cornerstone Core並不意味著是一個完整的應用程序本身,而是一個可以用作更大更復雜應用程序的一部分的組件。有關使用各種Cornerstone庫構建簡單的學習查看的示例,請參閱 OHIF Viewer

Cornerstone Core與用於存儲圖像像素的實際容器以及用於獲取圖像數據的傳輸機制無關。事實上,Cornerstone Core本身無法讀取/解析或加載圖像,而是依賴於一個或多個

ImageLoaders來運行。這裏的目標是避免限制開發人員在單個容器和傳輸(例如DICOM)中工作,因為圖像以各種格式(包括專有)存儲。通過提供關於容器和運輸的靈活性,可以獲得最高性能的圖像顯示,因為不需要轉換到替代容器或運輸。希望開發人員有權使用任何類型的傳輸從任何類型的圖像容器加載圖像。

這是關於Cornerstone的簡介,簡單來說,這並不是一個應用程序,只是一個js的插件,也就是一個庫,簡稱基石。。 基石實際封裝好了一些列Dicom圖像的操作,但關於獲取圖像,解析圖像等都依賴於基石庫種的其他.js文件。

開始正文:

最新一個新的需求就是:在canvas上繪制Dicom圖像,之前的圖像都是jpg或者png的。我們的網站是一個醫療的網站,醫生上傳Dicom圖像,通過第三方Dicom解析工具將dicom圖像解析還原為jpg,從而繪制在畫布上。我認為思路其實是一樣的,都是解析dicom像素的每一個信息,然後再繪制畫布。但是涉及到兩個問題:1.圖像逐像素解析 2.當發生交互時,頻繁的與後臺進行數據交換,例如調節窗寬窗位,前端傳遞數值,後臺根據wwwc算出響應的顯示值,再傳給前端,在繪制。以上這個流程是當發生交互時使用的dicom轉jpg的思路,如果沒有交互,只是顯示,那麽直接後臺解析dicom然後轉jpg即可,但是現在需要調節窗寬窗位,大小縮放等等,就需要在canvas上直接繪制Dicom圖像(還有一種方法,窗寬窗位百度了一下原理,調節像素灰度值,我們可以根據窗寬窗位直接調節灰度jpg的像素灰度即可,但是公式?例如窗寬窗位 600/1000,那麽對應圖像的灰度應該多少?對於Ddicom圖像窗寬窗位的調整是有公式的,jpg灰度對應窗寬窗位的值的對應關系還沒有找到,http://blog.csdn.net/lifegame/article/details/6388609,這個鏈接是調節圖像灰度的,裏邊給出了一套公式,但並不具備科學依據,產品最終是給醫生用的,必須要準確(鏈接不知道怎麽整動態的,直接復制粘貼))。

自己解析Dicom然後進行像素操作有難度,開始查一些相關的資料,有一些公司在做這方面,做得比較好的,而且樂於分享技術的 微雲影像,雖說分享的技術太深,並且太少難於理解,但是還是找到了一些答案——CornerStone.js

微雲的技術文檔:http://www.weiyunyingxiang.com/artical8.htm。沒有什麽具體的分享,但是有一個大概的思路。後來開始看cornerstone的Github鏈接,網上沒有什麽這方面的資料,看了一些網站都是用這個庫做的,這個庫並不能滿足需求,其中的一些例子只是一些操作,但是如何把dicom繪制到canvas上並沒有找到,有個例子,他是把dicom圖像直接解析成Base64編碼,直接一個字符串顯示好幾十行的編碼,並沒有解析顯示的具體操作,後來偶然間點擊到了另外一個庫,也是基石相關的,但是可以解決實際問題 。

cornerstoneWADOImageLoader

https://github.com/chafey/cornerstoneWADOImageLoader具體的可以自己去看,但是幾點遇到的問題在這裏說明一下:

1.imageids,圖像的唯一標識,原文是根據不同的id調用不同的imageloads,最開始理解是要根據自己的id去找適配的imageload,最後發現其實基石已經做好了適配,你只要提供id,他會根據你的id自動使用對應的圖像加載器。id:url,相對路徑,絕對路徑等。註意一個問題,就是跨域的問題,我最開始用他的例子,https的頁面,去請求一個http協議的dicom,報錯了,跨域的問題,最終用到我自己的項目中,沒有跨域,所以沒有問題。

2.服務端使用,本地使用是會報錯的,因為本地是沒有域的概念存在的,所以同一域也不存在,報各種錯誤,在服務端正常運行。

3他的幾個例子代碼相對邏輯不復雜,但是如果你要深究源碼的話,那我估計是不可能的,我的項目調用了大約6.7個js,每一個js都有上萬行的代碼,先不說代碼量,代碼裏邊沒有註釋,隨便定義的一個變量,都搞得很復雜,我認為不需要了解具體實現,只要調用接口api。

具體的東西不能全部說完,需要自己去看,看懂流程,再去測試。qq 1151234457 可以交流,這個庫相當龐大,可以一起交流。

Cornerstone.js使用相關