@niivue/niivue 0.24.3 → 0.26.2

package/src/nvimage.js

@@ -52,7 +52,8 @@ export function NVImage(
   ignoreZeroVoxels = false,
   visible = true,
   isDICOMDIR = false,
-  useQFormNotSForm = false
+  useQFormNotSForm = false,
+  colorMapNegative = ""
 ) {
   // https://nifti.nimh.nih.gov/pub/dist/src/niftilib/nifti1.h
   this.DT_NONE = 0;
@@ -84,7 +85,9 @@ export function NVImage(
   this.percentileFrac = percentileFrac;
   this.ignoreZeroVoxels = ignoreZeroVoxels;
   this.trustCalMinMax = trustCalMinMax;
+  this.colorMapNegative = colorMapNegative;
   this.visible = visible;
+  this.modulationImage = null;
   this.series = []; // for concatenating dicom images
 
   // Added to support zerosLike
@@ -381,7 +384,36 @@ export function NVImage(
   this.calMinMax();
 }
 
+NVImage.prototype.computeObliqueAngle = function (mtx44) {
+  //https://github.com/afni/afni/blob/25e77d564f2c67ff480fa99a7b8e48ec2d9a89fc/src/thd_coords.c#L717
+  let mtx = mat4.clone(mtx44);
+  mat4.transpose(mtx, mtx44);
+  let dxtmp = Math.sqrt(mtx[0] * mtx[0] + mtx[1] * mtx[1] + mtx[2] * mtx[2]);
+  let xmax =
+    Math.max(Math.max(Math.abs(mtx[0]), Math.abs(mtx[1])), Math.abs(mtx[2])) /
+    dxtmp;
+  let dytmp = Math.sqrt(mtx[4] * mtx[4] + mtx[5] * mtx[5] + mtx[6] * mtx[6]);
+  let ymax =
+    Math.max(Math.max(Math.abs(mtx[4]), Math.abs(mtx[5])), Math.abs(mtx[6])) /
+    dytmp;
+  let dztmp = Math.sqrt(mtx[8] * mtx[8] + mtx[9] * mtx[9] + mtx[10] * mtx[10]);
+  let zmax =
+    Math.max(Math.max(Math.abs(mtx[8]), Math.abs(mtx[9])), Math.abs(mtx[10])) /
+    dztmp;
+  let fig_merit = Math.min(Math.min(xmax, ymax), zmax);
+  let oblique_angle = Math.abs((Math.acos(fig_merit) * 180.0) / 3.141592653);
+  if (oblique_angle > 0.01)
+    console.log(
+      "Warning voxels not aligned with world space: " +
+        oblique_angle +
+        " degrees from plumb.\n"
+    );
+  else oblique_angle = 0.0;
+  return oblique_angle;
+};
+
 NVImage.prototype.calculateOblique = function () {
+  this.oblique_angle = this.computeObliqueAngle(this.matRAS);
   let LPI = this.vox2mm([0.0, 0.0, 0.0], this.matRAS);
   let X1mm = this.vox2mm([1.0 / this.pixDimsRAS[1], 0.0, 0.0], this.matRAS);
   let Y1mm = this.vox2mm([0.0, 1.0 / this.pixDimsRAS[2], 0.0], this.matRAS);
@@ -414,6 +446,28 @@ NVImage.prototype.calculateOblique = function () {
   let maxShear = Math.max(Math.max(XY, XZ), YZ);
   if (maxShear > 0.1)
     log.debug("Warning: shear detected (gantry tilt) of %f degrees", maxShear);
+  //compute a matrix to transform vectors from factional space to mm:
+  let dim = vec4.fromValues(
+    this.dimsRAS[1],
+    this.dimsRAS[2],
+    this.dimsRAS[3],
+    1
+  );
+  let sform = mat4.clone(this.matRAS);
+  mat4.transpose(sform, sform);
+  let shim = vec4.fromValues(-0.5, -0.5, -0.5, 0); //bitmap with 5 voxels scaled 0..1, voxel centers are 0.1,0.3,0.5,0.7,0.9
+  mat4.translate(sform, sform, shim);
+  //mat.mat4.scale(sform, sform, dim);
+  sform[0] *= dim[0];
+  sform[1] *= dim[0];
+  sform[2] *= dim[0];
+  sform[4] *= dim[1];
+  sform[5] *= dim[1];
+  sform[6] *= dim[1];
+  sform[8] *= dim[2];
+  sform[9] *= dim[2];
+  sform[10] *= dim[2];
+  this.frac2mm = mat4.clone(sform);
 };
 
 NVImage.prototype.THD_daxes_to_NIFTI = function (
@@ -2206,6 +2260,7 @@ NVImage.loadFromUrl = async function ({
   percentileFrac = 0.02,
   ignoreZeroVoxels = false,
   visible = true,
+  colorMapNegative = "",
 } = {}) {
   if (url === "") {
     throw Error("url must not be empty");
@@ -2251,7 +2306,10 @@ NVImage.loadFromUrl = async function ({
       trustCalMinMax,
       percentileFrac,
       ignoreZeroVoxels,
-      visible
+      visible,
+      false,
+      false,
+      colorMapNegative
     );
   } else {
     alert("Unable to load buffer properly from volume");
@@ -2589,27 +2647,23 @@ function getExtents(positions, forceOriginInVolume = true) {
  */
 NVImage.prototype.toNiivueObject3D = function (id, gl) {
   //cube has 8 vertices: left/right, posterior/anterior, inferior/superior
-  let LPI = this.vox2mm([0.0, 0.0, 0.0], this.matRAS);
-  //TODO: ray direction needs to be corrected for oblique rotations
-  let LAI = this.vox2mm([0.0, this.dimsRAS[2] - 1, 0.0], this.matRAS);
-  let LPS = this.vox2mm([0.0, 0.0, this.dimsRAS[3] - 1], this.matRAS);
-  let LAS = this.vox2mm(
-    [0.0, this.dimsRAS[2] - 1, this.dimsRAS[3] - 1],
-    this.matRAS
-  );
-  let RPI = this.vox2mm([this.dimsRAS[1] - 1, 0.0, 0.0], this.matRAS);
-  let RAI = this.vox2mm(
-    [this.dimsRAS[1] - 1, this.dimsRAS[2] - 1, 0.0],
-    this.matRAS
-  );
-  let RPS = this.vox2mm(
-    [this.dimsRAS[1] - 1, 0.0, this.dimsRAS[3] - 1],
-    this.matRAS
-  );
-  let RAS = this.vox2mm(
-    [this.dimsRAS[1] - 1, this.dimsRAS[2] - 1, this.dimsRAS[3] - 1],
-    this.matRAS
-  );
+  //n.b. voxel coordinates are from VOXEL centers
+  // add/subtract 0.5 to get full image field of view
+  let L = -0.5;
+  let P = -0.5;
+  let I = -0.5;
+  let R = this.dimsRAS[1] - 1 + 0.5;
+  let A = this.dimsRAS[2] - 1 + 0.5;
+  let S = this.dimsRAS[3] - 1 + 0.5;
+
+  let LPI = this.vox2mm([L, P, I], this.matRAS);
+  let LAI = this.vox2mm([L, A, I], this.matRAS);
+  let LPS = this.vox2mm([L, P, S], this.matRAS);
+  let LAS = this.vox2mm([L, A, S], this.matRAS);
+  let RPI = this.vox2mm([R, P, I], this.matRAS);
+  let RAI = this.vox2mm([R, A, I], this.matRAS);
+  let RPS = this.vox2mm([R, P, S], this.matRAS);
+  let RAS = this.vox2mm([R, A, S], this.matRAS);
 
   let posTex = [
     //spatial position (XYZ), texture coordinates UVW
@@ -2712,7 +2766,6 @@ NVImage.prototype.toNiivueObject3D = function (id, gl) {
     indexBuffer,
     vao
   );
-
   const extents = getExtents([
     ...LPS,
     ...RPS,
@@ -2723,10 +2776,56 @@ NVImage.prototype.toNiivueObject3D = function (id, gl) {
     ...RAI,
     ...RPI,
   ]);
-  obj3D.extentsMin = extents.min;
-  obj3D.extentsMax = extents.max;
+  obj3D.extentsMin = extents.min.slice();
+  obj3D.extentsMax = extents.max.slice();
+
   obj3D.furthestVertexFromOrigin = extents.furthestVertexFromOrigin;
   obj3D.originNegate = vec3.clone(extents.origin);
   vec3.negate(obj3D.originNegate, obj3D.originNegate);
+  /*
+  let matDeOblique = mat4.fromValues(
+    this.pixDimsRAS[1],
+    0,
+    0,
+    this.matRAS[3],
+    0,
+    this.pixDimsRAS[2],
+    0,
+    this.matRAS[7],
+    0,
+    0,
+    this.pixDimsRAS[3],
+    this.matRAS[11],
+    0,
+    0,
+    0,
+    1
+  );
+  LPI = this.vox2mm([L,P,I], matDeOblique);
+  LAI = this.vox2mm([L,A,I], matDeOblique);
+  LPS = this.vox2mm([L,P,S], matDeOblique);
+  LAS = this.vox2mm([L,A,S], matDeOblique);
+  RPI = this.vox2mm([R,P,I], matDeOblique);
+  RAI = this.vox2mm([R,A,I], matDeOblique);
+  RPS = this.vox2mm([R,P,S], matDeOblique);
+  RAS = this.vox2mm([R,A,S], matDeOblique);
+  const extentsDeOblique = getExtents([
+    ...LPS,
+    ...RPS,
+    ...RAS,
+    ...LAS,
+    ...LPI,
+    ...LAI,
+    ...RAI,
+    ...RPI,
+  ]);
+  obj3D.extentsDeObliqueMin = extentsDeOblique.min.slice();
+  obj3D.extentsDeObliqueMax = extentsDeOblique.max.slice();
+*/
+  obj3D.fieldOfViewDeObliqueMM = [
+    this.dimsRAS[1] * this.pixDimsRAS[1],
+    this.dimsRAS[2] * this.pixDimsRAS[2],
+    this.dimsRAS[3] * this.pixDimsRAS[3],
+  ];
   return obj3D;
 };

package/src/shader-srcs.js

@@ -130,12 +130,13 @@ void main() {
 	while (samplePos.a <= len) {
 		vec4 colorSample = texture(volume, samplePos.xyz);
 		samplePos += deltaDir; //advance ray position
-		if (colorSample.a < 0.01) continue;
-		if (firstHit.a > lenNoClip)
-			firstHit = samplePos;
-		backNearest = min(backNearest, samplePos.a);
-		if (colorSample.a > colAcc.a) //ties generate errors for TT_desai_dd_mpm
-			colAcc = vec4(colorSample.rgb, colorSample.a+0.00001);
+		if (colorSample.a >= 0.01) {
+			if (firstHit.a > lenNoClip)
+				firstHit = samplePos;
+			backNearest = min(backNearest, samplePos.a);
+			if (colorSample.a > colAcc.a) //ties generate errors for TT_desai_dd_mpm
+				colAcc = vec4(colorSample.rgb, colorSample.a+0.00001);
+		}
 	}
 	if (firstHit.a < len)
 		gl_FragDepth = frac2ndc(firstHit.xyz);
@@ -171,15 +172,16 @@ void main() {
 	while (samplePos.a <= len) {
 		vec4 colorSample = texture(overlay, samplePos.xyz);
 		samplePos += deltaDir; //advance ray position
-		if (colorSample.a < 0.01) continue;
-		if (overFirstHit.a > len)
-			overFirstHit = samplePos;
-		colorSample.a = 1.0-pow((1.0 - colorSample.a), opacityCorrection);
-		colorSample.rgb *= colorSample.a;
-		colAcc= (1.0 - colAcc.a) * colorSample + colAcc;
-		overFarthest = samplePos.a;
-		if ( colAcc.a > earlyTermination )
-			break;
+		if (colorSample.a >= 0.01) {
+			if (overFirstHit.a > len)
+				overFirstHit = samplePos;
+			colorSample.a = 1.0-pow((1.0 - colorSample.a), opacityCorrection);
+			colorSample.rgb *= colorSample.a;
+			colAcc= (1.0 - colAcc.a) * colorSample + colAcc;
+			overFarthest = samplePos.a;
+			if ( colAcc.a > earlyTermination )
+				break;
+		}
 	}
 	if (overFirstHit.a < firstHit.a)
 	//if (overFirstHit.a < len)
@@ -231,6 +233,10 @@ float frac2ndc(vec3 frac) {
 	
 }
 void main() {
+  if (fColor.x > 2.0) {
+    fColor = vec4(1.0, 0.0, 0.0, 0.5);
+    return;
+  }
 	fColor = vec4(0.0,0.0,0.0,0.0);
 	vec4 clipPlaneColorX = clipPlaneColor;
 	//if (clipPlaneColor.a < 0.0)
@@ -266,19 +272,23 @@ void main() {
 	vec4 deltaDirFast = vec4(dir.xyz * stepSizeFast, stepSizeFast);
 	while (samplePos.a <= len) {
 		float val = texture(volume, samplePos.xyz).a;
-		if (val > 0.01) break;
+    if (val > 0.01) {
+      break;
+    }
 		samplePos += deltaDirFast; //advance ray position
 	}
 	if ((samplePos.a >= len) && ((overlays < 1.0) || (backgroundMasksOverlays > 0))) {
-		if (isClip)
+    if (isClip){
 			fColor += clipPlaneColorX;
+    }
 		return;
 	}
 	fColor = vec4(1.0, 1.0, 1.0, 1.0);
 	//gl_FragDepth = frac2ndc(samplePos.xyz); //crude due to fast pass resolution
 	samplePos -= deltaDirFast;
-	if (samplePos.a < 0.0)
+  if (samplePos.a < 0.0){
 		vec4 samplePos = vec4(start.xyz, 0.0); //ray position
+  }
 	//end: fast pass
 	vec4 colAcc = vec4(0.0,0.0,0.0,0.0);
 	vec4 firstHit = vec4(0.0,0.0,0.0,2.0 * lenNoClip);
@@ -289,25 +299,29 @@ void main() {
 	while (samplePos.a <= len) {
 		vec4 colorSample = texture(volume, samplePos.xyz);
 		samplePos += deltaDir; //advance ray position
-		if (colorSample.a < 0.01) continue;
-		if (firstHit.a > lenNoClip)
-			firstHit = samplePos;
-		backNearest = min(backNearest, samplePos.a);
-		colorSample.a = 1.0-pow((1.0 - colorSample.a), opacityCorrection);
-		colorSample.rgb *= colorSample.a;
-		colAcc= (1.0 - colAcc.a) * colorSample + colAcc;
-		if ( colAcc.a > earlyTermination )
-			break;
+		if (colorSample.a >= 0.01) {
+			if (firstHit.a > lenNoClip)
+				firstHit = samplePos;
+			backNearest = min(backNearest, samplePos.a);
+			colorSample.a = 1.0-pow((1.0 - colorSample.a), opacityCorrection);
+			colorSample.rgb *= colorSample.a;
+			colAcc= (1.0 - colAcc.a) * colorSample + colAcc;
+			if ( colAcc.a > earlyTermination )
+				break;
+		}
 	}
-	if (firstHit.a < len)
+  if (firstHit.a < len){
 		gl_FragDepth = frac2ndc(firstHit.xyz);
+  }
 	colAcc.a = (colAcc.a / earlyTermination) * backOpacity;
 	fColor = colAcc;
 	//if (isClip) //CR
 	if ((isColorPlaneInVolume) && (clipPos.a != samplePos.a) && (abs(firstHit.a - clipPos.a) < deltaDir.a))
 		fColor.rgb = mix(fColor.rgb, clipPlaneColorX.rgb, abs(clipPlaneColor.a));
 		//fColor.rgb = mix(fColor.rgb, clipPlaneColorX.rgb, clipPlaneColorX.a * 0.65);
-	if (overlays < 1.0) return;
+  if (overlays < 1.0) {
+    return;
+  }
 	//overlay pass
 	len = lenNoClip;
 	samplePos = vec4(start.xyz, 0.0); //ray position
@@ -316,48 +330,56 @@ void main() {
 	deltaDirFast = vec4(dir.xyz * stepSizeFast, stepSizeFast);
 	while (samplePos.a <= len) {
 		float val = texture(overlay, samplePos.xyz).a;
-		if (val > 0.01) break;
+    if (val > 0.01) {
+      break;
+    }
 		samplePos += deltaDirFast; //advance ray position
 	}
 	if (samplePos.a >= len) {
-		if (isClip && (fColor.a == 0.0))
+    if (isClip && (fColor.a == 0.0)) {
 			fColor += clipPlaneColorX;
+    }
 		return;
 	}
 	samplePos -= deltaDirFast;
-	if (samplePos.a < 0.0)
+  if (samplePos.a < 0.0){
 		vec4 samplePos = vec4(start.xyz, 0.0); //ray position
+  }
 	//end: fast pass
 	float overFarthest = len;
 	colAcc = vec4(0.0, 0.0, 0.0, 0.0);
 	samplePos += deltaDir * ran; //jitter ray
 	vec4 overFirstHit = vec4(0.0,0.0,0.0,2.0 * len);
-	if (backgroundMasksOverlays > 0)
+  if (backgroundMasksOverlays > 0){
 		samplePos = firstHit;
+  }
 	while (samplePos.a <= len) {
 		vec4 colorSample = texture(overlay, samplePos.xyz);
 		samplePos += deltaDir; //advance ray position
-		if (colorSample.a < 0.01) continue;
-		if (overFirstHit.a > len)
-			overFirstHit = samplePos;
-		colorSample.a = 1.0-pow((1.0 - colorSample.a), opacityCorrection);
-		colorSample.rgb *= colorSample.a;
-		colAcc= (1.0 - colAcc.a) * colorSample + colAcc;
-		overFarthest = samplePos.a;
-		if ( colAcc.a > earlyTermination )
-			break;
+		if (colorSample.a >= 0.01) {
+			if (overFirstHit.a > len)
+				overFirstHit = samplePos;
+			colorSample.a = 1.0-pow((1.0 - colorSample.a), opacityCorrection);
+			colorSample.rgb *= colorSample.a;
+			colAcc= (1.0 - colAcc.a) * colorSample + colAcc;
+			overFarthest = samplePos.a;
+			if ( colAcc.a > earlyTermination )
+				break;
+		}
 	}
 	if (samplePos.a >= len) {
-		if (isClip && (fColor.a == 0.0))
+    if (isClip && (fColor.a == 0.0)){
 			fColor += clipPlaneColorX;
+    }
 		return;
 	}
 	//if (overFirstHit.a < len)
-		gl_FragDepth = frac2ndc(overFirstHit.xyz);
+	gl_FragDepth = frac2ndc(overFirstHit.xyz);
 	float overMix = colAcc.a;
 	float overlayDepth = 0.3;
-	if (fColor.a <= 0.0)
+  if (fColor.a <= 0.0){
 			overMix = 1.0;
+  }
 	else if (((overFarthest) > backNearest)) {
 		float dx = (overFarthest - backNearest)/1.73;
 		dx = fColor.a * pow(dx, overlayDepth);
@@ -373,15 +395,22 @@ layout(location=0) in vec3 pos;
 uniform int axCorSag;
 uniform float slice;
 uniform vec2 canvasWidthHeight;
+uniform vec3 panXYscale;
 uniform vec4 leftTopWidthHeight;
 out vec3 texPos;
 void main(void) {
 	//convert pixel x,y space 1..canvasWidth,1..canvasHeight to WebGL 1..-1,-1..1
 	vec2 frac;
-	frac.x = (leftTopWidthHeight.x + (pos.x * leftTopWidthHeight.z)) / canvasWidthHeight.x; //0..1
-	frac.y = 1.0 - ((leftTopWidthHeight.y + ((1.0 - pos.y) * leftTopWidthHeight.w)) / canvasWidthHeight.y); //1..0
+	vec3 vpos = pos;
+	frac.x = (leftTopWidthHeight.x + (vpos.x * leftTopWidthHeight.z)) / canvasWidthHeight.x; //0..1
+	frac.y = 1.0 - ((leftTopWidthHeight.y + ((1.0 - vpos.y) * leftTopWidthHeight.w)) / canvasWidthHeight.y); //1..0
+	//frac.x = pos.x; //0..1
+	//frac.y = pos.y; //1..0
+
 	frac = (frac * 2.0) - 1.0;
 	gl_Position = vec4(frac, 0.0, 1.0);
+	gl_Position.x += panXYscale.x;
+	gl_Position.y += panXYscale.y;
 	if (axCorSag == 1)
 		texPos = vec3(pos.x, slice, pos.y);
 	else if (axCorSag == 2)
@@ -432,7 +461,70 @@ void main() {
 	color.a = aout;
 }`;
 
-export var fragLineShader = `#version 300 es
+export var vertSliceMMShader = `#version 300 es
+#line 4
+layout(location=0) in vec3 pos;
+uniform int axCorSag;
+uniform mat4 mvpMtx;
+uniform mat4 frac2mm;
+uniform float slice;
+out vec3 texPos;
+void main(void) {
+	texPos = vec3(pos.x, pos.y, slice);
+	if (axCorSag > 1)
+		texPos = vec3(slice, pos.x, pos.y);
+  else if (axCorSag > 0)
+		texPos = vec3(pos.x, slice, pos.y);
+	vec4 mm = frac2mm * vec4(texPos, 1.0);
+	//vec4 mm =  vec4(texPos, 1.0) * frac2mm;
+	gl_Position = mvpMtx * mm;
+	//gl_Position = mm;
+}`;
+
+export var fragSliceMMShader = `#version 300 es
+#line 228
+precision highp int;
+precision highp float;
+uniform highp sampler3D volume, overlay;
+uniform int backgroundMasksOverlays;
+uniform float overlays;
+uniform float opacity;
+uniform float drawOpacity;
+uniform highp sampler3D drawing;
+in vec3 texPos;
+out vec4 color;
+void main() {
+	//color = vec4(1.0, 0.0, 1.0, 1.0);return;
+	vec4 background = texture(volume, texPos);
+	color = vec4(background.rgb, opacity);
+	vec4 ocolor = vec4(0.0);
+	if (overlays > 0.0) {
+		ocolor = texture(overlay, texPos);
+	}
+	float draw = texture(drawing, texPos).r;
+	if (draw > 0.0) {
+		vec3 dcolor = vec3(0.0, 0.0, 0.0);
+		if (draw >= (4.0/255.0))
+			dcolor.rgb = vec3(draw,0.0,draw);
+		else if (draw >= (3.0/255.0))
+			dcolor.b = 1.0;
+		else if (draw >= (2.0/255.0))
+			dcolor.g = 1.0;
+		else
+			dcolor.r = 1.0;
+		color.rgb = mix(color.rgb, dcolor, drawOpacity);
+		color.a = max(drawOpacity, color.a);
+	}
+	if ((backgroundMasksOverlays > 0) && (background.a == 0.0))
+		return;
+	//float aout = ocolor.a + (1.0 - ocolor.a) * color.a;
+	//if (aout <= 0.0) return;
+	//color.rgb = ((ocolor.rgb * ocolor.a) + (color.rgb * color.a * (1.0 - ocolor.a))) / aout;
+	color.rgb = mix(color.rgb, ocolor.rgb, ocolor.a);
+	color.a = 1.0;
+}`;
+
+export var fragRectShader = `#version 300 es
 #line 189
 precision highp int;
 precision highp float;
@@ -463,10 +555,13 @@ export var fragColorbarShader = `#version 300 es
 precision highp int;
 precision highp float;
 uniform highp sampler2D colormap;
+uniform float layer;
 in vec2 vColor;
 out vec4 color;
 void main() {
-	color = vec4(texture(colormap, vColor).rgb, 1.0);
+	float nlayer = float(textureSize(colormap, 0).y);
+	float fmap = (0.5 + layer) / nlayer;
+	color = vec4(texture(colormap, vec2(vColor.x, fmap)).rgb, 1.0);
 }`;
 
 export var vertGraphShader = `#version 300 es
@@ -509,7 +604,7 @@ void main(void) {
 	gl_Position = vec4(frac, 0.0, 1.0);
 }`;
 
-export var vertLineShader = `#version 300 es
+export var vertRectShader = `#version 300 es
 #line 229
 layout(location=0) in vec3 pos;
 uniform vec2 canvasWidthHeight;
@@ -523,6 +618,21 @@ void main(void) {
 	gl_Position = vec4(frac, 0.0, 1.0);
 }`;
 
+export var vertLineShader = `#version 300 es
+#line 229
+layout(location=0) in vec3 pos;
+uniform vec2 canvasWidthHeight;
+uniform float thickness;
+uniform vec4 startXYendXY;
+void main(void) {
+	vec2 posXY = mix(startXYendXY.xy, startXYendXY.zw, pos.x);
+	vec2 dir = normalize(startXYendXY.xy - startXYendXY.zw);
+	posXY += vec2(-dir.y, dir.x) * thickness * (pos.y - 0.5);
+	posXY.x = (posXY.x) / canvasWidthHeight.x; //0..1
+	posXY.y = 1.0 - (posXY.y / canvasWidthHeight.y); //1..0
+	gl_Position = vec4((posXY * 2.0) - 1.0, 0.0, 1.0);
+}`;
+
 export var vertBmpShader = `#version 300 es
 #line 229
 layout(location=0) in vec3 pos;
@@ -618,7 +728,7 @@ in vec2 TexCoord;
 out vec4 FragColor;
 uniform float coordZ;
 uniform float layer;
-uniform float numLayers;
+//uniform float numLayers;
 uniform highp sampler2D colormap;
 uniform lowp sampler3D blend3D;
 uniform float opacity;
@@ -648,7 +758,9 @@ void main(void) {
  }
  idx = ((idx - uint(1)) % uint(100))+uint(1);
  float fx = (float(idx)+0.5) / 256.0;
- float y = (2.0 * layer + 1.0)/(2.0 * numLayers);
+ float nlayer = float(textureSize(colormap, 0).y) * 0.5; //0.5 as both each layer has positive and negative color slot
+ float y = (2.0 * layer + 1.0)/(4.0 * nlayer);
+ //float y = (2.0 * layer + 1.0)/(4.0 * numLayers);
  FragColor = texture(colormap, vec2(fx, y)).rgba;
  FragColor.a *= opacity;
  if (layer < 2.0) return;
@@ -668,28 +780,43 @@ in vec2 TexCoord;
 out vec4 FragColor;
 uniform float coordZ;
 uniform float layer;
-uniform float numLayers;
+//uniform float numLayers;
 uniform float scl_slope;
 uniform float scl_inter;
 uniform float cal_max;
 uniform float cal_min;
 uniform highp sampler2D colormap;
 uniform lowp sampler3D blend3D;
+uniform int modulation;
+uniform highp sampler3D modulationVol;
 uniform float opacity;
 uniform mat4 mtx;
 void main(void) {
  vec4 vx = vec4(TexCoord.xy, coordZ, 1.0) * mtx;
  float f = (scl_slope * float(texture(intensityVol, vx.xyz).r)) + scl_inter;
+ bool isNegative = (f < 0.0);
  float r = max(0.00001, abs(cal_max - cal_min));
  float mn = min(cal_min, cal_max);
- f = mix(0.0, 1.0, (f - mn) / r);
- //float y = 1.0 / numLayers;
- //y = ((layer + 0.5) * y);
+ float txl = mix(0.0, 1.0, (f - mn) / r);
  //https://stackoverflow.com/questions/5879403/opengl-texture-coordinates-in-pixel-space
- float y = (2.0 * layer + 1.0)/(2.0 * numLayers);
- FragColor = texture(colormap, vec2(f, y)).rgba;
+ float nlayer = float(textureSize(colormap, 0).y) * 0.5; //0.5 as both each layer has positive and negative color slot
+ float y = (2.0 * layer + 1.0)/(4.0 * nlayer);
+ FragColor = texture(colormap, vec2(txl, y)).rgba;
+ if (isNegative) {
+   y = (2.0 * layer + nlayer + nlayer + 1.0)/(4.0 * nlayer);
+   //select texels at positions 0 and 1 of lookup table: 
+   vec4 v0 = texture(colormap, vec2(0.5/256.0, y));
+   vec4 v1 = texture(colormap, vec2(1.5/256.0, y));
+   txl = mix(0.0, 1.0, (- f - mn) / r);
+   //detect bogus color: negative color slot not used than
+   // v0 = 1,1,1,0 and v1 = 0,0,0,1
+   if ((v0.r != 1.0) || (v0.a != 0.0) || (v1.r != 0.0) || (v1.a != 1.0))
+     FragColor = texture(colormap, vec2(txl, y));
+ }
  if (layer > 0.7)
    FragColor.a = step(0.00001, FragColor.a);
+ if (modulation > 0)
+   FragColor.rgb *= texture(modulationVol, vx.xyz).r;
  FragColor.a *= opacity;
  if (layer < 1.0) return;
  vec2 texXY = TexCoord.xy*0.5 +vec2(0.5,0.5);
@@ -708,7 +835,7 @@ in vec2 TexCoord;
 out vec4 FragColor;
 uniform float coordZ;
 uniform float layer;
-uniform float numLayers;
+//uniform float numLayers;
 uniform float scl_slope;
 uniform float scl_inter;
 uniform float cal_max;
@@ -718,10 +845,14 @@ uniform lowp sampler3D blend3D;
 uniform float opacity;
 uniform mat4 mtx;
 uniform bool hasAlpha;
+uniform int modulation;
+uniform highp sampler3D modulationVol;
 void main(void) {
  vec4 vx = vec4(TexCoord.xy, coordZ, 1.0) * mtx;
  uvec4 aColor = texture(intensityVol, vx.xyz);
  FragColor = vec4(float(aColor.r) / 255.0, float(aColor.g) / 255.0, float(aColor.b) / 255.0, float(aColor.a) / 255.0);
+ if (modulation > 0)
+   FragColor.rgb *= texture(modulationVol, vx.xyz).r;
  if (!hasAlpha)
    FragColor.a = (FragColor.r * 0.21 + FragColor.g * 0.72 + FragColor.b * 0.07);
  FragColor.a *= opacity;
@@ -880,6 +1011,25 @@ void main(void) {
 	vClr = clr;
 }`;
 
+//report depth for fragment
+// https://github.com/rii-mango/Papaya/blob/782a19341af77a510d674c777b6da46afb8c65f1/src/js/viewer/screensurface.js#L89
+export var fragMeshDepthShader = `#version 300 es
+precision highp int;
+precision highp float;
+uniform float opacity;
+out vec4 color;
+vec4 packFloatToVec4i(const float value) {
+	//this Papaya function uses BSD 3-clause license Copyright (c) 2012-2015, RII-UTHSCSA
+	const vec4 bitSh = vec4(256.0*256.0*256.0, 256.0*256.0, 256.0, 1.0);
+	const vec4 bitMsk = vec4(0.0, 1.0/256.0, 1.0/256.0, 1.0/256.0);
+	vec4 res = fract(value * bitSh);
+	res -= res.xxyz * bitMsk;
+	return res;
+}
+void main() {
+	color = packFloatToVec4i(gl_FragCoord.z);
+}`;
+
 //ToonShader https://prideout.net/blog/old/blog/index.html@tag=toon-shader.html
 export var fragMeshToonShader = `#version 300 es
 precision highp int;