Merge pull request #9 from dcmjs-org/migrating-to-scoord3d

Migrating to scoord3d

Author: hackermd

.gitignore

@@ -61,4 +61,5 @@ typings/
 .next
 node_modules/
 build/
-yarn.lock
+yarn.lock
+.vscode/

src/api.js

@@ -31,34 +31,34 @@ import {
   Polyline,
   Circle,
   Ellipse
-} from './scoord.js';
+} from './scoord3d.js';
 
 import DICOMwebClient from 'dicomweb-client/build/dicomweb-client.js'
 
 
-function _geometry2Scoord(geometry) {
+function _geometry2Scoord3d(geometry) {
   const type = geometry.getType();
   if (type === 'Point') {
     let coordinates = geometry.getCoordinates();
-    coordinates = _geometryCoordinates2scoordCoordinates(coordinates);
+    coordinates = _geometryCoordinates2scoord3dCoordinates(coordinates);
     return new Point(coordinates);
   } else if (type === 'Polygon') {
     /*
      * The first linear ring of the array defines the outer-boundary (surface).
      * Each subsequent linear ring defines a hole in the surface.
      */
     let coordinates = geometry.getCoordinates()[0].map(c => {
-      return _geometryCoordinates2scoordCoordinates(c);
+      return _geometryCoordinates2scoord3dCoordinates(c);
     });
     return new Polyline(coordinates);
   } else if (type === 'LineString') {
     let coordinates = geometry.getCoordinates().map(c => {
-      return _geometryCoordinates2scoordCoordinates(c);
+      return _geometryCoordinates2scoord3dCoordinates(c);
     });
     return new Polyline(coordinates);
   } else if (type === 'Circle') {
     // TODO: Circle may actually represent a Polyline
-    let center = _geometryCoordinates2scoordCoordinates(geometry.getCenter());
+    let center = _geometryCoordinates2scoord3dCoordinates(geometry.getCenter());
     let radius = geometry.getRadius();
     return new Circle(center, radius);
   } else {
@@ -68,41 +68,38 @@ function _geometry2Scoord(geometry) {
 }
 
 
-function _scoord2Geometry(scoord) {
-  const type = scoord.graphicType;
-  const data = scoord.graphicData;
+function _scoord3d2Geometry(scoord3d) {
+  const type = scoord3d.graphicType;
+  const data = scoord3d.graphicData;
+  console.log(data)
   if (type === 'POINT') {
-    let coordinates = _scoordCoordinates2geometryCoordinates(data);
+    let coordinates = _scoord3dCoordinates2geometryCoordinates(data);
     return new PointGeometry(coordinates);
   } else if (type === 'POLYLINE') {
     const coordinates = data.map(d => {
-      return _scoordCoordinates2geometryCoordinates(d);
+      return _scoord3dCoordinates2geometryCoordinates(d);
     });
-    let isClosed = (
-      data[0][0] === data[data.length-1][0] &&
-      data[0][1] === data[data.length-1][1]
-    );
-    if (isClosed) {
-      // Polygon requires inner linear ring and an outer ring.
-      return new PolygonGeometry([coordinates]);
-    } else {
-      return new LineStringGeometry(coordinates);
-    }
+    return new LineStringGeometry(coordinates);
+  } else if(type === 'POLYGON'){
+    const coordinates = data.map(d => {
+      return _scoord3dCoordinates2geometryCoordinates(d);
+    });
+    return new PolygonGeometry([coordinates]);
   } else if (type === 'CIRCLE') {
-    let center = _scoordCoordinates2geometryCoordinates(scoord.centerCoordinates);
-    let radius = scoord.radius;
+    let center = _scoord3dCoordinates2geometryCoordinates(scoord3d.centerCoordinates);
+    let radius = scoord3d.radius;
     return new CircleGeometry(center, radius);
   } else {
     console.error(`unsupported graphic type "${type}"`)
   }
 }
 
 
-function _geometryCoordinates2scoordCoordinates(coordinates) {
+function _geometryCoordinates2scoord3dCoordinates(coordinates) {
   return [coordinates[0] + 1, -coordinates[1]]
 }
 
-function _scoordCoordinates2geometryCoordinates(coordinates) {
+function _scoord3dCoordinates2geometryCoordinates(coordinates) {
   return [coordinates[0] - 1, -coordinates[1]]
 }
 
@@ -120,17 +117,6 @@ function coordinateFormatFunction(coordinates, pyramid) {
   return(coordinates);
 }
 
-function _getROIByFeature(feature, pyramid, coordinateSystem) {
-  const geometry = feature.getGeometry();
-  let scoord = _geometry2Scoord(geometry);
-  if(pyramid !== undefined && coordinateSystem === 'mm'){
-    scoord = coordinateFormatFunction(scoord.coordinates, pyramid);
-  }
-  const properties = feature.getProperties();
-  delete properties["geometry"];
-  return new ROI({ scoord, properties, coordinateSystem });
-}
-
 const _usewebgl = Symbol('usewebgl');
 const _map = Symbol('map');
 const _features = Symbol('features');
@@ -723,13 +709,12 @@ class VLWholeSlideMicroscopyImageViewer {
     return this[_interaction].modify !== undefined;
   }
 
-  getAllROIs(coordinateSystem='totalPixelMatrix') {
-    const features = this[_features];
+  getAllROIs() {
     let rois = [];
-    if (features !== undefined) {
-      features.forEach(feature => {
-        rois.push(_getROIByFeature(feature, this.pyramid , coordinateSystem));
-      });
+    if (this.numberOfROIs > 0) {
+      for(let index = 0; index < this.numberOfROIs; index++){
+        rois.push(this.getROI(index));
+      }
     }
     return rois;
   }
@@ -738,33 +723,43 @@ class VLWholeSlideMicroscopyImageViewer {
     return this[_features].getLength();
   }
 
-  getROI(index, coordinateSystem='totalPixelMatrix') {
+  getROI(index) {
     const feature = this[_features].item(index);
     let roi = {};
-    if (feature !== undefined) {
-      roi = _getROIByFeature(feature, this.pyramid, coordinateSystem);
+    if (feature !== undefined) {      
+      const geometry = feature.getGeometry();
+      let scoord3d = _geometry2Scoord3d(geometry);
+      // This is to uniform the ROI format in an array of arrays. When it is a point the representation
+      // is a single array with x and y coords
+      if(scoord3d.coordinates.length === 2){
+        scoord3d.coordinates = [scoord3d.coordinates]
+      }
+      scoord3d.coordinates.map(coord => {return coordinateFormatFunction(coord, this.pyramid)});           
+      const properties = feature.getProperties();
+      delete properties['geometry'];
+      return new ROI({scoord3d, properties});
     }
     return roi;
   }
 
   popROI() {
     const feature = this[_features].pop();
     const geometry = feature.getGeometry()
-    const scoord = _geometry2Scoord(geometry);
+    const scoord3d = _geometry2Scoord3d(geometry);
     const properties = feature.getProperties();
     delete properties['geometry'];
-    return new ROI({scoord, properties});
+    return new ROI({scoord3d, properties});
   }
 
   addROI(item) {
-    const geometry = _scoord2Geometry(item.scoord);
+    const geometry = _scoord3d2Geometry(item.scoord3d);
     const feature = new Feature(geometry);
     feature.setProperties(item.properties, true);
     this[_features].push(feature);
   }
 
   updateROI(index, item) {
-    const geometry = _scoord2Geometry(item.scoord);
+    const geometry = _scoord3d2Geometry(item.scoord3d);
     const feature = new Feature(geometry);
     feature.setProperties(item.properties, true);
     this[_features].setAt(index, feature);

src/dicom-microscopy-viewer.js

@@ -6,12 +6,12 @@ import {
   Polyline,
   Circle,
   Ellipse,
-} from './scoord.js';
+} from './scoord3d.js';
 
 let api = {
   VLWholeSlideMicroscopyImageViewer,
 };
-let scoord = {
+let scoord3d = {
   Point,
   Multipoint,
   Polyline,
@@ -22,4 +22,4 @@ let roi = {
   ROI,
 }
 
-export { api, scoord, roi };
+export { api, scoord3d, roi };

src/roi.js

@@ -3,16 +3,15 @@
 class ROI {
 
   /* @constructor
-   * @param{Scoord} scoord spatial coordinates
+   * @param{Scoord3D} scoord3d spatial coordinates
    * @param{Object} properties qualititative evaluations
    */
   constructor(options) {
-    if (!('scoord' in options)) {
+    if (!('scoord3d' in options)) {
       console.error('spatial coordinates are required for ROI')
     }
-    this.scoord = options.scoord;
+    this.scoord3d = options.scoord3d;
     this.properties = options.properties ? options.properties : {};
-    this.coordinateSystem = options.coordinateSystem;
   }
 
 }

src/scoord.js renamed to src/scoord3d.js

@@ -2,7 +2,7 @@
  * Spatial coordinates of a geometric region of interest (ROI) in the DICOM
  * image coordinate system.
  */
-class Scoord {
+class Scoord3D {
 
   constructor() {}
 
@@ -14,21 +14,17 @@ class Scoord {
     throw new Error('Propotype property "graphicType" must be implemented.');
   }
 
-  get pixelOriginInterpretation() {
-    // FRAME or VOLUME
-    /* TODO: Consider relative to frame instead of total pixel matrix.
-     * This would complicate scenarios where graphics span multiple frames.
-     */
-    return 'VOLUME';
+  get referencedFrameOfReferenceUID() {
+    throw new Error('Propotype property "referencedFrameOfReferenceUID" must be implemented.');
+  }
+  
+  get fiducialUID() {
+    throw new Error('Propotype property "fiducialUID" must be implemented.');    
   }
-
-  // get fiducialUID() {
-  // }
 
 }
 
-
-class Point extends Scoord {
+class Point extends Scoord3D {
 
   constructor(coordinates) {
     super()
@@ -46,7 +42,7 @@ class Point extends Scoord {
 }
 
 
-class Multipoint extends Scoord {
+class Multipoint extends Scoord3D {
 
   constructor(coordinates) {
     super()
@@ -64,7 +60,7 @@ class Multipoint extends Scoord {
 }
 
 
-class Polyline extends Scoord {
+class Polyline extends Scoord3D {
 
   constructor(coordinates) {
     super()
@@ -88,8 +84,31 @@ class Polyline extends Scoord {
 
 }
 
+class Polygon extends Scoord3D {
+
+  constructor(coordinates) {
+    super()
+    this.coordinates = coordinates
+  }
+
+  get graphicData() {
+    /*
+     * A polygon is defined a series of connected line segments with ordered vertices 
+     * denoted by (x,y,z) triplets, where the first and last vertices shall be the same 
+     * forming a polygon; the points shall be coplanar
+     */
+    // TODO: sort coordinates, make sure that the first and last vertices are the same
+    return this.coordinates;
+  }
+
+  get graphicType() {
+    return 'POLYGON';
+  }
+
+}
+
 
-class Circle extends Scoord {
+class Circle extends Scoord3D {
 
   constructor(centerCoordinates, radius) {
     super()
@@ -115,7 +134,7 @@ class Circle extends Scoord {
 }
 
 
-class Ellipse extends Scoord {
+class Ellipse extends Scoord3D {
 
   constructor(majorAxisEndpointCoordinates, minorAxisEndpointCoordinates) {
     super()
@@ -143,5 +162,5 @@ class Ellipse extends Scoord {
 }
 
 
-export { Point, Multipoint, Polyline, Circle, Ellipse };
+export { Point, Multipoint, Polyline, Polygon, Circle, Ellipse };
 

test/api.spec.js

@@ -1,6 +1,5 @@
 const chai = require('chai');
 const assert = require('assert');
-const roi = require
 
 chai.should();
 
@@ -35,15 +34,15 @@ describe('dicomMicroscopyViewer.api.VLWholeSlideMicroscopyImageViewer', ()=> {
             [20967.16433027939, 16899.356324511322],
             [18802.104222888596, 17666.917976278484]
         ];
-        const scoord = {
+        const scoord3d = {
             coordinates: coordinates,
             graphicData : coordinates,
             graphicType: "POLYLINE"
         };        
         let properties = {};
-        const roi = new dicomMicroscopyViewer.roi.ROI({scoord, properties});
+        const roi = new dicomMicroscopyViewer.roi.ROI({scoord3d, properties});
         viewer.addROI(roi);
-        assert.deepEqual(viewer.getROI(0).coordinateSystem, 'totalPixelMatrix');
-        assert.deepEqual(viewer.getROI(0).scoord.coordinates, coordinates);
+        console.log(viewer.getROI(0))
+        assert.deepEqual(viewer.getROI(0).scoord3d.coordinates, coordinates);
     })
 });