NgDicomViewer
NgDicomViewer is an Angular application(Single Page Application) built on top of the open source Javascript / HTML5 libraries provided by the DWV project. Predominantly made to view DICOM images on HTML 5 canvas on modern browsers without using any windowed plugins.
Not fully DICOM compliant, see Dicom-Support for details
For Demo please click
All coding/implementation contributions and comments are welcome.
Usage
Make sure to load AngularJS first, and then NgDicomViewer-mini.js. Also include openjpeg to open jpg compressed image.
The module is named ngdicomviewer. To enable it, you must simply list it as a dependency in your app. Example:
var app = angular.module('app', ['ngdicomviewer', ...]);
You can then use it in your templates like so:
<html ng-app='app'>
...
<body>
...
<dicomviewer class ="dicom" fileutilityid ="fileinput" urllistid="urltxt" urlopenbtnid="urlbtn">
</dicomviewer>
</body>
</html>
Attributes in dicomviewer tag:
1)fileutilityid : id of input tag of type file to open local dicom file
2)urllistid : id of input text for getting url list separated by ';'
3)urlopenbtnid : button id to open images from url in the above
Scope Variables:
1)Tool : Object To See available Tool Names which can be used to set them in selecting one
"Tool.ButtonBasedTools" Returns Available Button based Tool name list
"Tool.MouseBasedTools" Returns Available Mouse based Tool name list
2)SelectedButtonTool : setting the value same as available in list will apply the tool to opened image
3)SelectedMouseTool : setting the value same as available in list will apply the tool on mouse operation on the image
4)SelectedColor : Any html Colour which can be setted the annotation colour
5)Colours : list of recommended colours for the annotation
6)PatientName : Opened image PatientName
7)PatientId : Opened image PatientId
8)WWidth : current Window Width of image
9)WCenter : current Window Centre of image
10)Rmin,Rmax : min and max value for the threshold filter tool that can be applied on the image
11) Tval : Object
"Tval.min" specify threshold filter tool min to be applied on image
"Tval.max" specify threshold filter tool max to be applied on image
For more Details see Example.html
Source project
Released under MIT licence
==========================
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent