nvcan_rc_regress_d02_container.html


<html>
<head>
  <link rel="stylesheet" type="text/css" href="extra_info/styles.css" />
  <script src="./assets/niivue_afni.umd.js"> </script>
  <script type="text/javascript">

    /* show/hide olay in NV (for align checks)
        obj : NV object ID
        bid : button ID in that object's NV canvas
    */
    function niivue_ShowHideOlay(obj, bid) {
      let element = document.getElementById(bid);
      if (obj.volumes[1].opacity) {
        obj.setOpacity(1, 0);
        element.innerText = "View Olay";
      } else {
        obj.setOpacity(1, 1);
        element.innerText = "Hide Olay";
      }
    }

    // used for string formatting numbers (C Rorden), below
    function flt2str0(flt, ndec = 0) {
      //retain trailing zero
      return flt.toFixed(ndec); //return string
    }

    /* more string formatting numbers, below ... WITH directionality here,
       assuming the coords are what AFNI calls LPI (and what some other
       software call RAS); basically, L/P/I are neg coords, and R/A/S are
       positive.  
    */
    function flt2str0_dir(flt, ndec = 0, dir = '') {
      //retain trailing zero
      if (dir == '') {
        return flt.toFixed(ndec); //return string
      } else if (dir == 'RL') {
        let aflt = Math.abs(flt);
        let lab = (flt < 0) ? 'L' : 'R';
        return aflt.toFixed(ndec) + lab;
      } else if (dir == 'AP') {
        let aflt = Math.abs(flt);
        let lab = (flt < 0) ? 'P' : 'A';
        return aflt.toFixed(ndec) + lab;
      } else if (dir == 'IS') {
        let aflt = Math.abs(flt);
        let lab = (flt < 0) ? 'I' : 'S';
        return aflt.toFixed(ndec) + lab;
      } else {
        return '';
      }
    }

  </script>
</head>
<body>

<!-- start NiiVue canvas for: nvcan_rc_regress_d02 -->
<div class="class_niivue" id="nvcan_rc_regress_d02_container">
  <canvas id="nvcan_rc_regress_d02">
  </canvas>
  <footer id="nvcan_rc_regress_d02_xyz" style="color:#fff; ">
    &nbsp;
  </footer>
  <script>
    function reportCoorAndValues(data) {
      // coord str
      let x = flt2str0_dir(data.mm[0], 3, 'RL')
      let y = flt2str0_dir(data.mm[1], 3, 'AP')
      let z = flt2str0_dir(data.mm[2], 3, 'IS')
      let str_c = '&nbspxyz:[' + 
                  x.padStart(8).replace(/ /g, '&nbsp;') + ' ' +
                  y.padStart(8).replace(/ /g, '&nbsp;') + ' ' +
                  z.padStart(8).replace(/ /g, '&nbsp;') + '], '
      // value str (accommodate Olay/Thr being present or not)
      let u = flt2str0(data.values[0].value, 6)   // always have ulay
      let o = 'NA';
      let t = 'NA';
      if (data.values.length > 1) { // do we have olay?
        o = flt2str0(data.values[1].value, 6);
      }
      if (data.values.length > 2) { // do we have thr?
        t = flt2str0(data.values[2].value, 6);
      }
      let str_v = 'UOT:[' + 
                  u.padStart(12).replace(/ /g, '&nbsp;') + ' ' + 
                  o.padStart(12).replace(/ /g, '&nbsp;') + ' ' + 
                  t.padStart(12).replace(/ /g, '&nbsp;') + ']' 
      document.getElementById('nvcan_rc_regress_d02_xyz').innerHTML = str_c + str_v;
    }

    const nvobj_rc_regress_d02 = new niivue.Niivue(
      { logging: true, 
        show3Dcrosshair: true,
        onLocationChange: reportCoorAndValues,
      }
    )
    nvobj_rc_regress_d02.opts.isColorbar = false; // just use from HTML
    nvobj_rc_regress_d02.opts.sagittalNoseLeft = true;
    nvobj_rc_regress_d02.opts.isRadiologicalConvention = false;
    nvobj_rc_regress_d02.opts.isCornerOrientationText = true;
    nvobj_rc_regress_d02.attachTo('nvcan_rc_regress_d02');
    nvobj_rc_regress_d02.loadVolumes([
      { // ulay
        url:"./MNI152_2009_template_SSW.nii.gz",
        cal_max: 1188.66396,
      }, { // olay
        url:"./radcor.pb05.regress/radcor.20.d02.errts.corr+tlrc.HEAD",
        frame4D: 0,  // idx of vol
        colormap: "afni_reds_inv",
        colormapNegative: "afni_blues_inv",
        cal_min: 0,
        cal_max: 0.7,
        opacity: 1.0,
      }, { // thr
        url:"./radcor.pb05.regress/radcor.20.d02.errts.corr+tlrc.HEAD",  // same dset as olay
        frame4D: 0,  // idx of vol
        colormap: "blue",
        colormapNegative: "blue",
        cal_min: 0,
        cal_max: 0.4,
        opacity: 0,
      }
    ]).then(()=>{ // more actions
      if ( nvobj_rc_regress_d02.volumes.length > 1 ) {
        nvobj_rc_regress_d02.volumes[1].alphaThreshold = true; // alpha for olay
      }
      nvobj_rc_regress_d02.overlayOutlineWidth = 0;
      nvobj_rc_regress_d02.opts.multiplanarForceRender = true;
      nvobj_rc_regress_d02.backgroundMasksOverlays = true;
      nvobj_rc_regress_d02.setModulationImage(
        nvobj_rc_regress_d02.volumes[1].id,
        nvobj_rc_regress_d02.volumes[2].id,
        modulateAlpha = 2.0 
      ); // activate+specify mapping
      nvobj_rc_regress_d02.scene.crosshairPos = nvobj_rc_regress_d02.mm2frac([-1, -18, 25.0]); // jump to XYZ
      nvobj_rc_regress_d02.updateGLVolume();
    })
  </script>
</div>
</body>
</html>