官網地址:https://github.com/chafey/cornerstone
前端
簡介:git
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.github
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.web
基石是一個開源項目,目標是提供一個完整的基於網絡的醫學成像平臺。該存儲庫包含Cornerstone核心組件,它是一個輕量級的JavaScript庫,用於在支持HTML5 canvas元素的現代Web瀏覽器中顯示醫學圖像。Cornerstone Core並不意味着是一個完整的應用程序自己,而是一個能夠用做更大更復雜應用程序的一部分的組件。有關使用各類Cornerstone庫構建簡單的學習查看器的示例,請參閱 OHIF Viewer。canvas
Cornerstone Core與用於存儲圖像像素的實際容器以及用於獲取圖像數據的傳輸機制無關。事實上,Cornerstone Core自己沒法讀取/解析或加載圖像,而是依賴於一個或多個ImageLoaders來運行。這裏的目標是避免限制開發人員在單個容器和傳輸(例如DICOM)中工做,由於圖像以各類格式(包括專有)存儲。經過提供關於容器和運輸的靈活性,能夠得到最高性能的圖像顯示,由於不須要轉換到替代容器或運輸。但願開發人員有權使用任何類型的傳輸從任何類型的圖像容器加載圖像。api
這是關於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 app
微雲的技術文檔:http://www.weiyunyingxiang.com/artical8.htm。沒有什麼具體的分享,可是有一個大概的思路。後來開始看cornerstone的Github連接,網上沒有什麼這方面的資料,看了一些網站都是用這個庫作的,這個庫並不能知足需求,其中的一些例子只是一些操做,可是如何把dicom繪製到canvas上並無找到,有個例子,他是把dicom圖像直接解析成Base64編碼,直接一個字符串顯示好幾十行的編碼,並無解析顯示的具體操做,後來偶然間點擊到了另一個庫,也是基石相關的,可是能夠解決實際問題 。
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。
具體的東西不能所有說完,須要本身去看,看懂流程,再去測試。有問題留言 我會隨時看的