@niivue/niivue 0.40.0 → 0.41.1

package/build/index.js

@@ -10,11 +10,10 @@ var __publicField = (obj, key, value) => {
 };
 
 // src/niivue/index.ts
-import { Subject } from "rxjs";
 import { mat4 as mat46, vec2, vec3 as vec310, vec4 as vec47 } from "gl-matrix";
 
 // package.json
-var version = "0.40.0";
+var version = "0.41.1";
 
 // src/logger.ts
 var _Log = class _Log {
@@ -745,8 +744,109 @@ out vec4 color;` + kDrawFunc + `void main() {
 	if ((isAlphaClipDark) && (background.a == 0.0)) color.a = 0.0; //FSLeyes clipping range
 	vec4 ocolor = vec4(0.0);
 	float overlayAlpha = overlayAlphaShader;
-	if (overlays > 0.0)
+	if (overlays > 0.0) {
 		ocolor = texture(overlay, texPos);
+		//dFdx for "boxing" issue 435 has aliasing on some implementations (coarse vs fine)
+		//however, this only identifies 50% of the edges due to aliasing effects
+		// http://www.aclockworkberry.com/shader-derivative-functions/
+		// https://bgolus.medium.com/distinctive-derivative-differences-cce38d36797b
+		//if ((ocolor.a >= 1.0) && ((dFdx(ocolor.a) != 0.0) || (dFdy(ocolor.a) != 0.0)  ))
+		//	ocolor.rbg = vec3(0.0, 0.0, 0.0);
+		bool isOutlineBelowNotAboveThreshold = true;
+		if (isOutlineBelowNotAboveThreshold) {
+			if ((overlayOutlineWidth > 0.0) && (ocolor.a < 1.0)) { //check voxel neighbors for edge
+				vec3 vx = (overlayOutlineWidth ) / vec3(textureSize(overlay, 0));
+				//6 voxel neighbors that share a face
+				vec3 vxR = vec3(texPos.x+vx.x, texPos.y, texPos.z);
+				vec3 vxL = vec3(texPos.x-vx.x, texPos.y, texPos.z);
+				vec3 vxA = vec3(texPos.x, texPos.y+vx.y, texPos.z);
+				vec3 vxP = vec3(texPos.x, texPos.y-vx.y, texPos.z);
+				vec3 vxS = vec3(texPos.x, texPos.y, texPos.z+vx.z);
+				vec3 vxI = vec3(texPos.x, texPos.y, texPos.z-vx.z);
+				float a = 0.0;
+				if (axCorSag != 2) {
+					a = max(a, texture(overlay, vxR).a);
+					a = max(a, texture(overlay, vxL).a);
+				}
+				if (axCorSag != 1) {
+					a = max(a, texture(overlay, vxA).a);
+					a = max(a, texture(overlay, vxP).a);
+				}
+				if (axCorSag != 0) {
+					a = max(a, texture(overlay, vxS).a);
+					a = max(a, texture(overlay, vxI).a);
+				}
+				bool isCheckCorners = true;
+				if (isCheckCorners) {
+					//12 voxel neighbors that share an edge
+					vec3 vxRA = vec3(texPos.x+vx.x, texPos.y+vx.y, texPos.z);
+					vec3 vxLA = vec3(texPos.x-vx.x, texPos.y+vx.y, texPos.z);
+					vec3 vxRP = vec3(texPos.x+vx.x, texPos.y-vx.y, texPos.z);
+					vec3 vxLP = vec3(texPos.x-vx.x, texPos.y-vx.y, texPos.z);
+					vec3 vxRS = vec3(texPos.x+vx.x, texPos.y, texPos.z+vx.z);
+					vec3 vxLS = vec3(texPos.x-vx.x, texPos.y, texPos.z+vx.z);
+					vec3 vxRI = vec3(texPos.x+vx.x, texPos.y, texPos.z-vx.z);
+					vec3 vxLI = vec3(texPos.x-vx.x, texPos.y, texPos.z-vx.z);
+					vec3 vxAS = vec3(texPos.x, texPos.y+vx.y, texPos.z+vx.z);
+					vec3 vxPS = vec3(texPos.x, texPos.y-vx.y, texPos.z+vx.z);
+					vec3 vxAI = vec3(texPos.x, texPos.y+vx.y, texPos.z-vx.z);
+					vec3 vxPI = vec3(texPos.x, texPos.y-vx.y, texPos.z-vx.z);
+
+					if (axCorSag == 0) { //axial corners
+						a = max(a, texture(overlay, vxRA).a);
+						a = max(a, texture(overlay, vxLA).a);
+						a = max(a, texture(overlay, vxRP).a);
+						a = max(a, texture(overlay, vxLP).a);
+					}
+					if (axCorSag == 1) { //coronal corners
+						a = max(a, texture(overlay, vxRS).a);
+						a = max(a, texture(overlay, vxLS).a);
+						a = max(a, texture(overlay, vxRI).a);
+						a = max(a, texture(overlay, vxLI).a);
+					}
+					if (axCorSag == 2) { //sagittal corners
+						a = max(a, texture(overlay, vxAS).a);
+						a = max(a, texture(overlay, vxPS).a);
+						a = max(a, texture(overlay, vxAI).a);
+						a = max(a, texture(overlay, vxPI).a);
+					}
+				}
+				if (a >= 1.0) {
+					ocolor = vec4(0.0, 0.0, 0.0, 1.0);
+					overlayAlpha = 1.0;
+				}
+			}
+
+		} else {
+			if ((overlayOutlineWidth > 0.0) && (ocolor.a >= 1.0)) { //check voxel neighbors for edge
+				vec3 vx = (overlayOutlineWidth ) / vec3(textureSize(overlay, 0));
+				vec3 vxR = vec3(texPos.x+vx.x, texPos.y, texPos.z);
+				vec3 vxL = vec3(texPos.x-vx.x, texPos.y, texPos.z);
+				vec3 vxA = vec3(texPos.x, texPos.y+vx.y, texPos.z);
+				vec3 vxP = vec3(texPos.x, texPos.y-vx.y, texPos.z);
+				vec3 vxS = vec3(texPos.x, texPos.y, texPos.z+vx.z);
+				vec3 vxI = vec3(texPos.x, texPos.y, texPos.z-vx.z);
+				float a = 1.0;
+				if (axCorSag != 2) {
+					a = min(a, texture(overlay, vxR).a);
+					a = min(a, texture(overlay, vxL).a);
+				}
+				if (axCorSag != 1) {
+					a = min(a, texture(overlay, vxA).a);
+					a = min(a, texture(overlay, vxP).a);
+				}
+				if (axCorSag != 0) {
+					a = min(a, texture(overlay, vxS).a);
+					a = min(a, texture(overlay, vxI).a);
+				}
+				if (a < 1.0) {
+					ocolor = vec4(0.0, 0.0, 0.0, 1.0);
+					overlayAlpha = 1.0;
+				}
+			}
+		} //outline above threshold
+	}
+
 `;
 var kFragSliceTail = `	ocolor.a *= overlayAlpha;
 	vec4 dcolor = drawColor(texture(drawing, texPos).r, drawOpacity);
@@ -1004,7 +1104,7 @@ uniform float layer;
 uniform highp sampler2D colormap;
 uniform lowp sampler3D blend3D;
 uniform float opacity;
-uniform vec3 xyzFrac;
+uniform vec4 xyzaFrac;
 uniform mat4 mtx;
 void main(void) {
 	vec4 vx = vec4(TexCoord.x, TexCoord.y, coordZ, 1.0) * mtx;
@@ -1012,41 +1112,30 @@ void main(void) {
 	FragColor = vec4(0.0, 0.0, 0.0, 0.0);
 	if (idx == uint(0))
 		return;
-	if (xyzFrac.x > 0.0) { //outline
-		vx = vec4(TexCoord.x+xyzFrac.x, TexCoord.y, coordZ, 1.0) * mtx;
+	//idx = ((idx - uint(1)) % uint(100))+uint(1);
+	float textureWidth = float(textureSize(colormap, 0).x);
+	float fx = (float(idx)+0.5) / textureWidth;
+	float nlayer = float(textureSize(colormap, 0).y);
+	float y = ((2.0 * layer) + 1.5)/nlayer;
+	FragColor = texture(colormap, vec2(fx, y)).rgba;
+	float alpha = FragColor.a;
+	FragColor.a *= opacity;
+	if (xyzaFrac.a > 0.0) { //outline
+		vx = vec4(TexCoord.x+xyzaFrac.x, TexCoord.y, coordZ, 1.0) * mtx;
 		uint R = uint(texture(intensityVol, vx.xyz).r);
-		vx = vec4(TexCoord.x-xyzFrac.x, TexCoord.y, coordZ, 1.0) * mtx;
+		vx = vec4(TexCoord.x-xyzaFrac.x, TexCoord.y, coordZ, 1.0) * mtx;
 		uint L = uint(texture(intensityVol, vx.xyz).r);
-		vx = vec4(TexCoord.x, TexCoord.y+xyzFrac.y, coordZ, 1.0) * mtx;
+		vx = vec4(TexCoord.x, TexCoord.y+xyzaFrac.y, coordZ, 1.0) * mtx;
 		uint A = uint(texture(intensityVol, vx.xyz).r);
-		vx = vec4(TexCoord.x, TexCoord.y-xyzFrac.y, coordZ, 1.0) * mtx;
+		vx = vec4(TexCoord.x, TexCoord.y-xyzaFrac.y, coordZ, 1.0) * mtx;
 		uint P = uint(texture(intensityVol, vx.xyz).r);
-		vx = vec4(TexCoord.x, TexCoord.y, coordZ+xyzFrac.z, 1.0) * mtx;
+		vx = vec4(TexCoord.x, TexCoord.y, coordZ+xyzaFrac.z, 1.0) * mtx;
 		uint S = uint(texture(intensityVol, vx.xyz).r);
-		vx = vec4(TexCoord.x, TexCoord.y, coordZ-xyzFrac.z, 1.0) * mtx;
+		vx = vec4(TexCoord.x, TexCoord.y, coordZ-xyzaFrac.z, 1.0) * mtx;
 		uint I = uint(texture(intensityVol, vx.xyz).r);
-		if ((idx == R) && (idx == L) && (idx == A) && (idx == P) && (idx == S) && (idx == I))
-			return;
+		if ((idx != R) || (idx != L) || (idx != A) || (idx != P) || (idx != S) || (idx != I))
+			FragColor.a = alpha * xyzaFrac.a;
 	}
-	idx = ((idx - uint(1)) % uint(100))+uint(1);
-	float textureWidth = float(textureSize(colormap, 0).x);
-	float fx = (float(idx)+0.5) / textureWidth;
-	float nlayer = float(textureSize(colormap, 0).y);
-	float y = ((2.0 * layer) + 1.5)/nlayer;
-	FragColor = texture(colormap, vec2(fx, y)).rgba;
-	//FragColor.a *= opacity;
-	FragColor.a = opacity;
-	return;
-
-	if (layer < 2.0) return;
-	//vec2 texXY = TexCoord.xy*0.5 +vec2(0.5,0.5);
-	//vec4 prevColor = texture(blend3D, vec3(texXY, coordZ));
-	vec4 prevColor = texture(blend3D, vec3(TexCoord.xy, coordZ));
-	// https://en.wikipedia.org/wiki/Alpha_compositing
-	float aout = FragColor.a + (1.0 - FragColor.a) * prevColor.a;
-	if (aout <= 0.0) return;
-	FragColor.rgb = ((FragColor.rgb * FragColor.a) + (prevColor.rgb * prevColor.a * (1.0 - FragColor.a))) / aout;
-	FragColor.a = aout;
 }`;
 var fragOrientShader = `#line 691
 precision highp int;
@@ -1187,28 +1276,28 @@ var fragGrowCutShader = `#version 300 es
 	uniform int finalPass;
 	uniform float coordZ;
 	uniform lowp sampler3D in3D;
-	uniform highp isampler3D inputTexture0; // background
-	uniform highp isampler3D inputTexture1; // label
-	uniform highp isampler3D inputTexture2; // strength
+	uniform highp isampler3D backTex; // background
+	uniform highp isampler3D labelTex; // label
+	uniform highp isampler3D strengthTex; // strength
 void main(void) {
 	vec3 interpolatedTextureCoordinate = vec3(TexCoord.xy, coordZ);
-	ivec3 size = textureSize(inputTexture0, 0);
+	ivec3 size = textureSize(backTex, 0);
 	ivec3 texelIndex = ivec3(floor(interpolatedTextureCoordinate * vec3(size)));
-	int background = texelFetch(inputTexture0, texelIndex, 0).r;
-	label = texelFetch(inputTexture1, texelIndex, 0).r;
-	strength = texelFetch(inputTexture2, texelIndex, 0).r;
+	int background = texelFetch(backTex, texelIndex, 0).r;
+	label = texelFetch(labelTex, texelIndex, 0).r;
+	strength = texelFetch(strengthTex, texelIndex, 0).r;
 	for (int k = -1; k <= 1; k++) {
 		for (int j = -1; j <= 1; j++) {
 			for (int i = -1; i <= 1; i++) {
 				if (i != 0 && j != 0 && k != 0) {
 					ivec3 neighborIndex = texelIndex + ivec3(i,j,k);
-					int neighborBackground = texelFetch(inputTexture0, neighborIndex, 0).r;
-					int neighborStrength = texelFetch(inputTexture2, neighborIndex, 0).r;
+					int neighborBackground = texelFetch(backTex, neighborIndex, 0).r;
+					int neighborStrength = texelFetch(strengthTex, neighborIndex, 0).r;
 					int strengthCost = abs(neighborBackground - background);
 					int takeoverStrength = neighborStrength - strengthCost;
 					if (takeoverStrength > strength) {
 						strength = takeoverStrength;
-						label = texelFetch(inputTexture1, neighborIndex, 0).r;
+						label = texelFetch(labelTex, neighborIndex, 0).r;
 					}
 				}
 			}
@@ -1222,7 +1311,7 @@ void main(void) {
 		for (int j = -1; j <= 1; j++)
 			for (int i = -1; i <= 1; i++) {
 				ivec3 neighborIndex = texelIndex + ivec3(i,j,k);
-				int ilabel = texelFetch(inputTexture1, neighborIndex, 0).r;
+				int ilabel = texelFetch(labelTex, neighborIndex, 0).r;
 				if ((ilabel < 0) || (ilabel > 3))
 					ok = 0;
 				else
@@ -1279,9 +1368,11 @@ uniform mat4 mvpMtx;
 uniform mat4 normMtx;
 out vec4 vClr;
 out vec3 vN;
+out vec4 vP;
 void main(void) {
 	vec3 lightPosition = vec3(0.0, 0.0, -10.0);
-	gl_Position = mvpMtx * vec4(pos, 1.0);
+	vP = vec4(pos, 1.0);
+	gl_Position = mvpMtx * vP;
 	vN = normalize((normMtx * vec4(norm.xyz,1.0)).xyz);
 	//vV = -vec3(modelMtx*vec4(pos,1.0));
 	vClr = clr;
@@ -2825,8 +2916,8 @@ __publicField(_NiivueObject3D, "CULL_FACE", 2);
 __publicField(_NiivueObject3D, "CULL_FRONT", 4);
 __publicField(_NiivueObject3D, "CULL_BACK", 8);
 __publicField(_NiivueObject3D, "ENABLE_DEPTH_TEST", 16);
-__publicField(_NiivueObject3D, "generateCrosshairs", function(gl, id, xyzMM, xyzMin, xyzMax, radius, sides = 20) {
-  const geometry = _NiivueObject3D.generateCrosshairsGeometry(gl, xyzMM, xyzMin, xyzMax, radius, sides);
+__publicField(_NiivueObject3D, "generateCrosshairs", function(gl, id, xyzMM, xyzMin, xyzMax, radius, sides = 20, gap = 0) {
+  const geometry = _NiivueObject3D.generateCrosshairsGeometry(gl, xyzMM, xyzMin, xyzMax, radius, sides, gap);
   return new _NiivueObject3D(
     id,
     geometry.vertexBuffer,
@@ -2837,18 +2928,40 @@ __publicField(_NiivueObject3D, "generateCrosshairs", function(gl, id, xyzMM, xyz
   );
 });
 // not included in public docs
-__publicField(_NiivueObject3D, "generateCrosshairsGeometry", function(gl, xyzMM, xyzMin, xyzMax, radius, sides = 20) {
+__publicField(_NiivueObject3D, "generateCrosshairsGeometry", function(gl, xyzMM, xyzMin, xyzMax, radius, sides = 20, gap = 0) {
   const vertices = [];
   const indices = [];
-  let start = vec3.fromValues(xyzMin[0], xyzMM[1], xyzMM[2]);
-  let dest = vec3.fromValues(xyzMax[0], xyzMM[1], xyzMM[2]);
-  _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides);
-  start = vec3.fromValues(xyzMM[0], xyzMin[1], xyzMM[2]);
-  dest = vec3.fromValues(xyzMM[0], xyzMax[1], xyzMM[2]);
-  _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides);
-  start = vec3.fromValues(xyzMM[0], xyzMM[1], xyzMin[2]);
-  dest = vec3.fromValues(xyzMM[0], xyzMM[1], xyzMax[2]);
-  _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides);
+  const gapX = radius * gap;
+  if (gapX <= 0) {
+    let start = vec3.fromValues(xyzMin[0], xyzMM[1], xyzMM[2]);
+    let dest = vec3.fromValues(xyzMax[0], xyzMM[1], xyzMM[2]);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides);
+    start = vec3.fromValues(xyzMM[0], xyzMin[1], xyzMM[2]);
+    dest = vec3.fromValues(xyzMM[0], xyzMax[1], xyzMM[2]);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides);
+    start = vec3.fromValues(xyzMM[0], xyzMM[1], xyzMin[2]);
+    dest = vec3.fromValues(xyzMM[0], xyzMM[1], xyzMax[2]);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides);
+  } else {
+    let start = vec3.fromValues(xyzMin[0], xyzMM[1], xyzMM[2]);
+    let dest = vec3.fromValues(xyzMM[0] - gapX, xyzMM[1], xyzMM[2]);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides, false);
+    start = vec3.fromValues(xyzMM[0] + gapX, xyzMM[1], xyzMM[2]);
+    dest = vec3.fromValues(xyzMax[0], xyzMM[1], xyzMM[2]);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides, false);
+    start = vec3.fromValues(xyzMM[0], xyzMin[1], xyzMM[2]);
+    dest = vec3.fromValues(xyzMM[0], xyzMM[1] - gapX, xyzMM[2]);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides, false);
+    start = vec3.fromValues(xyzMM[0], xyzMM[1] + gapX, xyzMM[2]);
+    dest = vec3.fromValues(xyzMM[0], xyzMax[1], xyzMM[2]);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides, false);
+    start = vec3.fromValues(xyzMM[0], xyzMM[1], xyzMin[2]);
+    dest = vec3.fromValues(xyzMM[0], xyzMM[1], xyzMM[2] - gapX);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides, false);
+    start = vec3.fromValues(xyzMM[0], xyzMM[1], xyzMM[2] + gapX);
+    dest = vec3.fromValues(xyzMM[0], xyzMM[1], xyzMax[2]);
+    _NiivueObject3D.makeCylinder(vertices, indices, start, dest, radius, sides, false);
+  }
   const vertexBuffer = gl.createBuffer();
   if (vertexBuffer === null) {
     throw new Error("could not instantiate vertex buffer");
@@ -11044,7 +11157,7 @@ var ColorTables = class {
     const cmap = this.colormapFromKey(key);
     return this.makeLut(cmap.R, cmap.G, cmap.B, cmap.A, cmap.I, isInvert);
   }
-  makeLabelLut(cm, alphaFill = 64) {
+  makeLabelLut(cm, alphaFill = 255) {
     if (cm.R === void 0 || cm.G === void 0 || cm.B === void 0) {
       throw new Error(`Invalid colormap table: ${cm}`);
     }
@@ -11383,11 +11496,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     const offsetPt0 = [];
     offsetPt0.push(npt);
     const pts = [];
-    const dps = [];
-    dps.push({
-      id: "tract",
-      vals: []
-    });
+    const bundleTags = [];
     for (let t = 0; t < n_tracts; t++) {
       line = readStr();
       const new_tracts = readNumericTag("ni_dimen=");
@@ -11407,13 +11516,18 @@ var NVMeshLoaders = class _NVMeshLoaders {
         }
         npt += new_pts;
         offsetPt0.push(npt);
-        dps[0].vals.push(bundleTag);
+        bundleTags.push(bundleTag);
       }
       line = readStr();
     }
+    const dps = [];
+    dps.push({
+      id: "tract",
+      vals: Float32Array.from(bundleTags)
+    });
     return {
-      pts,
-      offsetPt0,
+      pts: new Float32Array(pts),
+      offsetPt0: new Uint32Array(offsetPt0),
       dps
     };
   }
@@ -11502,8 +11616,8 @@ var NVMeshLoaders = class _NVMeshLoaders {
       }
       return mat2;
     }
-    let offsetPt0 = [];
-    let pts = [];
+    let offsetPt0 = new Uint32Array(0);
+    let pts = new Float32Array(0);
     const mat = readMatV4(buffer);
     if (!("trans_to_mni" in mat)) {
       throw new Error("TT format file must have 'trans_to_mni'");
@@ -11535,8 +11649,6 @@ var NVMeshLoaders = class _NVMeshLoaders {
       m[15]
     );
     mat42.transpose(trans_to_mni, trans_to_mni);
-    const zoomMat = mat42.create();
-    mat42.transpose(zoomMat, zoomMat);
     function parse_tt(track) {
       const dv = new DataView(track.buffer);
       const pos = [];
@@ -11574,12 +11686,10 @@ var NVMeshLoaders = class _NVMeshLoaders {
       for (let i2 = 0; i2 < npt; i2++) {
         pts[i2] = pts[i2] / 32;
       }
-      const vox2mmMat = mat42.create();
-      mat42.mul(vox2mmMat, trans_to_mni, zoomMat);
       let v = 0;
       for (let i2 = 0; i2 < npt / 3; i2++) {
         const pos2 = vec42.fromValues(pts[v], pts[v + 1], pts[v + 2], 1);
-        vec42.transformMat4(pos2, pos2, vox2mmMat);
+        vec42.transformMat4(pos2, pos2, trans_to_mni);
         pts[v++] = pos2[0];
         pts[v++] = pos2[1];
         pts[v++] = pos2[2];
@@ -11603,7 +11713,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     }
     let noff = 0;
     let npt = 0;
-    let pts = [];
+    let pts = new Float32Array([]);
     const offsetPt0 = [];
     const dpg = [];
     const dps = [];
@@ -11678,31 +11788,21 @@ var NVMeshLoaders = class _NVMeshLoaders {
       if (pname.includes("groups")) {
         dpg.push({
           id: tag,
-          vals: Array.from(vals.slice())
+          vals: Float32Array.from(vals.slice())
         });
         continue;
       }
       if (pname.includes("dpv")) {
-        let mn = vals[0];
-        let mx = vals[0];
-        for (let i2 = 1; i2 < vals.length; i2++) {
-          mn = Math.min(vals[i2], mn);
-          mx = Math.max(vals[i2], mx);
-        }
         dpv.push({
           id: tag,
-          vals: Array.from(vals.slice()),
-          global_min: mn,
-          global_max: mx,
-          cal_min: mn,
-          cal_max: mx
+          vals: Float32Array.from(vals.slice())
         });
         continue;
       }
       if (pname.includes("dps")) {
         dps.push({
           id: tag,
-          vals: Array.from(vals.slice())
+          vals: Float32Array.from(vals.slice())
         });
         continue;
       }
@@ -11714,7 +11814,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       }
       if (fname.startsWith("positions.3.")) {
         npt = nval;
-        pts = Array.from(vals.slice());
+        pts = new Float32Array(vals);
       }
     }
     if (noff === 0 || npt === 0) {
@@ -11725,8 +11825,8 @@ var NVMeshLoaders = class _NVMeshLoaders {
     }
     offsetPt0[noff] = npt / 3;
     return {
-      pts: Array.from(pts),
-      offsetPt0: Array.from(offsetPt0),
+      pts,
+      offsetPt0: new Uint32Array(offsetPt0),
       dpg,
       dps,
       dpv,
@@ -11886,23 +11986,16 @@ var NVMeshLoaders = class _NVMeshLoaders {
     if (vers > 2 || hdr_sz !== 1e3 || magic !== 1128354388) {
       throw new Error("Not a valid TRK file");
     }
-    const dps = [];
-    const dpv = [];
     const n_scalars = reader.getInt16(36, true);
-    if (n_scalars > 0) {
-      for (let i2 = 0; i2 < n_scalars; i2++) {
-        const arr = new Uint8Array(buffer.slice(38 + i2 * 20, 58 + i2 * 20));
-        const str = new TextDecoder().decode(arr).split("\0").shift();
-        dpv.push({
-          id: str.trim(),
-          // TODO can we guarantee this?
-          vals: [],
-          global_min: 0,
-          global_max: 0,
-          cal_min: 0,
-          cal_max: 0
-        });
-      }
+    const dpv = [];
+    for (let i2 = 0; i2 < n_scalars; i2++) {
+      const arr = new Uint8Array(buffer.slice(38 + i2 * 20, 58 + i2 * 20));
+      const str = new TextDecoder().decode(arr).split("\0").shift();
+      dpv.push({
+        id: str.trim(),
+        // TODO can we guarantee this?
+        vals: []
+      });
     }
     const voxel_sizeX = reader.getFloat32(12, true);
     const voxel_sizeY = reader.getFloat32(16, true);
@@ -11926,16 +12019,15 @@ var NVMeshLoaders = class _NVMeshLoaders {
       1
     );
     const n_properties = reader.getInt16(238, true);
-    if (n_properties > 0) {
-      for (let i2 = 0; i2 < n_properties; i2++) {
-        const arr = new Uint8Array(buffer.slice(240 + i2 * 20, 260 + i2 * 20));
-        const str = new TextDecoder().decode(arr).split("\0").shift();
-        dps.push({
-          id: str.trim(),
-          // TODO can we guarantee this?
-          vals: []
-        });
-      }
+    const dps = [];
+    for (let i2 = 0; i2 < n_properties; i2++) {
+      const arr = new Uint8Array(buffer.slice(240 + i2 * 20, 260 + i2 * 20));
+      const str = new TextDecoder().decode(arr).split("\0").shift();
+      dps.push({
+        id: str.trim(),
+        // TODO can we guarantee this?
+        vals: []
+      });
     }
     const mat = mat42.create();
     for (let i2 = 0; i2 < 16; i2++) {
@@ -11947,9 +12039,6 @@ var NVMeshLoaders = class _NVMeshLoaders {
     }
     const vox2mmMat = mat42.create();
     mat42.mul(vox2mmMat, zoomMat, mat);
-    vox2mmMat[3] = mat[3];
-    vox2mmMat[7] = mat[7];
-    vox2mmMat[11] = mat[11];
     let i32 = null;
     let f32 = null;
     i32 = new Int32Array(buffer.slice(hdr_sz));
@@ -11991,15 +12080,19 @@ var NVMeshLoaders = class _NVMeshLoaders {
         }
       }
     }
-    if (n_scalars > 0) {
-      for (let s = 0; s < n_scalars; s++) {
-        const mn = dpv[s].vals.reduce((acc, current) => Math.min(acc, current));
-        const mx = dpv[s].vals.reduce((acc, current) => Math.max(acc, current));
-        dpv[s].global_min = mn;
-        dpv[s].global_max = mx;
-        dpv[s].cal_min = mn;
-        dpv[s].cal_max = mx;
-      }
+    const dps32 = [];
+    for (let i2 = 0; i2 < dps.length; i2++) {
+      dps32.push({
+        id: dps[i2].id,
+        vals: Float32Array.from(dps[i2].vals)
+      });
+    }
+    const dpv32 = [];
+    for (let s = 0; s < dpv.length; s++) {
+      dpv32.push({
+        id: dpv[i].id,
+        vals: Float32Array.from(dpv[i].vals)
+      });
     }
     offsetPt0[noffset++] = npt;
     pts = pts.slice(0, npt3);
@@ -12007,8 +12100,8 @@ var NVMeshLoaders = class _NVMeshLoaders {
     return {
       pts,
       offsetPt0,
-      dps,
-      dpv
+      dps: dps32,
+      dpv: dpv32
     };
   }
   // readTRK()
@@ -12166,7 +12259,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     } else {
       throw new Error("Unsupported ASCII VTK datatype " + items[0]);
     }
-    const indices = new Int32Array(tris);
+    const indices = new Uint32Array(tris);
     return {
       positions,
       indices
@@ -12174,7 +12267,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
   }
   // readTxtVTK()
   // read mesh overlay to influence vertex colors
-  static readLayer(name = "", buffer, nvmesh, opacity = 0.5, colormap = "warm", colormapNegative = "winter", useNegativeCmap = false, cal_min = null, cal_max = null, isOutlineBorder = false) {
+  static readLayer(name = "", buffer, nvmesh, opacity = 0.5, colormap = "warm", colormapNegative = "winter", useNegativeCmap = false, cal_min = null, cal_max = null, outlineBorder = 0) {
     const layer = {
       colormapInvert: false,
       alphaThreshold: false,
@@ -12212,7 +12305,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       const mx2 = vals.reduce((acc, current) => Math.max(acc, current));
       nvmesh.dpv.push({
         id: tag,
-        vals: Array.from(vals.slice()),
+        vals: Float32Array.from(vals.slice()),
         global_min: mn2,
         global_max: mx2,
         cal_min: mn2,
@@ -12271,7 +12364,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     }
     layer.nFrame4D = layer.values.length / n_vert;
     layer.frame4D = 0;
-    layer.isOutlineBorder = isOutlineBorder;
+    layer.outlineBorder = outlineBorder;
     let mn = layer.values[0];
     let mx = layer.values[0];
     for (let i = 0; i < layer.values.length; i++) {
@@ -12624,7 +12717,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       }
       if (ntri < 1) {
         ntri = parseInt(items[0]);
-        indices = new Int32Array(ntri * 3);
+        indices = new Uint32Array(ntri * 3);
         continue;
       }
       if (t >= ntri * 3) {
@@ -12680,7 +12773,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       positions[j + 2] = parseFloat(items[2]);
       j += 3;
     }
-    const indices = new Int32Array(ntri * 3);
+    const indices = new Uint32Array(ntri * 3);
     j = 0;
     for (let i = 0; i < ntri; i++) {
       line = readStr();
@@ -12862,7 +12955,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     } else {
       throw new Error("Unsupported binary VTK datatype " + items[0]);
     }
-    const indices = new Int32Array(tris);
+    const indices = new Uint32Array(tris);
     return {
       positions,
       indices
@@ -12883,7 +12976,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     const nvert = reader.getUint32(28, true);
     const vcoffset = reader.getUint32(48, true);
     let pos = hdrBytes;
-    const indices = new Int32Array(buffer, pos, nface * 3);
+    const indices = new Uint32Array(buffer, pos, nface * 3);
     pos += nface * 3 * 4;
     const positions = new Float32Array(buffer, pos, nvert * 3);
     for (let i = 0; i < nvert * 3; i += 3) {
@@ -12941,7 +13034,11 @@ var NVMeshLoaders = class _NVMeshLoaders {
       isSCALAR = true;
     }
     if (isSCALAR) {
-      const FSizeWoScalars = 16 + nskip + (isFace ? 1 : 0) * nface * 12 + (isVert ? 1 : 0) * n_vert * 12 + (isRGBA ? 1 : 0) * n_vert * 4;
+      let nv = n_vert;
+      if (n_vert === 0) {
+        nv = nvert;
+      }
+      const FSizeWoScalars = 16 + nskip + (isFace ? 1 : 0) * nface * 12 + (isVert ? 1 : 0) * nv * 12 + (isRGBA ? 1 : 0) * nv * 4;
       const scalarFloats = Math.floor((_buffer.byteLength - FSizeWoScalars) / bytesPerScalar);
       if (nvert !== n_vert && scalarFloats % n_vert === 0) {
         log.warn("Issue 729: mz3 mismatch scalar NVERT does not match mesh NVERT");
@@ -12962,7 +13059,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     let filepos = 16 + nskip;
     let indices = null;
     if (isFace) {
-      indices = new Int32Array(_buffer, filepos, nface * 3);
+      indices = new Uint32Array(_buffer, filepos, nface * 3);
       filepos += nface * 3 * 4;
     }
     let positions = null;
@@ -13116,7 +13213,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
         positions2[v + 2] = parseFloat(items[2]);
         v += 3;
       }
-      let indices2 = new Int32Array(nface * 3);
+      let indices2 = new Uint32Array(nface * 3);
       let f = 0;
       for (let i = 0; i < nface; i++) {
         line = readStr();
@@ -13126,7 +13223,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
           break;
         }
         if (f + nTri * 3 > indices2.length) {
-          const c = new Int32Array(indices2.length + indices2.length);
+          const c = new Uint32Array(indices2.length + indices2.length);
           c.set(indices2);
           indices2 = c.slice();
         }
@@ -13176,7 +13273,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
         pos += vertStride;
       }
     }
-    const indices = new Int32Array(nface * 3);
+    const indices = new Uint32Array(nface * 3);
     let isTriangular = true;
     let j = 0;
     if (indexCountBytes === 1 && indexBytes === 4 && indexStrideBytes === 13) {
@@ -13267,7 +13364,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     header = lines[line].trim().split(/\s+/);
     line++;
     const num_f = parseInt(header[0]);
-    const indices = new Int32Array(num_f * 3);
+    const indices = new Uint32Array(num_f * 3);
     for (let i = 0; i < num_f; i++) {
       const items = lines[line].trim().split(/\s+/);
       line++;
@@ -13352,7 +13449,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       }
     }
     const positions = new Float32Array(pts);
-    const indices = new Int32Array(t);
+    const indices = new Uint32Array(t);
     return {
       positions,
       indices
@@ -13398,16 +13495,58 @@ var NVMeshLoaders = class _NVMeshLoaders {
       i++;
     }
     const positions = new Float32Array(pts);
-    const indices = new Int32Array(t);
+    const indices = new Uint32Array(t);
     return {
       positions,
       indices
     };
   }
   // readOFF()
+  static readOBJMNI(buffer) {
+    const enc = new TextDecoder("utf-8");
+    const txt = enc.decode(buffer);
+    const items = txt.trim().split(/\s*,\s*|\s+/);
+    if (items.length < 1 || items[0] !== "P") {
+      log.warn("This is not a valid MNI OBJ mesh.");
+    }
+    let j = 6;
+    const nVert = parseInt(items[j++]);
+    const nVertX3 = nVert * 3;
+    const positions = new Float32Array(nVertX3);
+    for (let i = 0; i < nVertX3; i++) {
+      positions[i] = parseFloat(items[j++]);
+    }
+    j += nVertX3;
+    const nTri = parseInt(items[j++]);
+    const colour_flag = parseInt(items[j++]);
+    if (nTri < 1 || colour_flag < 0 || colour_flag > 2) {
+      log.warn("This is not a valid MNI OBJ mesh.");
+    }
+    let num_c = 1;
+    if (colour_flag === 1) {
+      num_c = nTri;
+    } else if (colour_flag === 1) {
+      num_c = nVert;
+    }
+    j += num_c * 4;
+    j += nTri;
+    const nTriX3 = nTri * 3;
+    const indices = new Uint32Array(nTriX3);
+    for (let i = 0; i < nTriX3; i++) {
+      indices[i] = parseInt(items[j++]);
+    }
+    return {
+      positions,
+      indices
+    };
+  }
+  // readOBJMNI()
   static readOBJ(buffer) {
     const enc = new TextDecoder("utf-8");
     const txt = enc.decode(buffer);
+    if (txt[0] === "P") {
+      return this.readOBJMNI(buffer);
+    }
     const lines = txt.split("\n");
     const n = lines.length;
     const pts = [];
@@ -13441,7 +13580,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       }
     }
     const positions = new Float32Array(pts);
-    const indices = new Int32Array(t);
+    const indices = new Uint32Array(t);
     return {
       positions,
       indices
@@ -13476,7 +13615,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       offset += 4;
     }
     nf *= 3;
-    const indices = new Int32Array(nf);
+    const indices = new Uint32Array(nf);
     for (let i = 0; i < nf; i++) {
       indices[i] = view.getUint32(offset, false);
       offset += 4;
@@ -13593,7 +13732,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       const nNearest = reader.getUint32(pos, true);
       pos += 4 + 4 * nNearest;
     }
-    const indices = new Int32Array(nTri * 3);
+    const indices = new Uint32Array(nTri * 3);
     for (let i = 0; i < nTri * 3; i++) {
       indices[i] = reader.getInt32(pos, true);
       pos += 4;
@@ -13632,7 +13771,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       throw new Error("Unable to parse ASCII STL file.");
     }
     const positions = new Float32Array(pts);
-    const indices = new Int32Array(npts);
+    const indices = new Uint32Array(npts);
     for (let i = 0; i < npts; i++) {
       indices[i] = i;
     }
@@ -13658,7 +13797,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     if (buffer.byteLength < 80 + 4 + ntri * 50) {
       throw new Error("STL file too small to store triangles = " + ntri);
     }
-    const indices = new Int32Array(ntri3);
+    const indices = new Uint32Array(ntri3);
     const positions = new Float32Array(ntri3 * 3);
     let pos = 80 + 4 + 12;
     let v = 0;
@@ -13753,7 +13892,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
       let indexCount = 0;
       let surfaceNumberOfVertices = 0;
       let brainStructure = "";
-      let vertexIndices = new Int32Array();
+      let vertexIndices = new Uint32Array();
       const bytes = new Uint8Array(buffer);
       let pos = 552;
       let line;
@@ -13803,7 +13942,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
           if (items.length < indexCount) {
             log.error("Error parsing VertexIndices");
           }
-          vertexIndices = new Int32Array(indexCount);
+          vertexIndices = new Uint32Array(indexCount);
           for (let i = 0; i < indexCount; i++) {
             vertexIndices[i] = parseInt(items[i]);
           }
@@ -14099,33 +14238,20 @@ var NVMeshLoaders = class _NVMeshLoaders {
   static readX3D(buffer) {
     const len = buffer.byteLength;
     if (len < 20) {
-      throw new Error("File too small to be GII: bytes = " + len);
+      throw new Error("File too small to be X3D: bytes = " + len);
     }
     const bytes = new Uint8Array(buffer);
     let pos = 0;
-    function readStrX() {
-      while (pos < len && bytes[pos] === 10) {
+    function readStr() {
+      while (pos < len && bytes[pos] !== 60) {
         pos++;
       }
-      const startPos = pos;
-      while (pos < len && bytes[pos] !== 10) {
+      const startP = pos;
+      while (pos < len && bytes[pos] !== 62) {
         pos++;
       }
-      pos++;
-      if (pos - startPos < 1) {
-        return "";
-      }
-      return new TextDecoder().decode(buffer.slice(startPos, pos - 1)).trim();
-    }
-    function readStr() {
-      let line2 = readStrX();
-      if (!line2.startsWith("<") || line2.endsWith(">")) {
-        return line2;
-      }
-      while (pos < len && !line2.endsWith(">")) {
-        line2 += readStrX();
-      }
-      return line2;
+      const endP = pos;
+      return new TextDecoder().decode(buffer.slice(startP, endP + 1)).trim();
     }
     let line = readStr();
     function readStringTag(TagName) {
@@ -14146,22 +14272,30 @@ var NVMeshLoaders = class _NVMeshLoaders {
       const delimiter = line[fpos + TagName.length + 1];
       const spos = line.indexOf(delimiter, fpos) + 1;
       const epos = line.indexOf(delimiter, spos);
-      const str = line.slice(spos, epos).trim();
-      const items = str.trim().split(/\s+/);
+      let str = line.slice(spos, epos).trim();
+      str = str.replace(/,\s*$/, "");
+      const items = str.trim().split(/\s*,\s*|\s+/);
       if (items.length < 2) {
         return parseFloat(str);
       }
-      const ret = [];
+      let ret = new Array(items.length);
+      let j = 0;
       for (let i = 0; i < items.length; i++) {
-        ret.push(parseFloat(items[i]));
+        const v = parseFloat(items[i]);
+        if (!isFinite(v)) {
+          continue;
+        }
+        ret[j] = v;
+        j++;
       }
+      ret = ret.slice(0, j);
       return ret;
     }
     if (!line.includes("xml version")) {
       log.warn("Not a X3D image");
     }
     let positions = [];
-    const indices = [];
+    let indices = [];
     let rgba255 = [];
     let color = [];
     let translation = [0, 0, 0, 0];
@@ -14239,12 +14373,20 @@ var NVMeshLoaders = class _NVMeshLoaders {
             height = -2;
             coordIndex = readNumericTag("coordIndex");
           }
+          if (line.startsWith("<IndexedTriangleSet")) {
+            height = -7;
+            coordIndex = readNumericTag("index");
+          }
           if (line.startsWith("<IndexedTriangleStripSet")) {
             height = -3;
             coordIndex = readNumericTag("index");
           }
           if (line.startsWith("<Coordinate")) {
             point = readNumericTag("point");
+            const rem = point.length % 3;
+            if (rem !== 0) {
+              point = point.slice(0, -rem);
+            }
           }
           if (line.startsWith("<Color")) {
             color = readNumericTag("color");
@@ -14262,7 +14404,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
             log.warn("Unsupported x3d shape: ElevationGrid");
           }
         }
-        if (height < -3) {
+        if (height < -3 && height !== -7) {
         } else if (height < -1) {
           if (coordIndex.length < 1 || point.length < 3 || point.length === void 0) {
             log.warn("Indexed mesh must specify indices and points");
@@ -14270,7 +14412,9 @@ var NVMeshLoaders = class _NVMeshLoaders {
           }
           const idx0 = Math.floor(positions.length / 3);
           let j = 2;
-          if (height === -2) {
+          if (height === -7) {
+            indices = [...indices, ...coordIndex];
+          } else if (height === -2) {
             let triStart = 0;
             while (j < coordIndex.length) {
               if (coordIndex[j] >= 0) {
@@ -14329,9 +14473,9 @@ var NVMeshLoaders = class _NVMeshLoaders {
       }
     }
     return {
-      positions,
-      indices: Int32Array.from(indices),
-      rgba255
+      positions: Float32Array.from(positions),
+      indices: Uint32Array.from(indices),
+      rgba255: Uint8Array.from(rgba255)
     };
   }
   // readX3D()
@@ -14399,7 +14543,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
     }
     len = tag.contentEndPos;
     let positions = new Float32Array();
-    let indices = new Int32Array();
+    let indices = new Uint32Array();
     let scalars = new Float32Array();
     let anatomicalStructurePrimary = "";
     let isIdx = false;
@@ -14526,7 +14670,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
           if (dataType !== 8) {
             log.warn("expect indices as INT32");
           }
-          indices = new Int32Array(datBin.buffer);
+          indices = new Uint32Array(datBin.buffer);
           if (isColMajor) {
             const tmp = indices.slice();
             const np = tmp.length / 3;
@@ -14659,7 +14803,7 @@ var NVMeshLoaders = class _NVMeshLoaders {
 
 // src/nvmesh.ts
 var NVMeshFromUrlOptions = class {
-  constructor(url = "", gl = null, name = "", opacity = 1, rgba255 = [255, 255, 255, 255], visible = true, layers = [], colorbarVisible = true) {
+  constructor(url = "", gl = null, name = "", opacity = 1, rgba255 = new Uint8Array([255, 255, 255, 255]), visible = true, layers = [], colorbarVisible = true) {
     __publicField(this, "url");
     __publicField(this, "gl");
     __publicField(this, "name");
@@ -14694,7 +14838,7 @@ var NVMesh = class _NVMesh {
    * @param colorbarVisible - does this mesh display a colorbar
    * @param anatomicalStructurePrimary - region for mesh. Default is an empty string
    */
-  constructor(pts, tris, name = "", rgba255 = [255, 255, 255, 255], opacity = 1, visible = true, gl, connectome = null, dpg = null, dps = null, dpv = null, colorbarVisible = true, anatomicalStructurePrimary = "") {
+  constructor(pts, tris, name = "", rgba255 = new Uint8Array([255, 255, 255, 255]), opacity = 1, visible = true, gl, connectome = null, dpg = null, dps = null, dpv = null, colorbarVisible = true, anatomicalStructurePrimary = "") {
     __publicField(this, "id");
     __publicField(this, "name");
     __publicField(this, "anatomicalStructurePrimary");
@@ -14742,6 +14886,7 @@ var NVMesh = class _NVMesh {
     __publicField(this, "vertexCount", 1);
     __publicField(this, "nodeScale", 4);
     __publicField(this, "edgeScale", 1);
+    __publicField(this, "legendLineThickness", 0);
     __publicField(this, "nodeColormap", "warm");
     __publicField(this, "edgeColormap", "warm");
     __publicField(this, "nodeColormapNegative");
@@ -14804,6 +14949,15 @@ var NVMesh = class _NVMesh {
       this.dpg = dpg;
       this.dps = dps;
       this.dpv = dpv;
+      if (dpg) {
+        this.initValuesArray(dpg);
+      }
+      if (dps) {
+        this.initValuesArray(dps);
+      }
+      if (dpv) {
+        this.initValuesArray(dpv);
+      }
       this.offsetPt0 = tris;
       this.updateFibers(gl);
       gl.bindVertexArray(this.vaoFiber);
@@ -14828,6 +14982,17 @@ var NVMesh = class _NVMesh {
     this.tris = tris;
     this.updateMesh(gl);
   }
+  initValuesArray(va) {
+    for (let i = 0; i < va.length; i++) {
+      const mn = va[i].vals.reduce((acc, current) => Math.min(acc, current));
+      const mx = va[i].vals.reduce((acc, current) => Math.max(acc, current));
+      va[i].global_min = mn;
+      va[i].global_max = mx;
+      va[i].cal_min = mn;
+      va[i].cal_max = mx;
+    }
+    return va;
+  }
   // given streamlines (which webGL renders as a single pixel), extrude to cylinders
   linesToCylinders(gl, posClrF32, indices) {
     function v4ToV3(v4) {
@@ -14923,7 +15088,7 @@ var NVMesh = class _NVMesh {
       }
     }
     const nidx = (n_line_vtx - n_streamlines) * cyl_sides * 2 * 3;
-    const idxs = new Int32Array(nidx);
+    const idxs = new Uint32Array(nidx);
     let idx = 0;
     vtx = 0;
     for (let i = 1; i < n_count; i++) {
@@ -14955,9 +15120,9 @@ var NVMesh = class _NVMesh {
       vtx += cyl_sides;
     }
     gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
-    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Int32Array(idxs), gl.STATIC_DRAW);
+    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, Uint32Array.from(idxs), gl.STATIC_DRAW);
     gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(f32), gl.STATIC_DRAW);
+    gl.bufferData(gl.ARRAY_BUFFER, Float32Array.from(f32), gl.STATIC_DRAW);
     this.indexCount = nidx;
   }
   // linesToCylinders
@@ -14972,7 +15137,7 @@ var NVMesh = class _NVMesh {
     const n_count = offsetPt0.length - 1;
     const npt = pts.length / 3;
     if (!this.fiberLengths) {
-      this.fiberLengths = [];
+      this.fiberLengths = new Uint32Array(n_count);
       for (let i = 0; i < n_count; i++) {
         const vStart3 = offsetPt0[i] * 3;
         const vEnd3 = (offsetPt0[i + 1] - 1) * 3;
@@ -14981,7 +15146,7 @@ var NVMesh = class _NVMesh {
           const v = vec34.fromValues(pts[j + 0] - pts[j + 3], pts[j + 1] - pts[j + 4], pts[j + 2] - pts[j + 5]);
           len += vec34.len(v);
         }
-        this.fiberLengths.push(len);
+        this.fiberLengths[i] = len;
       }
     }
     const posClrF32 = new Float32Array(npt * 4);
@@ -15194,119 +15359,12 @@ var NVMesh = class _NVMesh {
     } else {
       this.indexCount = indices.length;
       gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
-      gl.bufferData(gl.ARRAY_BUFFER, new Uint32Array(posClrU32), gl.STATIC_DRAW);
+      gl.bufferData(gl.ARRAY_BUFFER, Uint32Array.from(posClrU32), gl.STATIC_DRAW);
       gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
-      gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint32Array(indices), gl.STATIC_DRAW);
+      gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, Uint32Array.from(indices), gl.STATIC_DRAW);
     }
   }
   // updateFibers()
-  // internal function filters connectome to identify which color, size and visibility of nodes and edges
-  updateConnectome(gl) {
-    const tris = [];
-    const nNode = this.nodes.X.length;
-    let hasEdges = false;
-    if (nNode > 1 && this.edges) {
-      let nEdges = this.edges.length;
-      if (nEdges = nNode * nNode) {
-        hasEdges = true;
-      } else {
-        log.warn("Expected %d edges not %d", nNode * nNode, nEdges);
-      }
-    }
-    const pts = [];
-    const rgba255 = [];
-    let lut = cmapper.colormap(this.nodeColormap, this.colormapInvert);
-    let lutNeg = cmapper.colormap(this.nodeColormapNegative, this.colormapInvert);
-    let hasNeg = this.nodeColormapNegative !== void 0;
-    let min = this.nodeMinColor;
-    let max = this.nodeMaxColor;
-    for (let i = 0; i < nNode; i++) {
-      const radius = this.nodes.Size[i] * this.nodeScale;
-      if (radius <= 0) {
-        continue;
-      }
-      let color = this.nodes.Color[i];
-      let isNeg = false;
-      if (hasNeg && color < 0) {
-        isNeg = true;
-        color = -color;
-      }
-      if (min < max) {
-        if (color < min) {
-          continue;
-        }
-        color = (color - min) / (max - min);
-      } else {
-        color = 1;
-      }
-      color = Math.round(Math.max(Math.min(255, color * 255))) * 4;
-      let rgba = [lut[color], lut[color + 1], lut[color + 2], 255];
-      if (isNeg) {
-        rgba = [lutNeg[color], lutNeg[color + 1], lutNeg[color + 2], 255];
-      }
-      const pt = [
-        this.nodes.X[i],
-        this.nodes.Y[i],
-        this.nodes.Z[i]
-      ];
-      NiivueObject3D.makeColoredSphere(pts, tris, rgba255, radius, pt, rgba);
-    }
-    if (hasEdges) {
-      lut = cmapper.colormap(this.edgeColormap, this.colormapInvert);
-      lutNeg = cmapper.colormap(this.edgeColormapNegative, this.colormapInvert);
-      hasNeg = this.edgeColormapNegative !== void 0;
-      min = this.edgeMin;
-      max = this.edgeMax;
-      for (let i = 0; i < nNode - 1; i++) {
-        for (let j = i + 1; j < nNode; j++) {
-          let color = this.edges[i * nNode + j];
-          let isNeg = false;
-          if (hasNeg && color < 0) {
-            isNeg = true;
-            color = -color;
-          }
-          const radius = color * this.edgeScale;
-          if (radius <= 0) {
-            continue;
-          }
-          if (min < max) {
-            if (color < min) {
-              continue;
-            }
-            color = (color - min) / (max - min);
-          } else {
-            color = 1;
-          }
-          color = Math.round(Math.max(Math.min(255, color * 255))) * 4;
-          let rgba = [lut[color], lut[color + 1], lut[color + 2], 255];
-          if (isNeg) {
-            rgba = [lutNeg[color], lutNeg[color + 1], lutNeg[color + 2], 255];
-          }
-          const pti = [
-            this.nodes.X[i],
-            this.nodes.Y[i],
-            this.nodes.Z[i]
-          ];
-          const ptj = [
-            this.nodes.X[j],
-            this.nodes.Y[j],
-            this.nodes.Z[j]
-          ];
-          NiivueObject3D.makeColoredCylinder(pts, tris, rgba255, pti, ptj, radius, rgba);
-        }
-      }
-    }
-    const obj = NVMeshUtilities.getExtents(pts);
-    this.furthestVertexFromOrigin = obj.mxDx;
-    this.extentsMin = obj.extentsMin;
-    this.extentsMax = obj.extentsMax;
-    const posNormClr = this.generatePosNormClr(pts, tris, rgba255);
-    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
-    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Int32Array(tris), gl.STATIC_DRAW);
-    gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(posNormClr), gl.STATIC_DRAW);
-    this.indexCount = tris.length;
-  }
   // given X,Y,Z coordinates in world space, return index of nearest vertex as well as
   // the distance of this closest vertex to the coordinates
   indexNearestXYZmm(Xmm, Ymm, Zmm) {
@@ -15334,7 +15392,6 @@ var NVMesh = class _NVMesh {
       return;
     }
     if (this.hasConnectome) {
-      this.updateConnectome(gl);
       return;
     }
     if (!this.pts || !this.tris || !this.rgba255) {
@@ -15359,6 +15416,9 @@ var NVMesh = class _NVMesh {
         if (opacity <= 0 || layer.cal_min > layer.cal_max) {
           continue;
         }
+        if (layer.outlineBorder === void 0) {
+          layer.outlineBorder = 0;
+        }
         if (layer.isAdditiveBlend === void 0) {
           layer.isAdditiveBlend = false;
         }
@@ -15380,23 +15440,23 @@ var NVMesh = class _NVMesh {
             rgba8[k + 2] = lut2[idx + 2];
             k += 4;
           }
-          let opaque = new Array(nvtx).fill(true);
-          if (layer.isOutlineBorder) {
+          let opaque = new Array(nvtx).fill(false);
+          if (layer.outlineBorder > 0) {
             opaque = NVMeshUtilities.getClusterBoundary(rgba8, this.tris);
           }
           k = 0;
           for (let j = 0; j < layer.values.length; j++) {
-            if (!opaque[j]) {
-              k += 4;
-              continue;
+            let opa = opacity;
+            if (opaque[j]) {
+              opa = layer.outlineBorder;
             }
             let vtx = j * 28 + 24;
             if (this.f32PerVertex !== 7) {
               vtx = j * 20 + 16;
             }
-            u8[vtx + 0] = lerp(u8[vtx + 0], rgba8[k + 0], opacity);
-            u8[vtx + 1] = lerp(u8[vtx + 1], rgba8[k + 1], opacity);
-            u8[vtx + 2] = lerp(u8[vtx + 2], rgba8[k + 2], opacity);
+            u8[vtx + 0] = lerp(u8[vtx + 0], rgba8[k + 0], opa);
+            u8[vtx + 1] = lerp(u8[vtx + 1], rgba8[k + 1], opa);
+            u8[vtx + 2] = lerp(u8[vtx + 2], rgba8[k + 2], opa);
             k += 4;
           }
           continue;
@@ -15404,7 +15464,7 @@ var NVMesh = class _NVMesh {
         if (layer.values instanceof Uint8Array) {
           const rgba8 = new Uint8Array(layer.values.buffer);
           let opaque = new Array(nvtx).fill(true);
-          if (layer.isOutlineBorder) {
+          if (layer.outlineBorder > 0) {
             opaque = NVMeshUtilities.getClusterBoundary(rgba8, this.tris);
           }
           let k = 0;
@@ -15413,14 +15473,13 @@ var NVMesh = class _NVMesh {
             if (this.f32PerVertex !== 7) {
               vtx = j * 20 + 16;
             }
-            if (!opaque[j]) {
-              u8[vtx + 3] = 0;
-              k += 4;
-              continue;
+            let opa = opacity;
+            if (opaque[j]) {
+              opa = layer.outlineBorder;
             }
-            u8[vtx + 0] = lerp(u8[vtx + 0], rgba8[k + 0], opacity);
-            u8[vtx + 1] = lerp(u8[vtx + 1], rgba8[k + 1], opacity);
-            u8[vtx + 2] = lerp(u8[vtx + 2], rgba8[k + 2], opacity);
+            u8[vtx + 0] = lerp(u8[vtx + 0], rgba8[k + 0], opa);
+            u8[vtx + 1] = lerp(u8[vtx + 1], rgba8[k + 1], opa);
+            u8[vtx + 2] = lerp(u8[vtx + 2], rgba8[k + 2], opa);
             k += 4;
           }
           continue;
@@ -15447,7 +15506,7 @@ var NVMesh = class _NVMesh {
         if (!layer.isTransparentBelowCalMin) {
           mnCal = Number.NEGATIVE_INFINITY;
         }
-        if (!layer.isOutlineBorder) {
+        if (layer.outlineBorder <= 0) {
           for (let j = 0; j < nvtx; j++) {
             const v = layer.values[j + frameOffset];
             if (v < mnCal) {
@@ -15470,9 +15529,10 @@ var NVMesh = class _NVMesh {
               additiveRGBA[j4 + 2] = additiveBlend(additiveRGBA[j4 + 2], lut[v255 + 2]);
               additiveRGBA[j4 + 3] = additiveBlend(additiveRGBA[j4 + 3], 255);
             } else {
-              u8[vtx + 0] = lerp(u8[vtx + 0], lut[v255 + 0], opacity);
-              u8[vtx + 1] = lerp(u8[vtx + 1], lut[v255 + 1], opacity);
-              u8[vtx + 2] = lerp(u8[vtx + 2], lut[v255 + 2], opacity);
+              const opa = opacity;
+              u8[vtx + 0] = lerp(u8[vtx + 0], lut[v255 + 0], opa);
+              u8[vtx + 1] = lerp(u8[vtx + 1], lut[v255 + 1], opa);
+              u8[vtx + 2] = lerp(u8[vtx + 2], lut[v255 + 2], opa);
             }
           }
         } else {
@@ -15487,23 +15547,26 @@ var NVMesh = class _NVMesh {
           }
           const opaque = NVMeshUtilities.getClusterBoundaryU8(v255s, this.tris);
           for (let j = 0; j < nvtx; j++) {
-            let v255 = 255;
-            if (!opaque[j]) {
+            if (v255s[j] < 1) {
               continue;
             }
-            v255 = Math.min(255, v255) * 4;
+            let opa = opacity;
+            if (opaque[j]) {
+              opa = layer.outlineBorder;
+            }
+            const v255 = v255s[j] * 4;
             let vtx = j * 28 + 24;
             if (this.f32PerVertex !== 7) {
               vtx = j * 20 + 16;
             }
-            u8[vtx + 0] = lerp(u8[vtx + 0], lut[v255 + 0], opacity);
-            u8[vtx + 1] = lerp(u8[vtx + 1], lut[v255 + 1], opacity);
-            u8[vtx + 2] = lerp(u8[vtx + 2], lut[v255 + 2], opacity);
+            u8[vtx + 0] = lerp(u8[vtx + 0], lut[v255 + 0], opa);
+            u8[vtx + 1] = lerp(u8[vtx + 1], lut[v255 + 1], opa);
+            u8[vtx + 2] = lerp(u8[vtx + 2], lut[v255 + 2], opa);
           }
         }
         if (layer.useNegativeCmap) {
           const lut2 = cmapper.colormap(layer.colormapNegative, layer.colormapInvert);
-          if (!layer.isOutlineBorder) {
+          if (layer.outlineBorder <= 0) {
             let mn2 = layer.cal_min;
             let mx = layer.cal_max;
             if (isFinite(layer.cal_minNeg) && isFinite(layer.cal_minNeg)) {
@@ -15560,17 +15623,18 @@ var NVMesh = class _NVMesh {
             const opaque = NVMeshUtilities.getClusterBoundaryU8(v255s, this.tris);
             for (let j = 0; j < nvtx; j++) {
               let v255 = 255;
-              if (!opaque[j]) {
-                continue;
+              let opa = opacity;
+              if (opaque[j]) {
+                opa = layer.outlineBorder;
               }
               v255 = Math.min(255, v255) * 4;
               let vtx = j * 28 + 24;
               if (this.f32PerVertex !== 7) {
                 vtx = j * 20 + 16;
               }
-              u8[vtx + 0] = lerp(u8[vtx + 0], lut2[v255 + 0], opacity);
-              u8[vtx + 1] = lerp(u8[vtx + 1], lut2[v255 + 1], opacity);
-              u8[vtx + 2] = lerp(u8[vtx + 2], lut2[v255 + 2], opacity);
+              u8[vtx + 0] = lerp(u8[vtx + 0], lut2[v255 + 0], opa);
+              u8[vtx + 1] = lerp(u8[vtx + 1], lut2[v255 + 1], opa);
+              u8[vtx + 2] = lerp(u8[vtx + 2], lut2[v255 + 2], opa);
             }
           }
         }
@@ -15600,9 +15664,9 @@ var NVMesh = class _NVMesh {
       }
     }
     gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
-    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Int32Array(this.tris), gl.STATIC_DRAW);
+    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, Uint32Array.from(this.tris), gl.STATIC_DRAW);
     gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(posNormClr), gl.STATIC_DRAW);
+    gl.bufferData(gl.ARRAY_BUFFER, Float32Array.from(posNormClr), gl.STATIC_DRAW);
     this.indexCount = this.tris.length;
     this.vertexCount = this.pts.length;
   }
@@ -15689,75 +15753,10 @@ var NVMesh = class _NVMesh {
     }
     return f32;
   }
-  static loadConnectomeFromFreeSurfer(json, gl, name = "", opacity = 1, visible = true) {
-    let isValid = true;
-    if (json.data_type === void 0) {
-      isValid = false;
-    } else if (json.data_type !== "fs_pointset") {
-      isValid = false;
-    }
-    if (json.points === void 0) {
-      isValid = false;
-    }
-    if (!isValid) {
-      throw Error("not a valid FreeSurfer json pointset");
-    }
-    const jcon = {
-      nodes: {
-        names: [],
-        prefilled: [],
-        X: [],
-        Y: [],
-        Z: [],
-        Color: [],
-        Size: []
-      },
-      edges: [],
-      // @ts-expect-error not sure where this should come from
-      name: this.data_type
-    };
-    if (!json.points) {
-      throw new Error("points are not set!");
-    }
-    for (let i = 0; i < json.points.length; i++) {
-      let name2 = "";
-      if (json.points[i].comments) {
-        if (json.points[i].comments[0].text) {
-          name2 = json.points[i].comments[0].text;
-        }
-      }
-      jcon.nodes.names.push(name2);
-      let prefilled = "";
-      if (json.points[i].comments) {
-        if (json.points[i].comments[0].prefilled) {
-          prefilled = json.points[i].comments[0].prefilled;
-        }
-      }
-      jcon.nodes.prefilled.push(prefilled);
-      jcon.nodes.X.push(json.points[i].coordinates.x);
-      jcon.nodes.Y.push(json.points[i].coordinates.y);
-      jcon.nodes.Z.push(json.points[i].coordinates.z);
-      jcon.nodes.Color.push(1);
-      jcon.nodes.Size.push(1);
-    }
-    return new _NVMesh([], [], name, [], opacity, visible, gl, jcon);
-  }
-  // loadConnectomeFromFreeSurfer
-  // read connectome saved as JSON
-  static loadConnectomeFromJSON(json, gl, name = "", opacity = 1, visible = true) {
-    if ("name" in json) {
-      name = this.name;
-    }
-    if (!("nodes" in json)) {
-      throw Error("not a valid jcon connectome file");
-    }
-    return new _NVMesh([], [], name, [], opacity, visible, gl, json);
-  }
-  // loadConnectomeFromJSON()
   // wrapper to read meshes, tractograms and connectomes regardless of format
-  static readMesh(buffer, name, gl, opacity = 1, rgba255 = [255, 255, 255, 255], visible = true) {
-    let tris = [];
-    let pts = [];
+  static readMesh(buffer, name, gl, opacity = 1, rgba255 = new Uint8Array([255, 255, 255, 255]), visible = true) {
+    let tris = new Uint32Array([]);
+    let pts = new Float32Array([]);
     let anatomicalStructurePrimary = "";
     let obj;
     const re = /(?:\.([^.]+))?$/;
@@ -15768,12 +15767,12 @@ var NVMesh = class _NVMesh {
       ext = ext.toUpperCase();
     }
     if (ext === "JCON") {
-      return _NVMesh.loadConnectomeFromJSON(JSON.parse(new TextDecoder().decode(buffer)), gl, name, opacity);
+      log.error("you should never see this message: load using nvconnectome not nvmesh");
     }
     if (ext === "JSON") {
-      return _NVMesh.loadConnectomeFromFreeSurfer(JSON.parse(new TextDecoder().decode(buffer)), gl, name, opacity);
+      log.error("you should never see this message: load using nvconnectome not nvmesh");
     }
-    rgba255[3] = Math.max(0, rgba255[3]);
+    rgba255[3] = Math.max(1, rgba255[3]);
     if (ext === "TCK" || ext === "TRK" || ext === "TT" || ext === "TRX" || ext === "TRACT") {
       if (ext === "TCK") {
         obj = NVMeshLoaders.readTCK(buffer);
@@ -15787,12 +15786,12 @@ var NVMesh = class _NVMesh {
         obj = NVMeshLoaders.readTRK(buffer);
       }
       if (typeof obj === "undefined") {
-        const pts2 = [0, 0, 0, 0, 0, 0];
-        const offsetPt0 = [0];
+        const pts2 = new Float32Array([0, 0, 0, 0, 0, 0]);
+        const offsetPt0 = new Uint32Array([0]);
         obj = { pts: pts2, offsetPt0 };
         log.error("Creating empty tracts");
       }
-      rgba255[3] = -1;
+      rgba255[3] = 0;
       return new _NVMesh(
         obj.pts,
         obj.offsetPt0,
@@ -15840,10 +15839,10 @@ var NVMesh = class _NVMesh {
     } else if (ext === "FIB" || ext === "VTK") {
       obj = NVMeshLoaders.readVTK(buffer);
       if ("offsetPt0" in obj) {
-        rgba255[3] = -1;
+        rgba255[3] = 0;
         return new _NVMesh(
-          Array.from(obj.pts),
-          Array.from(obj.offsetPt0),
+          obj.pts,
+          obj.offsetPt0,
           name,
           rgba255,
           // colormap,
@@ -15874,20 +15873,21 @@ var NVMesh = class _NVMesh {
     if (!obj.indices) {
       throw new Error("indices not loaded");
     }
-    pts = Array.from(obj.positions);
-    tris = Array.from(obj.indices);
+    pts = obj.positions;
+    tris = obj.indices;
     if ("rgba255" in obj && obj.rgba255.length > 0) {
       rgba255 = obj.rgba255;
     }
     if ("colors" in obj && obj.colors && obj.colors.length === pts.length) {
-      rgba255 = [];
       const n = pts.length / 3;
+      rgba255 = new Uint8Array(n * 4);
       let c = 0;
+      let k = 0;
       for (let i = 0; i < n; i++) {
-        rgba255.push(obj.colors[c] * 255);
-        rgba255.push(obj.colors[c + 1] * 255);
-        rgba255.push(obj.colors[c + 2] * 255);
-        rgba255.push(255);
+        rgba255[k++] = obj.colors[c] * 255;
+        rgba255[k++] = obj.colors[c + 1] * 255;
+        rgba255[k++] = obj.colors[c + 2] * 255;
+        rgba255[k++] = 255;
         c += 3;
       }
     }
@@ -15896,6 +15896,7 @@ var NVMesh = class _NVMesh {
     if (ntri < 1 || npt < 3) {
       throw new Error("Mesh should have at least one triangle and three vertices");
     }
+    rgba255[3] = Math.max(1, rgba255[3]);
     const nvm = new _NVMesh(
       pts,
       tris,
@@ -16039,7 +16040,7 @@ var NVMesh = class _NVMesh {
       throw Error(response.statusText);
     }
     const buffer = await response.arrayBuffer();
-    const nvmesh = await this.readMesh(buffer, name, gl, opacity, rgba255, visible);
+    const nvmesh = await this.readMesh(buffer, name, gl, opacity, new Uint8Array(rgba255), visible);
     if (!layers || layers.length < 1) {
       return nvmesh;
     }
@@ -16082,7 +16083,7 @@ var NVMesh = class _NVMesh {
       throw new Error("rendering context must be set");
     }
     const buffer = await _NVMesh.readFileAsync(file);
-    const nvmesh = _NVMesh.readMesh(buffer, name, gl, opacity, rgba255, visible);
+    const nvmesh = _NVMesh.readMesh(buffer, name, gl, opacity, new Uint8Array(rgba255), visible);
     if (!layers || layers.length < 1) {
       return nvmesh;
     }
@@ -16120,7 +16121,7 @@ var NVMesh = class _NVMesh {
       return bytes.buffer;
     }
     const buffer = base64ToArrayBuffer(base64);
-    const nvmesh = await _NVMesh.readMesh(buffer, name, gl, opacity, rgba255, visible);
+    const nvmesh = await _NVMesh.readMesh(buffer, name, gl, opacity, new Uint8Array(rgba255), visible);
     if (!layers || layers.length < 1) {
       return nvmesh;
     }
@@ -16210,7 +16211,7 @@ var NVMesh = class _NVMesh {
     return NVMeshLoaders.readTSF(buffer);
   }
   static readTT(buffer) {
-    return NVMeshLoaders.readTRX(buffer);
+    return NVMeshLoaders.readTT(buffer);
   }
   static readTRX(buffer) {
     return NVMeshLoaders.readTRX(buffer);
@@ -17950,7 +17951,7 @@ var NVIMAGE_TYPE = Object.freeze({
     return imageType;
   }
 });
-var NVImageFromUrlOptions = (url, urlImageData = "", name = "", colormap = "gray", opacity = 1, cal_min = NaN, cal_max = NaN, trustCalMinMax = true, percentileFrac = 0.02, ignoreZeroVoxels = false, visible = true, useQFormNotSForm = false, colormapNegative = "", frame4D = 0, imageType = NVIMAGE_TYPE.UNKNOWN, cal_minNeg = NaN, cal_maxNeg = NaN, colorbarVisible = true, alphaThreshold = false, colormapLabel = []) => {
+var NVImageFromUrlOptions = (url, urlImageData = "", name = "", colormap = "gray", opacity = 1, cal_min = NaN, cal_max = NaN, trustCalMinMax = true, percentileFrac = 0.02, ignoreZeroVoxels = false, useQFormNotSForm = false, colormapNegative = "", frame4D = 0, imageType = NVIMAGE_TYPE.UNKNOWN, cal_minNeg = NaN, cal_maxNeg = NaN, colorbarVisible = true, alphaThreshold = false, colormapLabel = []) => {
   return {
     url,
     urlImageData,
@@ -17963,7 +17964,6 @@ var NVImageFromUrlOptions = (url, urlImageData = "", name = "", colormap = "gray
     trustCalMinMax,
     percentileFrac,
     ignoreZeroVoxels,
-    visible,
     useQFormNotSForm,
     colormapNegative,
     imageType,
@@ -18165,7 +18165,6 @@ var NVImage = class _NVImage {
    * @param trustCalMinMax - whether or not to trust cal_min and cal_max from the nifti header (trusting results in faster loading)
    * @param percentileFrac - the percentile to use for setting the robust range of the display values (smart intensity setting for images with large ranges)
    * @param ignoreZeroVoxels - whether or not to ignore zero voxels in setting the robust range of display values
-   * @param visible - whether or not this image is to be visible
    * @param useQFormNotSForm - give precedence to QForm (Quaternion) or SForm (Matrix)
    * @param colormapNegative - a color map to use for symmetrical negative intensities
    * @param frame4D - volume displayed, 0 indexed, must be less than nFrame4D
@@ -18181,7 +18180,7 @@ var NVImage = class _NVImage {
    * @param colorbarVisible - TODO
    * @param colormapLabel - TODO
    */
-  constructor(dataBuffer = null, name = "", colormap = "gray", opacity = 1, pairedImgData = null, cal_min = NaN, cal_max = NaN, trustCalMinMax = true, percentileFrac = 0.02, ignoreZeroVoxels = false, visible = true, useQFormNotSForm = false, colormapNegative = "", frame4D = 0, imageType = NVIMAGE_TYPE.UNKNOWN, cal_minNeg = NaN, cal_maxNeg = NaN, colorbarVisible = true, colormapLabel = null) {
+  constructor(dataBuffer = null, name = "", colormap = "gray", opacity = 1, pairedImgData = null, cal_min = NaN, cal_max = NaN, trustCalMinMax = true, percentileFrac = 0.02, ignoreZeroVoxels = false, useQFormNotSForm = false, colormapNegative = "", frame4D = 0, imageType = NVIMAGE_TYPE.UNKNOWN, cal_minNeg = NaN, cal_maxNeg = NaN, colorbarVisible = true, colormapLabel = null) {
     __publicField(this, "name");
     __publicField(this, "id");
     __publicField(this, "url");
@@ -18202,7 +18201,6 @@ var NVImage = class _NVImage {
     __publicField(this, "cal_minNeg");
     __publicField(this, "cal_maxNeg");
     __publicField(this, "colorbarVisible", true);
-    __publicField(this, "visible");
     __publicField(this, "modulationImage", null);
     __publicField(this, "modulateAlpha", 0);
     // if !=0, mod transparency with expon power |Alpha|
@@ -18305,7 +18303,6 @@ var NVImage = class _NVImage {
     this.cal_minNeg = cal_minNeg;
     this.cal_maxNeg = cal_maxNeg;
     this.colorbarVisible = colorbarVisible;
-    this.visible = visible;
     this.useQFormNotSForm = useQFormNotSForm;
     if (!dataBuffer) {
       return;
@@ -20568,7 +20565,6 @@ var NVImage = class _NVImage {
     trustCalMinMax = true,
     percentileFrac = 0.02,
     ignoreZeroVoxels = false,
-    visible = true,
     useQFormNotSForm = false,
     colormapNegative = "",
     frame4D = 0,
@@ -20710,7 +20706,6 @@ var NVImage = class _NVImage {
       trustCalMinMax,
       percentileFrac,
       ignoreZeroVoxels,
-      visible,
       useQFormNotSForm,
       colormapNegative,
       frame4D,
@@ -20755,7 +20750,6 @@ var NVImage = class _NVImage {
     trustCalMinMax = true,
     percentileFrac = 0.02,
     ignoreZeroVoxels = false,
-    visible = true,
     useQFormNotSForm = false,
     colormapNegative = "",
     frame4D = 0,
@@ -20845,7 +20839,6 @@ var NVImage = class _NVImage {
         trustCalMinMax,
         percentileFrac,
         ignoreZeroVoxels,
-        visible,
         useQFormNotSForm,
         colormapNegative,
         frame4D,
@@ -20877,8 +20870,7 @@ var NVImage = class _NVImage {
     cal_max = NaN,
     trustCalMinMax = true,
     percentileFrac = 0.02,
-    ignoreZeroVoxels = false,
-    visible = true
+    ignoreZeroVoxels = false
   }) {
     function base64ToArrayBuffer(base642) {
       const binary_string = window.atob(base642);
@@ -20903,8 +20895,7 @@ var NVImage = class _NVImage {
         cal_max,
         trustCalMinMax,
         percentileFrac,
-        ignoreZeroVoxels,
-        visible
+        ignoreZeroVoxels
       );
     } catch (err) {
       log.debug(err);
@@ -20923,7 +20914,7 @@ var NVImage = class _NVImage {
    */
   clone() {
     const clonedImage = new _NVImage();
-    clonedImage.id = this.id;
+    clonedImage.id = uuidv42();
     clonedImage.hdr = Object.assign({}, this.hdr);
     clonedImage.img = this.img.slice();
     clonedImage.calculateRAS();
@@ -21172,8 +21163,6 @@ var NVImage = class _NVImage {
       // percentileFrac
       this.ignoreZeroVoxels,
       // ignoreZeroVoxels
-      this.visible,
-      // visible
       this.useQFormNotSForm,
       // useQFormNotSForm
       this.colormapNegative,
@@ -21356,6 +21345,7 @@ var DEFAULT_OPTIONS = {
   textHeight: 0.06,
   colorbarHeight: 0.05,
   crosshairWidth: 1,
+  crosshairGap: 0,
   rulerWidth: 4,
   show3Dcrosshair: false,
   backColor: [0, 0, 0, 1],
@@ -21373,7 +21363,7 @@ var DEFAULT_OPTIONS = {
   keyDebounceTime: 50,
   isNearestInterpolation: false,
   isResizeCanvas: true,
-  isAtlasOutline: false,
+  atlasOutline: 0,
   isRuler: false,
   isColorbar: false,
   isOrientCube: false,
@@ -21649,7 +21639,6 @@ var NVDocument = class _NVDocument {
           trustCalMinMax: true,
           percentileFrac: 0.02,
           ignoreZeroVoxels: false,
-          visible: true,
           useQFormNotSForm: false,
           colormapNegative: "",
           colormapLabel: [],
@@ -21695,7 +21684,6 @@ var NVDocument = class _NVDocument {
             trustCalMinMax: true,
             percentileFrac: 0.02,
             ignoreZeroVoxels: false,
-            visible: true,
             useQFormNotSForm: false,
             colormapNegative: "",
             colormapLabel: [],
@@ -21737,7 +21725,7 @@ var NVDocument = class _NVDocument {
         pts: mesh.pts,
         tris: mesh.tris,
         name: mesh.name,
-        rgba255: mesh.rgba255,
+        rgba255: Uint8Array.from(mesh.rgba255),
         opacity: mesh.opacity,
         connectome: mesh.connectome,
         dpg: mesh.dpg,
@@ -21748,7 +21736,7 @@ var NVDocument = class _NVDocument {
           values: layer.values,
           nFrame4D: layer.nFrame4D,
           frame4D: 0,
-          isOutlineBorder: layer.isOutlineBorder,
+          outlineBorder: layer.outlineBorder,
           global_min: layer.global_min,
           global_max: layer.global_max,
           cal_min: layer.cal_min,
@@ -21774,6 +21762,7 @@ var NVDocument = class _NVDocument {
         nodeMaxColor: mesh.nodeMaxColor,
         nodeMinColor: mesh.nodeMinColor,
         nodeScale: mesh.nodeScale,
+        legendLineThickness: mesh.legendLineThickness,
         offsetPt0: mesh.offsetPt0,
         nodes: mesh.nodes
       };
@@ -21917,14 +21906,14 @@ var defaultOptions = {
   edgeColormapNegative: "winter",
   edgeMin: 2,
   edgeMax: 6,
-  edgeScale: 1
+  edgeScale: 1,
+  legendLineThickness: 0
 };
 var NVConnectome = class _NVConnectome extends NVMesh {
   constructor(gl, connectome) {
-    super([], [], connectome.name, [], 1, true, gl, connectome);
+    super(new Float32Array([]), new Uint32Array([]), connectome.name, new Uint8Array([]), 1, true, gl, connectome);
     __publicField(this, "gl");
     __publicField(this, "nodesChanged");
-    __publicField(this, "legendLineThickness");
     this.gl = gl;
     this.type = "connectome" /* CONNECTOME */;
     if (this.nodes) {
@@ -22200,19 +22189,22 @@ var NVConnectome = class _NVConnectome extends NVMesh {
       const ptj = vec38.fromValues(nodes[edge.second].x, nodes[edge.second].y, nodes[edge.second].z);
       NiivueObject3D.makeColoredCylinder(pts, tris, rgba255, pti, ptj, radius, rgba);
     }
-    const obj = NVMeshUtilities.getExtents(pts);
+    const pts32 = new Float32Array(pts);
+    const tris32 = new Uint32Array(tris);
+    const obj = NVMeshUtilities.getExtents(pts32);
     this.furthestVertexFromOrigin = obj.mxDx;
     this.extentsMin = obj.extentsMin;
     this.extentsMax = obj.extentsMax;
-    const posNormClr = this.generatePosNormClr(pts, tris, rgba255);
+    const posNormClr = this.generatePosNormClr(pts32, tris32, new Uint8Array(rgba255));
     gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
-    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Int32Array(tris), gl.STATIC_DRAW);
+    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, Uint32Array.from(tris32), gl.STATIC_DRAW);
     gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(posNormClr), gl.STATIC_DRAW);
+    gl.bufferData(gl.ARRAY_BUFFER, Float32Array.from(posNormClr), gl.STATIC_DRAW);
     this.indexCount = tris.length;
   }
   updateMesh(gl) {
     this.updateConnectome(gl);
+    this.updateLabels();
   }
   json() {
     const json = {};
@@ -23013,6 +23005,22 @@ var MESH_EXTENSIONS = [
 var LEFT_MOUSE_BUTTON = 0;
 var CENTER_MOUSE_BUTTON = 1;
 var RIGHT_MOUSE_BUTTON = 2;
+var TEXTURE0_BACK_VOL = 33984;
+var TEXTURE1_COLORMAPS = 33985;
+var TEXTURE2_OVERLAY_VOL = 33986;
+var TEXTURE3_FONT = 33987;
+var TEXTURE4_THUMBNAIL = 33988;
+var TEXTURE5_MATCAP = 33989;
+var TEXTURE6_GRADIENT = 33990;
+var TEXTURE7_DRAW = 33991;
+var TEXTURE8_GRADIENT_TEMP = 33992;
+var TEXTURE9_ORIENT = 33993;
+var TEXTURE10_BLEND = 33994;
+var TEXTURE11_GC_BACK = 33995;
+var TEXTURE12_GC_STRENGTH0 = 33996;
+var TEXTURE13_GC_STRENGTH1 = 33997;
+var TEXTURE14_GC_LABEL0 = 33998;
+var TEXTURE15_GC_LABEL1 = 33999;
 var defaultSaveImageOptions = {
   filename: "",
   isSaveDrawing: false,
@@ -23115,6 +23123,8 @@ var Niivue = class _Niivue {
     __publicField(this, "position");
     __publicField(this, "extentsMin");
     __publicField(this, "extentsMax");
+    // ResizeObserver
+    __publicField(this, "resizeObserver", null);
     __publicField(this, "syncOpts", {});
     __publicField(this, "readyForSync", false);
     // UI Data
@@ -23140,13 +23150,7 @@ var Niivue = class _Niivue {
       dragEnd: [0, 0],
       dragClipPlaneStartDepthAziElev: [0, 0, 0],
       lastTwoTouchDistance: 0,
-      multiTouchGesture: false,
-      loading$: new Subject()
-      // whether or not the scene is loading
-    });
-    // mapping of keys (event strings) to rxjs subjects
-    __publicField(this, "eventsToSubjects", {
-      loading: this.uiData.loading$
+      multiTouchGesture: false
     });
     __publicField(this, "back", null);
     // base layer; defines image space to work in. Defined as this.volumes[0] in Niivue.loadVolumes
@@ -23435,8 +23439,6 @@ var Niivue = class _Niivue {
     __publicField(this, "initialized", false);
     __publicField(this, "currentDrawUndoBitmap");
     __publicField(this, "loadingText");
-    // rxjs subscriptions. Keeping a reference array like this allows us to unsubscribe later
-    __publicField(this, "subscriptions", []);
     for (const name in options) {
       if (typeof options[name] === "function") {
         this[name] = options[name];
@@ -23529,57 +23531,6 @@ var Niivue = class _Niivue {
     log.debug("attached to element with id: ", id);
     return this;
   }
-  // on handles matching event strings (event) with know rxjs subjects within NiiVue.
-  // if the event string exists (e.g. 'location') then the corresponding rxjs subject reference
-  // is extracted from this.eventsToSubjects and the callback passed as the second argument to NiiVue.on
-  // is added to the subsciptions to the next method. These callbacks are called whenever subject.next is called within
-  // various NiiVue methods.
-  /**
-   * register a callback function to run when known Niivue events happen
-   * @param event - the name of the event to watch for. Event names are shown in the type column
-   * @param callback - the function to call when the event happens
-   * @example
-   * niivue = new Niivue()
-   *
-   * // 'location' update event is fired when the crosshair changes position via user input
-   * function doSomethingWithLocationData(data)\{
-   *    // data has the shape \{mm: [N, N, N], vox: [N, N, N], frac: [N, N, N], values: this.volumes.map(v =\> \{return val\})\}
-   *    //...
-   * \}
-   */
-  on(event, callback) {
-    const knownEvents = Object.keys(this.eventsToSubjects);
-    if (!knownEvents.includes(event)) {
-      return;
-    }
-    const subject = this.eventsToSubjects[event];
-    const subscription = subject.subscribe({
-      next: (data) => callback(data)
-    });
-    this.subscriptions.push({ [event]: subscription });
-  }
-  /**
-   * off unsubscribes events and subjects (the opposite of on)
-   * @param event - the name of the event to watch for. Event names are shown in the type column
-   * @example
-   * niivue = new Niivue()
-   * niivue.off('location')
-   */
-  off(event) {
-    const knownEvents = Object.keys(this.eventsToSubjects);
-    if (!knownEvents.includes(event)) {
-      return;
-    }
-    const nsubs = this.subscriptions.length;
-    for (let i = 0; i < nsubs; i++) {
-      const key = Object.keys(this.subscriptions[i])[0];
-      if (key === event) {
-        this.subscriptions[i][event].unsubscribe();
-        this.subscriptions.splice(i, 1);
-        return;
-      }
-    }
-  }
   /**
    * attach the Niivue instance to a canvas element directly
    * @param canvas - the canvas element reference
@@ -23606,6 +23557,8 @@ var Niivue = class _Niivue {
       this.canvas.width = this.canvas.offsetWidth;
       this.canvas.height = this.canvas.offsetHeight;
       window.addEventListener("resize", this.resizeListener.bind(this));
+      this.resizeObserver = new ResizeObserver(this.resizeListener.bind(this));
+      this.resizeObserver.observe(this.canvas.parentElement);
     }
     this.registerInteractions();
     await this.init();
@@ -24263,6 +24216,12 @@ var Niivue = class _Niivue {
       this.moveCrosshairInVox(0, -1, 0);
     } else if (e.code === "KeyK" && this.opts.sliceType !== 4 /* RENDER */) {
       this.moveCrosshairInVox(0, 1, 0);
+    } else if (e.code === "KeyM" && this.opts.sliceType !== 4 /* RENDER */) {
+      this.opts.dragMode++;
+      if (this.opts.dragMode >= 4 /* slicer3D */) {
+        this.opts.dragMode = 0 /* none */;
+      }
+      log.info("drag mode changed to ", DRAG_MODE[this.opts.dragMode]);
     } else if (e.code === "ArrowLeft") {
       this.setFrame4D(this.volumes[0].id, this.volumes[0].frame4D - 1);
     } else if (e.code === "ArrowRight") {
@@ -24499,7 +24458,6 @@ var Niivue = class _Niivue {
                   gl: this.gl,
                   name: file.name
                 }).then((mesh) => {
-                  this.uiData.loading$.next(false);
                   this.addMesh(mesh);
                 }).catch((e2) => {
                   throw e2;
@@ -24576,6 +24534,9 @@ var Niivue = class _Niivue {
    * @see {@link https://niivue.github.io/niivue/features/layout.html|live demo usage}
    */
   setMultiplanarLayout(layout) {
+    if (typeof layout === "string") {
+      layout = parseInt(layout);
+    }
     this.opts.multiplanarLayout = layout;
     this.drawScene();
   }
@@ -24806,7 +24767,7 @@ var Niivue = class _Niivue {
     const perm = drawingBitmap.permRAS;
     const vx = dims[1] * dims[2] * dims[3];
     this.drawBitmap = new Uint8Array(vx);
-    this.drawTexture = this.r8Tex(this.drawTexture, this.gl.TEXTURE7, this.back.dims, true);
+    this.drawTexture = this.r8Tex(this.drawTexture, TEXTURE7_DRAW, this.back.dims, true);
     const layout = [0, 0, 0];
     for (let i = 0; i < 3; i++) {
       for (let j2 = 0; j2 < 3; j2++) {
@@ -25211,6 +25172,24 @@ var Niivue = class _Niivue {
     this.updateGLVolume();
     this.onMeshPropertyChanged(idx, key, val);
   }
+  /**
+   * returns the index of the mesh vertex that is closest to the provided coordinates
+   * @param id - identity of mesh to change
+   * @param Xmm - location in left/right dimension
+   * @param Ymm - location in posterior/anterior dimension
+   * @param Zmm - location in foot/head dimension
+   * @returns the an array where ret[0] is the mesh index and ret[1] is distance from vertex to coordinates
+   * @example niivue.indexNearestXYZmm(niivue.meshes[0].id, -22, 42, 13)
+   * @see {@link https://niivue.github.io/niivue/features/clipplanes.html | live demo usage}
+   */
+  indexNearestXYZmm(mesh, Xmm, Ymm, Zmm) {
+    const idx = this.getMeshIndexByID(mesh);
+    if (idx < 0) {
+      log.warn("indexNearestXYZmm() id not loaded", mesh);
+      return [NaN, NaN];
+    }
+    return this.meshes[idx].indexNearestXYZmm(Xmm, Ymm, Zmm);
+  }
   /**
    * reverse triangle winding of mesh (swap front and back faces)
    * @param id - identity of mesh to change
@@ -25996,14 +25975,8 @@ var Niivue = class _Niivue {
    * @see {@link https://niivue.github.io/niivue/features/mask.html|live demo usage}
    */
   async loadVolumes(volumeList) {
-    this.on("loading", (isLoading) => {
-      if (isLoading) {
-        this.loadingText = "loading...";
-        this.drawScene();
-      } else {
-        this.loadingText = this.opts.loadingText;
-      }
-    });
+    this.loadingText = "loading...";
+    this.drawScene();
     if (this.thumbnailVisible) {
       this.deferredVolumes = volumeList;
       return this;
@@ -26011,9 +25984,7 @@ var Niivue = class _Niivue {
     this.volumes = [];
     this.gl.clearColor(0, 0, 0, 1);
     this.gl.clear(this.gl.COLOR_BUFFER_BIT);
-    this.uiData.loading$.next(false);
     for (let i = 0; i < volumeList.length; i++) {
-      this.uiData.loading$.next(true);
       if (volumeList[i].colorMap !== void 0) {
         volumeList[i].colormap = volumeList[i].colorMap;
       }
@@ -26034,7 +26005,6 @@ var Niivue = class _Niivue {
         colorbarVisible: volumeList[i].colorbarVisible
       };
       await this.addVolumeFromUrl(imageOptions);
-      this.uiData.loading$.next(false);
     }
     return this;
   }
@@ -26043,6 +26013,16 @@ var Niivue = class _Niivue {
    * @see {@link https://niivue.github.io/niivue/features/multiuser.meshes.html|live demo usage}
    */
   async addMeshFromUrl(meshOptions) {
+    const ext = this.getFileExt(meshOptions.url);
+    if (ext === "JCON" || ext === "JSON") {
+      const response = await fetch(meshOptions.url, {});
+      const json = await response.json();
+      const mesh2 = this.loadConnectomeAsMesh(json);
+      this.mediaUrlMap.set(mesh2, meshOptions.url);
+      this.onMeshAddedFromUrl(meshOptions, mesh2);
+      this.addMesh(mesh2);
+      return mesh2;
+    }
     const mesh = await NVMesh.loadFromUrl({ ...meshOptions, gl: this.gl });
     this.mediaUrlMap.set(mesh, meshOptions.url);
     this.onMeshAddedFromUrl(meshOptions, mesh);
@@ -26059,14 +26039,8 @@ var Niivue = class _Niivue {
    * @see {@link https://niivue.github.io/niivue/features/meshes.html|live demo usage}
    */
   async loadMeshes(meshList) {
-    this.on("loading", (isLoading) => {
-      if (isLoading) {
-        this.loadingText = "loading...";
-        this.drawScene();
-      } else {
-        this.loadingText = this.opts.loadingText;
-      }
-    });
+    this.loadingText = "loading...";
+    this.drawScene();
     if (this.thumbnailVisible) {
       this.deferredMeshes = meshList;
       return this;
@@ -26076,11 +26050,8 @@ var Niivue = class _Niivue {
     this.meshes = [];
     this.gl.clearColor(0, 0, 0, 1);
     this.gl.clear(this.gl.COLOR_BUFFER_BIT);
-    this.uiData.loading$.next(false);
     for (let i = 0; i < meshList.length; i++) {
-      this.uiData.loading$.next(true);
       await this.addMeshFromUrl(meshList[i]);
-      this.uiData.loading$.next(false);
     }
     this.drawScene();
     return this;
@@ -26133,6 +26104,22 @@ var Niivue = class _Niivue {
     );
     this.drawScene();
   }
+  loadConnectomeAsMesh(json) {
+    let connectome = json;
+    if ("data_type" in json && json.data_type === "fs_pointset") {
+      connectome = NVConnectome.convertFreeSurferConnectome(json);
+      log.warn("converted FreeSurfer connectome", connectome);
+    } else if ("nodes" in json) {
+      const nodes = json.nodes;
+      if ("names" in nodes && "X" in nodes && "Y" in nodes && "Z" in nodes && "Color" in nodes && "Size" in nodes) {
+        connectome = NVConnectome.convertLegacyConnectome(json);
+        log.warn("converted legacy connectome", connectome);
+      }
+    } else {
+      throw new Error("not a known connectome format");
+    }
+    return new NVConnectome(this.gl, connectome);
+  }
   /**
    * load a connectome specified by json
    * @param connectome - model
@@ -26140,27 +26127,13 @@ var Niivue = class _Niivue {
    * @see {@link https://niivue.github.io/niivue/features/connectome.html|live demo usage}
    */
   loadConnectome(json) {
-    this.on("loading", (isLoading) => {
-      if (isLoading) {
-        this.loadingText = "loading...";
-        this.drawScene();
-      } else {
-        this.loadingText = this.opts.loadingText;
-      }
-    });
+    this.loadingText = "loading...";
+    this.drawScene();
     this.meshes = [];
     this.gl.clearColor(0, 0, 0, 1);
     this.gl.clear(this.gl.COLOR_BUFFER_BIT);
-    this.uiData.loading$.next(true);
-    let connectome = json;
-    const nodes = json.nodes;
-    if ("names" in nodes && "X" in nodes && "Y" in nodes && "Z" in nodes && "Color" in nodes && "Size" in nodes) {
-      connectome = NVConnectome.convertLegacyConnectome(json);
-      log.warn("converted legacy connectome", connectome);
-    }
-    const mesh = new NVConnectome(this.gl, connectome);
+    const mesh = this.loadConnectomeAsMesh(json);
     this.addMesh(mesh);
-    this.uiData.loading$.next(false);
     this.drawScene();
     return this;
   }
@@ -26181,7 +26154,7 @@ var Niivue = class _Niivue {
     this.drawBitmap = new Uint8Array(vx);
     this.drawClearAllUndoBitmaps();
     this.drawAddUndoBitmap();
-    this.drawTexture = this.r8Tex(this.drawTexture, this.gl.TEXTURE7, this.back.dims, true);
+    this.drawTexture = this.r8Tex(this.drawTexture, TEXTURE7_DRAW, this.back.dims, true);
     this.refreshDrawing(false);
   }
   // not included in public docs
@@ -26242,29 +26215,29 @@ var Niivue = class _Niivue {
     gl.viewport(0, 0, this.back.dims[1], this.back.dims[2]);
     gl.disable(gl.BLEND);
     let img16 = img2ras16(this.back);
-    const background = this.r16Tex(null, gl.TEXTURE3, this.back.dims, img16);
+    const background = this.r16Tex(null, TEXTURE11_GC_BACK, this.back.dims, img16);
     for (let i = 1; i < nv; i++) {
       img16[i] = this.drawBitmap[i];
     }
-    const label0 = this.r16Tex(null, gl.TEXTURE6, this.back.dims, img16);
-    const label1 = this.r16Tex(null, gl.TEXTURE7, this.back.dims, img16);
+    const label0 = this.r16Tex(null, TEXTURE14_GC_LABEL0, this.back.dims, img16);
+    const label1 = this.r16Tex(null, TEXTURE15_GC_LABEL1, this.back.dims, img16);
     const kMAX_STRENGTH = 1e4;
     for (let i = 1; i < nv; i++) {
       if (img16[i] > 0) {
         img16[i] = kMAX_STRENGTH;
       }
     }
-    const strength0 = this.r16Tex(null, gl.TEXTURE4, this.back.dims, img16);
-    const strength1 = this.r16Tex(null, gl.TEXTURE5, this.back.dims, img16);
+    const strength0 = this.r16Tex(null, TEXTURE12_GC_STRENGTH0, this.back.dims, img16);
+    const strength1 = this.r16Tex(null, TEXTURE13_GC_STRENGTH1, this.back.dims, img16);
     gl.bindVertexArray(this.genericVAO);
     const shader = this.growCutShader;
     shader.use(gl);
     const iterations = 128;
     gl.uniform1i(shader.uniforms.finalPass, 0);
-    gl.uniform1i(shader.uniforms.inputTexture0, 3);
+    gl.uniform1i(shader.uniforms.backTex, 11);
     for (let j = 0; j < iterations; j++) {
-      gl.uniform1i(shader.uniforms.inputTexture1, 6);
-      gl.uniform1i(shader.uniforms.inputTexture2, 4);
+      gl.uniform1i(shader.uniforms.labelTex, 14);
+      gl.uniform1i(shader.uniforms.strengthTex, 12);
       for (let i = 0; i < this.back.dims[3]; i++) {
         const coordZ = 1 / this.back.dims[3] * (i + 0.5);
         gl.uniform1f(shader.uniforms.coordZ, coordZ);
@@ -26280,8 +26253,8 @@ var Niivue = class _Niivue {
       if (j === iterations - 1) {
         gl.uniform1i(shader.uniforms.finalPass, 1);
       }
-      gl.uniform1i(shader.uniforms.inputTexture1, 7);
-      gl.uniform1i(shader.uniforms.inputTexture2, 5);
+      gl.uniform1i(shader.uniforms.labelTex, 15);
+      gl.uniform1i(shader.uniforms.strengthTex, 13);
       for (let i = 0; i < this.back.dims[3]; i++) {
         const coordZ = 1 / this.back.dims[3] * (i + 0.5);
         gl.uniform1f(shader.uniforms.coordZ, coordZ);
@@ -26327,14 +26300,6 @@ var Niivue = class _Niivue {
     for (let i = 1; i < nv; i++) {
       this.drawBitmap[i] = img16[i];
     }
-    gl.activeTexture(gl.TEXTURE2);
-    gl.bindTexture(gl.TEXTURE_3D, this.overlayTexture);
-    gl.activeTexture(gl.TEXTURE3);
-    gl.bindTexture(gl.TEXTURE_2D, this.fontTexture);
-    gl.activeTexture(gl.TEXTURE4);
-    gl.bindTexture(gl.TEXTURE_2D, this.bmpTexture);
-    gl.activeTexture(gl.TEXTURE7);
-    gl.bindTexture(gl.TEXTURE_3D, this.drawTexture);
     gl.deleteTexture(background);
     gl.deleteTexture(strength0);
     gl.deleteTexture(strength1);
@@ -26760,7 +26725,7 @@ var Niivue = class _Niivue {
    */
   closeDrawing() {
     this.drawClearAllUndoBitmaps();
-    this.rgbaTex(this.drawTexture, this.gl.TEXTURE7, [2, 2, 2, 2], true);
+    this.rgbaTex(this.drawTexture, TEXTURE7_DRAW, [2, 2, 2, 2], true);
     this.drawBitmap = null;
     this.drawScene();
   }
@@ -26786,7 +26751,7 @@ var Niivue = class _Niivue {
     } else if (vx !== this.drawBitmap.length) {
       log.warn("Drawing bitmap must match the background image");
     }
-    this.gl.activeTexture(this.gl.TEXTURE7);
+    this.gl.activeTexture(TEXTURE7_DRAW);
     this.gl.bindTexture(this.gl.TEXTURE_3D, this.drawTexture);
     this.gl.texSubImage3D(
       this.gl.TEXTURE_3D,
@@ -26897,11 +26862,11 @@ var Niivue = class _Niivue {
           this.bmpTexture = this.gl.createTexture();
           pngTexture = this.bmpTexture;
           this.bmpTextureWH = img.width / img.height;
-          this.gl.activeTexture(this.gl.TEXTURE4);
+          this.gl.activeTexture(TEXTURE4_THUMBNAIL);
           this.bmpShader.use(this.gl);
           this.gl.uniform1i(this.bmpShader.uniforms.bmpTexture, 4);
         } else if (textureNum === 5) {
-          this.gl.activeTexture(this.gl.TEXTURE5);
+          this.gl.activeTexture(TEXTURE5_MATCAP);
           if (this.matCapTexture !== null) {
             this.gl.deleteTexture(this.matCapTexture);
           }
@@ -26909,7 +26874,7 @@ var Niivue = class _Niivue {
           pngTexture = this.matCapTexture;
         } else {
           this.fontShader.use(this.gl);
-          this.gl.activeTexture(this.gl.TEXTURE3);
+          this.gl.activeTexture(TEXTURE3_FONT);
           this.gl.uniform1i(this.fontShader.uniforms.fontTexture, 3);
           if (this.fontTexture !== null) {
             this.gl.deleteTexture(this.fontTexture);
@@ -27144,9 +27109,9 @@ var Niivue = class _Niivue {
     this.gl.cullFace(this.gl.FRONT);
     this.gl.enable(this.gl.BLEND);
     this.gl.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE_MINUS_SRC_ALPHA);
-    this.volumeTexture = this.rgbaTex(this.volumeTexture, this.gl.TEXTURE0, [2, 2, 2, 2], true);
-    this.overlayTexture = this.rgbaTex(this.overlayTexture, this.gl.TEXTURE2, [2, 2, 2, 2], true);
-    this.drawTexture = this.r8Tex(this.drawTexture, this.gl.TEXTURE7, [2, 2, 2, 2], true);
+    this.volumeTexture = this.rgbaTex(this.volumeTexture, TEXTURE0_BACK_VOL, [2, 2, 2, 2], true);
+    this.overlayTexture = this.rgbaTex(this.overlayTexture, TEXTURE2_OVERLAY_VOL, [2, 2, 2, 2], true);
+    this.drawTexture = this.r8Tex(this.drawTexture, TEXTURE7_DRAW, [2, 2, 2, 2], true);
     const rectStrip = [
       1,
       1,
@@ -27283,10 +27248,10 @@ var Niivue = class _Niivue {
     gl.disable(gl.CULL_FACE);
     gl.viewport(0, 0, hdr.dims[1], hdr.dims[2]);
     gl.disable(gl.BLEND);
-    const tempTex3D = this.rgbaTex(null, this.gl.TEXTURE5, hdr.dims);
+    const tempTex3D = this.rgbaTex(null, TEXTURE8_GRADIENT_TEMP, hdr.dims);
     const blurShader = this.blurShader;
     blurShader.use(gl);
-    gl.activeTexture(gl.TEXTURE0);
+    gl.activeTexture(TEXTURE0_BACK_VOL);
     gl.bindTexture(gl.TEXTURE_3D, this.volumeTexture);
     const blurRadius = 0.7;
     gl.uniform1i(blurShader.uniforms.intensityVol, 0);
@@ -27303,20 +27268,20 @@ var Niivue = class _Niivue {
     }
     const sobelShader = this.sobelShader;
     sobelShader.use(gl);
-    gl.activeTexture(gl.TEXTURE1);
+    gl.activeTexture(TEXTURE8_GRADIENT_TEMP);
     gl.bindTexture(gl.TEXTURE_3D, tempTex3D);
-    gl.uniform1i(sobelShader.uniforms.intensityVol, 1);
+    gl.uniform1i(sobelShader.uniforms.intensityVol, 8);
     const sobelRadius = 0.7;
     gl.uniform1f(sobelShader.uniforms.dX, sobelRadius / hdr.dims[1]);
     gl.uniform1f(sobelShader.uniforms.dY, sobelRadius / hdr.dims[2]);
     gl.uniform1f(sobelShader.uniforms.dZ, sobelRadius / hdr.dims[3]);
     gl.uniform1f(sobelShader.uniforms.coordZ, 0.5);
     gl.bindVertexArray(vao2);
-    gl.activeTexture(gl.TEXTURE0);
+    gl.activeTexture(TEXTURE0_BACK_VOL);
     if (this.gradientTexture !== null) {
       gl.deleteTexture(this.gradientTexture);
     }
-    this.gradientTexture = this.rgbaTex(this.gradientTexture, this.gl.TEXTURE6, hdr.dims);
+    this.gradientTexture = this.rgbaTex(this.gradientTexture, TEXTURE6_GRADIENT, hdr.dims);
     for (let i = 0; i < hdr.dims[3] - 1; i++) {
       const coordZ = 1 / hdr.dims[3] * (i + 0.5);
       gl.uniform1f(sobelShader.uniforms.coordZ, coordZ);
@@ -27498,7 +27463,7 @@ var Niivue = class _Niivue {
       this.back.matRAS = overlayItem.matRAS;
       this.back.dims = overlayItem.dimsRAS;
       this.back.pixDims = overlayItem.pixDimsRAS;
-      outTexture = this.rgbaTex(this.volumeTexture, this.gl.TEXTURE0, overlayItem.dimsRAS);
+      outTexture = this.rgbaTex(this.volumeTexture, TEXTURE0_BACK_VOL, overlayItem.dimsRAS);
       const { volScale: volScale2, vox: vox2 } = this.sliceScale(true);
       this.volScale = volScale2;
       this.vox = vox2;
@@ -27547,7 +27512,7 @@ var Niivue = class _Niivue {
       );
       mat46.invert(mtx, mtx);
       if (layer === 1) {
-        outTexture = this.rgbaTex(this.overlayTexture, this.gl.TEXTURE2, this.back.dims);
+        outTexture = this.rgbaTex(this.overlayTexture, TEXTURE2_OVERLAY_VOL, this.back.dims);
         this.overlayTexture = outTexture;
         this.overlayTextureID = outTexture;
       } else {
@@ -27560,7 +27525,7 @@ var Niivue = class _Niivue {
     this.gl.viewport(0, 0, this.back.dims[1], this.back.dims[2]);
     this.gl.disable(this.gl.BLEND);
     const tempTex3D = this.gl.createTexture();
-    this.gl.activeTexture(this.gl.TEXTURE6);
+    this.gl.activeTexture(TEXTURE9_ORIENT);
     this.gl.bindTexture(this.gl.TEXTURE_3D, tempTex3D);
     this.gl.texParameteri(this.gl.TEXTURE_3D, this.gl.TEXTURE_MIN_FILTER, this.gl.NEAREST);
     this.gl.texParameteri(this.gl.TEXTURE_3D, this.gl.TEXTURE_MAG_FILTER, this.gl.NEAREST);
@@ -27709,22 +27674,22 @@ var Niivue = class _Niivue {
     const isUseCopyTexSubImage3D = false;
     if (isUseCopyTexSubImage3D) {
       if (layer > 1) {
-        blendTexture = this.rgbaTex(blendTexture, this.gl.TEXTURE5, this.back.dims, true);
+        blendTexture = this.rgbaTex(blendTexture, TEXTURE10_BLEND, this.back.dims, true);
         this.gl.bindTexture(this.gl.TEXTURE_3D, blendTexture);
         for (let i = 0; i < this.back.dims[3]; i++) {
           this.gl.framebufferTextureLayer(this.gl.FRAMEBUFFER, this.gl.COLOR_ATTACHMENT0, this.overlayTexture, 0, i);
-          this.gl.activeTexture(this.gl.TEXTURE5);
+          this.gl.activeTexture(TEXTURE10_BLEND);
           this.gl.copyTexSubImage3D(this.gl.TEXTURE_3D, 0, 0, 0, i, 0, 0, this.back.dims[1], this.back.dims[2]);
         }
       } else {
-        blendTexture = this.rgbaTex(blendTexture, this.gl.TEXTURE5, [2, 2, 2, 2], true);
+        blendTexture = this.rgbaTex(blendTexture, TEXTURE10_BLEND, [2, 2, 2, 2], true);
       }
     } else {
       if (layer > 1) {
         if (!this.back.dims) {
           throw new Error("back.dims undefined");
         }
-        blendTexture = this.rgbaTex(blendTexture, this.gl.TEXTURE5, this.back.dims);
+        blendTexture = this.rgbaTex(blendTexture, TEXTURE10_BLEND, this.back.dims);
         this.gl.bindTexture(this.gl.TEXTURE_3D, blendTexture);
         const passShader = this.passThroughShader;
         passShader.use(this.gl);
@@ -27736,11 +27701,11 @@ var Niivue = class _Niivue {
           this.gl.drawArrays(this.gl.TRIANGLE_STRIP, 0, 4);
         }
       } else {
-        blendTexture = this.rgbaTex(blendTexture, this.gl.TEXTURE5, [2, 2, 2, 2]);
+        blendTexture = this.rgbaTex(blendTexture, TEXTURE10_BLEND, [2, 2, 2, 2]);
       }
     }
     orientShader.use(this.gl);
-    this.gl.activeTexture(this.gl.TEXTURE1);
+    this.gl.activeTexture(TEXTURE1_COLORMAPS);
     let colormapLabelTexture = null;
     if (overlayItem.colormapLabel !== null && overlayItem.colormapLabel.lut.length > 7) {
       const nLabel = overlayItem.colormapLabel.max - overlayItem.colormapLabel.min + 1;
@@ -27783,8 +27748,8 @@ var Niivue = class _Niivue {
     this.gl.uniform1f(orientShader.uniforms.cal_minNeg ?? null, mnNeg);
     this.gl.uniform1f(orientShader.uniforms.cal_maxNeg ?? null, mxNeg);
     this.gl.bindTexture(this.gl.TEXTURE_3D, tempTex3D);
-    this.gl.uniform1i(orientShader.uniforms.intensityVol ?? null, 6);
-    this.gl.uniform1i(orientShader.uniforms.blend3D ?? null, 5);
+    this.gl.uniform1i(orientShader.uniforms.intensityVol ?? null, 9);
+    this.gl.uniform1i(orientShader.uniforms.blend3D ?? null, 10);
     this.gl.uniform1i(orientShader.uniforms.colormap ?? null, 1);
     this.gl.uniform1f(orientShader.uniforms.scl_inter ?? null, hdr.scl_inter);
     this.gl.uniform1f(orientShader.uniforms.scl_slope ?? null, hdr.scl_slope);
@@ -27880,13 +27845,16 @@ var Niivue = class _Niivue {
     if (!this.back.dims) {
       throw new Error("back.dims undefined");
     }
+    let outline = 0;
     if (hdr.intent_code === 1002) {
-      let x = 1 / this.back.dims[1];
-      if (!this.opts.isAtlasOutline) {
-        x = -x;
-      }
-      this.gl.uniform3fv(orientShader.uniforms.xyzFrac, [x, 1 / this.back.dims[2], 1 / this.back.dims[3]]);
+      outline = this.opts.atlasOutline;
     }
+    this.gl.uniform4fv(orientShader.uniforms.xyzaFrac, [
+      1 / this.back.dims[1],
+      1 / this.back.dims[2],
+      1 / this.back.dims[3],
+      outline
+    ]);
     log.debug("back dims: ", this.back.dims);
     for (let i = 0; i < this.back.dims[3]; i++) {
       const coordZ = 1 / this.back.dims[3] * (i + 0.5);
@@ -27944,11 +27912,11 @@ var Niivue = class _Niivue {
     this.gl.uniform1f(shader.uniforms.drawOpacity, this.drawOpacity);
     if (colormapLabelTexture !== null) {
       this.gl.deleteTexture(colormapLabelTexture);
-      this.gl.activeTexture(this.gl.TEXTURE1);
+      this.gl.activeTexture(TEXTURE1_COLORMAPS);
       this.gl.bindTexture(this.gl.TEXTURE_2D, this.colormapTexture);
     }
     this.gl.uniform1i(shader.uniforms.drawing, 7);
-    this.gl.activeTexture(this.gl.TEXTURE7);
+    this.gl.activeTexture(TEXTURE7_DRAW);
     this.gl.bindTexture(this.gl.TEXTURE_3D, this.drawTexture);
     this.updateInterpolation(layer);
   }
@@ -28021,7 +27989,7 @@ var Niivue = class _Niivue {
   /**
    * modulate intensity of one image based on intensity of another
    * @param idTarget - the ID of the NVImage to be biased
-   * @param idModulation - the ID of the NVImage that controls bias (null to disable modulation)
+   * @param idModulation - the ID of the NVImage that controls bias (empty string to disable modulation)
    * @param modulateAlpha - does the modulation influence alpha transparency (values greater than 1).
    * @example niivue.setModulationImage(niivue.volumes[0].id, niivue.volumes[1].id);
    * @see {@link https://niivue.github.io/niivue/features/modulate.html|live demo scalar usage}
@@ -28030,7 +27998,9 @@ var Niivue = class _Niivue {
   setModulationImage(idTarget, idModulation, modulateAlpha = 0) {
     const idxTarget = this.getVolumeIndexByID(idTarget);
     let idxModulation = null;
-    idxModulation = this.getVolumeIndexByID(idModulation);
+    if (idModulation.length > 0) {
+      idxModulation = this.getVolumeIndexByID(idModulation);
+    }
     this.volumes[idxTarget].modulationImage = idxModulation;
     this.volumes[idxTarget].modulateAlpha = modulateAlpha;
     this.updateGLVolume();
@@ -28100,7 +28070,7 @@ var Niivue = class _Niivue {
    */
   getFrame4D(id) {
     const idx = this.getVolumeIndexByID(id);
-    return this.volumes[idx].nFrame4D;
+    return this.volumes[idx].frame4D;
   }
   // not included in public docs
   colormapFromKey(name) {
@@ -28121,7 +28091,7 @@ var Niivue = class _Niivue {
       return null;
     }
     texture = this.gl.createTexture();
-    this.gl.activeTexture(this.gl.TEXTURE1);
+    this.gl.activeTexture(TEXTURE1_COLORMAPS);
     this.gl.bindTexture(this.gl.TEXTURE_2D, texture);
     this.gl.texStorage2D(this.gl.TEXTURE_2D, 1, this.gl.RGBA8, nCol, nRow);
     this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MIN_FILTER, this.gl.LINEAR);
@@ -28761,7 +28731,7 @@ var Niivue = class _Niivue {
       throw new Error("colorbarShader undefined");
     }
     this.colorbarShader.use(this.gl);
-    this.gl.activeTexture(this.gl.TEXTURE1);
+    this.gl.activeTexture(TEXTURE1_COLORMAPS);
     this.gl.bindTexture(this.gl.TEXTURE_2D, this.colormapTexture);
     this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MIN_FILTER, this.gl.NEAREST);
     this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MAG_FILTER, this.gl.NEAREST);
@@ -29004,16 +28974,16 @@ var Niivue = class _Niivue {
       interp = this.gl.NEAREST;
     }
     if (layer === 0) {
-      this.gl.activeTexture(this.gl.TEXTURE0);
+      this.gl.activeTexture(TEXTURE0_BACK_VOL);
     } else {
-      this.gl.activeTexture(this.gl.TEXTURE2);
+      this.gl.activeTexture(TEXTURE2_OVERLAY_VOL);
     }
     this.gl.texParameteri(this.gl.TEXTURE_3D, this.gl.TEXTURE_MIN_FILTER, interp);
     this.gl.texParameteri(this.gl.TEXTURE_3D, this.gl.TEXTURE_MAG_FILTER, interp);
   }
   // not included in public docs
   setAtlasOutline(isOutline) {
-    this.opts.isAtlasOutline = isOutline;
+    this.opts.atlasOutline = isOutline;
     this.updateGLVolume();
     this.drawScene();
   }
@@ -29576,6 +29546,12 @@ var Niivue = class _Niivue {
     if (graph.opacity <= 0 || graph.LTWH[2] <= 5 || graph.LTWH[3] <= 5) {
       return;
     }
+    if (graph.LTWH[0] + graph.LTWH[2] > this.gl.canvas.width) {
+      return;
+    }
+    if (graph.LTWH[1] + graph.LTWH[3] > this.gl.canvas.height) {
+      return;
+    }
     graph.backColor = [0.15, 0.15, 0.15, graph.opacity];
     graph.lineColor = [1, 1, 1, 1];
     if (this.opts.backColor[0] + this.opts.backColor[1] + this.opts.backColor[2] > 1.5) {
@@ -29839,7 +29815,7 @@ var Niivue = class _Niivue {
       shader.use(this.gl);
       gl.uniform1i(shader.uniforms.backgroundMasksOverlays, this.backgroundMasksOverlays);
       if (this.gradientTextureAmount > 0) {
-        gl.activeTexture(gl.TEXTURE6);
+        gl.activeTexture(TEXTURE6_GRADIENT);
         gl.bindTexture(gl.TEXTURE_3D, this.gradientTexture);
         const modelMatrix = this.calculateModelMatrix(azimuth, elevation);
         const iModelMatrix = mat46.create();
@@ -30247,7 +30223,7 @@ var Niivue = class _Niivue {
         continue;
       }
       if (shader.isMatcap) {
-        gl.activeTexture(gl.TEXTURE6);
+        gl.activeTexture(TEXTURE5_MATCAP);
         gl.bindTexture(gl.TEXTURE_2D, this.matCapTexture);
       }
       gl.bindVertexArray(this.meshes[i].vao);
@@ -30307,7 +30283,7 @@ var Niivue = class _Niivue {
         radius = range[0] * 0.02;
       }
       radius *= this.opts.crosshairWidth;
-      this.crosshairs3D = NiivueObject3D.generateCrosshairs(this.gl, 1, mm, mn, mx, radius);
+      this.crosshairs3D = NiivueObject3D.generateCrosshairs(this.gl, 1, mm, mn, mx, radius, 20, this.opts.crosshairGap);
       this.crosshairs3D.mm = mm;
     }
     if (!this.surfaceShader) {