fix: 🐛 Move to orthographic projection for View2D (#61)

Author: JamesAPetts

examples/VTKCrosshairsExample.js

@@ -77,21 +77,21 @@ class VTKCrosshairsExample extends Component {
     return (
       <>
         <div className="row">
-          <div className="col-xs-12">
+          <div className="col-xs-6">
             <p>
               This example demonstrates how to use the Crosshairs manipulator.
             </p>
           </div>
         </div>
         <div className="row">
-          <div className="col-xs-12 col-sm-6">
+          <div className="col-xs-6 col-xs-6">
             <View2D
               volumes={this.state.volumes}
               onCreated={this.storeApi(2)}
               orientation={{ sliceNormal: [0, 1, 0], viewUp: [0, 0, 1] }}
             />
           </div>
-          <div className="col-xs-12 col-sm-6">
+          <div className="col-xs-6 col-xs-6">
             <View2D
               volumes={this.state.volumes}
               onCreated={this.storeApi(1)}
@@ -101,7 +101,7 @@ class VTKCrosshairsExample extends Component {
         </div>
 
         <div className="row">
-          <div className="col-xs-12 col-sm-6">
+          <div className="col-xs-6 col-xs-6">
             <View2D
               volumes={this.state.volumes}
               onCreated={this.storeApi(0)}

package.json

@@ -23,7 +23,7 @@
   "peerDependencies": {
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
-    "vtk.js": "^11.6.0"
+    "vtk.js": "^11.7.1"
   },
   "dependencies": {
     "date-fns": "^2.2.1",
@@ -81,7 +81,7 @@
     "style-loader": "^0.23.1",
     "stylelint": "^10.1.0",
     "stylelint-config-recommended": "^2.2.0",
-    "vtk.js": "^11.6.0",
+    "vtk.js": "^11.7.1",
     "webpack": "4.34.0",
     "webpack-cli": "^3.3.4",
     "webpack-dev-server": "^3.8.0",

src/VTKViewport/View2D.js

@@ -186,6 +186,11 @@ export default class View2D extends Component {
       istyle.setSliceNormal(0, 0, 1);
     }
 
+    const camera = this.renderer.getActiveCamera();
+
+    camera.setParallelProjection(true);
+    this.renderer.resetCamera();
+
     istyle.setVolumeMapper(istyleVolumeMapper);
     const range = istyle.getSliceRange();
     istyle.setSlice((range[0] + range[1]) / 2);

yarn.lock

@@ -13602,10 +13602,10 @@ vm-browserify@^1.0.1:
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.0.tgz#bd76d6a23323e2ca8ffa12028dc04559c75f9019"
   integrity sha512-iq+S7vZJE60yejDYM0ek6zg308+UZsdtPExWP9VZoCFCz1zkJoXFnAX7aZfd/ZwrkidzdUZL0C/ryW+JwAiIGw==
 
-vtk.js@^11.6.0:
-  version "11.6.0"
-  resolved "https://registry.yarnpkg.com/vtk.js/-/vtk.js-11.6.0.tgz#a30f95cfb138453890bd85f5bca88c53ed7c2775"
-  integrity sha512-emkpLZVsuaSPLrVsbaosdD5RQQmal4PPfVotDIWb58aBbswXYt4pliaY3EDFNW3nTsKPs9ttadM4f4n8fVWVbQ==
+vtk.js@^11.7.1:
+  version "11.7.1"
+  resolved "https://registry.yarnpkg.com/vtk.js/-/vtk.js-11.7.1.tgz#e9527c75d84e292c5d25fc4cacf62d42c777930e"
+  integrity sha512-r6KTDYRF+XBq8gvoi27HJs+1DN4E39FX1k9i15el6JXRuZQebnBjWZ0W8XlfM8Nc6AAAax6DdauBFZdhyG0s/Q==
   dependencies:
     blueimp-md5 "2.10.0"
     commander "2.11.0"