@aics/vole-core 3.15.2 → 3.15.4

package/es/FusedChannelData.js

@@ -7,7 +7,7 @@ const fuseShaderSrcF = "precision highp float;\nprecision highp int;\nprecision
 /* babel-plugin-inline-import './constants/shaders/fuseI.frag' */
 const fuseShaderSrcI = "precision highp float;\nprecision highp int;\nprecision highp sampler2D;\nprecision highp sampler3D;\n\n// the lut texture is a 256x1 rgba texture for each channel\nuniform sampler2D lutSampler;\n\nuniform vec2 lutMinMax;\n\n// src texture is the raw volume intensity data\nuniform isampler2D srcTexture;\n\nvoid main()\n{\n    ivec2 vUv = ivec2(int(gl_FragCoord.x), int(gl_FragCoord.y));\n    int intensity = texelFetch(srcTexture, vUv, 0).r;\n    float ilookup = float(float(intensity) - lutMinMax.x) / float(lutMinMax.y - lutMinMax.x);\n    // apply lut to intensity:\n    vec4 pix = texture(lutSampler, vec2(ilookup, 0.5));\n    gl_FragColor = vec4(pix.xyz*pix.w, pix.w);\n}\n";
 /* babel-plugin-inline-import './constants/shaders/colorizeUI.frag' */
-const colorizeSrcUI = "precision highp float;\nprecision highp int;\nprecision highp usampler2D;\nprecision highp sampler3D;\n\nuniform sampler2D featureData;\n/** Min and max feature values that define the endpoints of the color map. Values\n * outside the range will be clamped to the nearest endpoint.\n */\nuniform float featureColorRampMin;\nuniform float featureColorRampMax;\nuniform sampler2D colorRamp;\nuniform usampler2D inRangeIds;\nuniform usampler2D outlierData;\n\n/**\n * LUT mapping from the segmentation ID (raw pixel value) to the\n * global ID (index in data buffers like `featureData` and `outlierData`).\n * \n * For a given segmentation ID `segId`, the global ID is given by:\n * `segIdToGlobalId[segId - segIdOffset] - 1`.\n*/\nuniform usampler2D segIdToGlobalId;\nuniform uint segIdOffset;\n\nuniform vec3 outlineColor;\n\n/** MUST be synchronized with the DrawMode enum in ColorizeCanvas! */\nconst uint DRAW_MODE_HIDE = 0u;\nconst uint DRAW_MODE_COLOR = 1u;\nconst uint BACKGROUND_ID = 0u;\nconst uint MISSING_DATA_ID = 0xFFFFFFFFu;\n\nuniform vec3 outlierColor;\nuniform uint outlierDrawMode;\nuniform vec3 outOfRangeColor;\nuniform uint outOfRangeDrawMode;\n\nuniform uint highlightedId;\n\nuniform bool hideOutOfRange;\n\n// src texture is the raw volume intensity data\nuniform usampler2D srcTexture;\n\nvec4 getFloatFromTex(sampler2D tex, int index) {\n  int width = textureSize(tex, 0).x;\n  ivec2 featurePos = ivec2(index % width, index / width);\n  return texelFetch(tex, featurePos, 0);\n}\nuvec4 getUintFromTex(usampler2D tex, int index) {\n  int width = textureSize(tex, 0).x;\n  ivec2 featurePos = ivec2(index % width, index / width);\n  return texelFetch(tex, featurePos, 0);\n}\nuint getId(ivec2 uv) {\n  uint rawId = texelFetch(srcTexture, uv, 0).r;\n  if (rawId == 0u) {\n    return BACKGROUND_ID;\n  }\n  uvec4 c = getUintFromTex(segIdToGlobalId, int(rawId - segIdOffset));\n  // Note: IDs are offset by `1` to reserve `0` for segmentations that don't\n  // have associated data. `1` MUST be subtracted from the ID when accessing\n  // data buffers.\n  uint globalId = c.r;\n  if (globalId == 0u) {\n    return MISSING_DATA_ID;\n  }\n  return globalId;\n}\nvec4 getColorRamp(float val) {\n  float width = float(textureSize(colorRamp, 0).x);\n  float range = (width - 1.0) / width;\n  float adjustedVal = (0.5 / width) + (val * range);\n  return texture(colorRamp, vec2(adjustedVal, 0.5));\n}\nvec4 getColorFromDrawMode(uint drawMode, vec3 defaultColor) {\n  const uint DRAW_MODE_HIDE = 0u;\n  vec3 backgroundColor = vec3(0.0, 0.0, 0.0);\n  if (drawMode == DRAW_MODE_HIDE) {\n    return vec4(backgroundColor, 0.0);\n  } else {\n    return vec4(defaultColor, 1.0);\n  }\n}\n\nfloat getFeatureVal(uint id) {\n  // Data buffer starts at 0, non-background segmentation IDs start at 1\n  return getFloatFromTex(featureData, int(id) - 1).r;\n}\nuint getOutlierVal(uint id) {\n  // Data buffer starts at 0, non-background segmentation IDs start at 1\n  return getUintFromTex(outlierData, int(id) - 1).r;\n}\nbool getIsInRange(uint id) {\n  return getUintFromTex(inRangeIds, int(id) - 1).r == 1u;\n}\nbool getIsOutlier(float featureVal, uint outlierVal) {\n  return isinf(featureVal) || outlierVal != 0u;\n}\n\nvec4 getObjectColor(ivec2 sUv, float opacity) {\n  // Get the segmentation id at this pixel\n  uint id = getId(sUv);\n\n  // A segmentation id of 0 represents background\n  if (id == BACKGROUND_ID) {\n    return vec4(0, 0, 0, 0);\n  }\n\n  // color the highlighted object. Note, `highlightedId` is a 0-based index\n  // (global ID w/o offset), while `id` is a 1-based index.\n  if (id - 1u == highlightedId) {\n    return vec4(outlineColor, 1.0);\n  }\n\n  float featureVal = getFeatureVal(id);\n  uint outlierVal = getOutlierVal(id);\n  float normFeatureVal = (featureVal - featureColorRampMin) / (featureColorRampMax - featureColorRampMin);\n\n  // Use the selected draw mode to handle out of range and outlier values;\n  // otherwise color with the color ramp as usual.\n  bool isInRange = getIsInRange(id);\n  bool isOutlier = getIsOutlier(featureVal, outlierVal);\n  bool isMissingData = (id == MISSING_DATA_ID);\n\n  // Features outside the filtered/thresholded range will all be treated the same (use `outOfRangeDrawColor`).\n  // Features inside the range can either be outliers or standard values, and are colored accordingly.\n  vec4 color;\n  if (isMissingData) { \n    // TODO: Add color controls for missing data\n    color = getColorFromDrawMode(outlierDrawMode, outlierColor);\n  } else if (isInRange) {\n    if (isOutlier) {\n      color = getColorFromDrawMode(outlierDrawMode, outlierColor);\n    } else {\n      color = getColorRamp(normFeatureVal);\n    }\n  } else {\n    color = getColorFromDrawMode(outOfRangeDrawMode, outOfRangeColor);\n  }\n  color.a *= opacity;\n  return color;\n}\n\nvoid main() {\n  ivec2 vUv = ivec2(int(gl_FragCoord.x), int(gl_FragCoord.y));\n  gl_FragColor = getObjectColor(vUv, 1.0);\n}\n";
+const colorizeSrcUI = "precision highp float;\nprecision highp int;\nprecision highp usampler2D;\nprecision highp sampler3D;\n\nuniform sampler2D featureData;\n/** Min and max feature values that define the endpoints of the color map. Values\n * outside the range will be clamped to the nearest endpoint.\n */\nuniform float featureColorRampMin;\nuniform float featureColorRampMax;\nuniform sampler2D colorRamp;\nuniform usampler2D inRangeIds;\nuniform usampler2D outlierData;\n\n/**\n * LUT mapping from the segmentation ID (raw pixel value) to the\n * global ID (index in data buffers like `featureData` and `outlierData`).\n * \n * For a given segmentation ID `segId`, the global ID is given by:\n * `segIdToGlobalId[segId - segIdOffset] - 1`.\n*/\nuniform usampler2D segIdToGlobalId;\nuniform uint segIdOffset;\n\nuniform vec3 outlineColor;\n\n/** MUST be synchronized with the DrawMode enum in ColorizeCanvas! */\nconst uint DRAW_MODE_HIDE = 0u;\nconst uint DRAW_MODE_COLOR = 1u;\nconst uint BACKGROUND_ID = 0u;\nconst uint MISSING_DATA_ID = 0xFFFFFFFFu;\n\nuniform vec3 outlierColor;\nuniform uint outlierDrawMode;\nuniform vec3 outOfRangeColor;\nuniform uint outOfRangeDrawMode;\n\nuniform uint highlightedId;\n\nuniform bool useRepeatingCategoricalColors;\n\n// src texture is the raw volume intensity data\nuniform usampler2D srcTexture;\n\nvec4 getFloatFromTex(sampler2D tex, int index) {\n  int width = textureSize(tex, 0).x;\n  ivec2 featurePos = ivec2(index % width, index / width);\n  return texelFetch(tex, featurePos, 0);\n}\nuvec4 getUintFromTex(usampler2D tex, int index) {\n  int width = textureSize(tex, 0).x;\n  ivec2 featurePos = ivec2(index % width, index / width);\n  return texelFetch(tex, featurePos, 0);\n}\nuint getId(ivec2 uv) {\n  uint rawId = texelFetch(srcTexture, uv, 0).r;\n  if (rawId == 0u) {\n    return BACKGROUND_ID;\n  }\n  uvec4 c = getUintFromTex(segIdToGlobalId, int(rawId - segIdOffset));\n  // Note: IDs are offset by `1` to reserve `0` for segmentations that don't\n  // have associated data. `1` MUST be subtracted from the ID when accessing\n  // data buffers.\n  uint globalId = c.r;\n  if (globalId == 0u) {\n    return MISSING_DATA_ID;\n  }\n  return globalId;\n}\n\nvec4 getColorRamp(float val) {\n  float width = float(textureSize(colorRamp, 0).x);\n  float range = (width - 1.0) / width;\n  float adjustedVal = (0.5 / width) + (val * range);\n  return texture(colorRamp, vec2(adjustedVal, 0.5));\n}\n\nvec4 getCategoricalColor(float featureValue) {\n  float width = float(textureSize(colorRamp, 0).x);\n  float modValue = mod(featureValue, width);\n  // The categorical texture uses no interpolation, so when sampling, `modValue`\n  // is rounded to the nearest integer.\n  return getColorRamp(modValue / (width - 1.0));\n}\n\nvec4 getColorFromDrawMode(uint drawMode, vec3 defaultColor) {\n  const uint DRAW_MODE_HIDE = 0u;\n  vec3 backgroundColor = vec3(0.0, 0.0, 0.0);\n  if (drawMode == DRAW_MODE_HIDE) {\n    return vec4(backgroundColor, 0.0);\n  } else {\n    return vec4(defaultColor, 1.0);\n  }\n}\n\nfloat getFeatureVal(uint id) {\n  // Data buffer starts at 0, non-background segmentation IDs start at 1\n  return getFloatFromTex(featureData, int(id) - 1).r;\n}\nuint getOutlierVal(uint id) {\n  // Data buffer starts at 0, non-background segmentation IDs start at 1\n  return getUintFromTex(outlierData, int(id) - 1).r;\n}\nbool getIsInRange(uint id) {\n  return getUintFromTex(inRangeIds, int(id) - 1).r == 1u;\n}\nbool getIsOutlier(float featureVal, uint outlierVal) {\n  return isinf(featureVal) || outlierVal != 0u;\n}\n\nvec4 getObjectColor(ivec2 sUv, float opacity) {\n  // Get the segmentation id at this pixel\n  uint id = getId(sUv);\n\n  // A segmentation id of 0 represents background\n  if (id == BACKGROUND_ID) {\n    return vec4(0, 0, 0, 0);\n  }\n\n  // color the highlighted object. Note, `highlightedId` is a 0-based index\n  // (global ID w/o offset), while `id` is a 1-based index.\n  if (id - 1u == highlightedId) {\n    return vec4(outlineColor, 1.0);\n  }\n\n  float featureVal = getFeatureVal(id);\n  uint outlierVal = getOutlierVal(id);\n  float normFeatureVal = (featureVal - featureColorRampMin) / (featureColorRampMax - featureColorRampMin);\n\n  // Use the selected draw mode to handle out of range and outlier values;\n  // otherwise color with the color ramp as usual.\n  bool isInRange = getIsInRange(id);\n  bool isOutlier = getIsOutlier(featureVal, outlierVal);\n  bool isMissingData = (id == MISSING_DATA_ID);\n\n  // Features outside the filtered/thresholded range will all be treated the same (use `outOfRangeDrawColor`).\n  // Features inside the range can either be outliers or standard values, and are colored accordingly.\n  vec4 color;\n  if (isMissingData) { \n    // TODO: Add color controls for missing data\n    color = getColorFromDrawMode(outlierDrawMode, outlierColor);\n  } else if (isInRange) {\n    if (isOutlier) {\n      color = getColorFromDrawMode(outlierDrawMode, outlierColor);\n    } else if (useRepeatingCategoricalColors) {\n      color = getCategoricalColor(featureVal);\n    } else {\n      color = getColorRamp(normFeatureVal);\n    }\n  } else {\n    color = getColorFromDrawMode(outOfRangeDrawMode, outOfRangeColor);\n  }\n  color.a *= opacity;\n  return color;\n}\n\nvoid main() {\n  ivec2 vUv = ivec2(int(gl_FragCoord.x), int(gl_FragCoord.y));\n  gl_FragColor = getObjectColor(vUv, 1.0);\n}\n";
 // This is the owner of the fused RGBA volume texture atlas, and the mask texture atlas.
 // This module is responsible for updating the fused texture, given the read-only volume channel data.
 export default class FusedChannelData {
@@ -107,6 +107,9 @@ export default class FusedChannelData {
         colorRamp: {
           value: null
         },
+        useRepeatingCategoricalColors: {
+          value: false
+        },
         outlineColor: {
           value: new Color(0xffffff)
         },
@@ -219,6 +222,7 @@ export default class FusedChannelData {
           mat.uniforms.featureColorRampMin.value = feature.featureMin;
           mat.uniforms.featureColorRampMax.value = feature.featureMax;
           mat.uniforms.colorRamp.value = feature.featureValueToColor;
+          mat.uniforms.useRepeatingCategoricalColors.value = feature.useRepeatingColor;
           mat.uniforms.outlineColor.value = feature.outlineColor;
           mat.uniforms.outlierColor.value = feature.outlierColor;
           mat.uniforms.outOfRangeColor.value = feature.outOfRangeColor;

package/es/Line3d.js

@@ -0,0 +1,167 @@
+import { Group, Vector3 } from "three";
+import { LineMaterial } from "three/addons/lines/LineMaterial";
+import { MESH_LAYER, OVERLAY_LAYER } from "./ThreeJsPanel";
+import { LineSegments2 } from "three/addons/lines/LineSegments2";
+import { LineSegmentsGeometry } from "three/addons/lines/LineSegmentsGeometry";
+const DEFAULT_VERTEX_BUFFER_SIZE = 1020;
+
+/**
+ * Simple wrapper for a 3D line segments object, with controls for vertex data,
+ * color, width, and segments visible.
+ */
+export default class Line3d {
+  constructor() {
+    this.bufferSize = DEFAULT_VERTEX_BUFFER_SIZE;
+    const geometry = new LineSegmentsGeometry();
+    geometry.setPositions(new Float32Array(this.bufferSize));
+    const material = new LineMaterial({
+      color: "#f00",
+      linewidth: 2,
+      worldUnits: false
+    });
+    this.lineMesh = new LineSegments2(geometry, material);
+    this.lineMesh.layers.set(MESH_LAYER);
+    this.lineMesh.frustumCulled = false;
+    this.meshPivot = new Group();
+    this.meshPivot.add(this.lineMesh);
+    this.meshPivot.layers.set(MESH_LAYER);
+    this.scale = new Vector3(1, 1, 1);
+    this.flipAxes = new Vector3(1, 1, 1);
+  }
+
+  // IDrawableObject interface methods
+
+  cleanup() {
+    this.lineMesh.geometry.dispose();
+    this.lineMesh.material.dispose();
+  }
+  setVisible(visible) {
+    this.lineMesh.visible = visible;
+  }
+  doRender() {
+    // no op
+  }
+  get3dObject() {
+    return this.meshPivot;
+  }
+  setTranslation(translation) {
+    this.meshPivot.position.copy(translation);
+  }
+  setScale(scale) {
+    this.scale.copy(scale);
+    this.meshPivot.scale.copy(scale).multiply(this.flipAxes);
+  }
+  setRotation(eulerXYZ) {
+    this.meshPivot.rotation.copy(eulerXYZ);
+  }
+  setFlipAxes(flipX, flipY, flipZ) {
+    this.flipAxes.set(flipX, flipY, flipZ);
+    this.meshPivot.scale.copy(this.scale).multiply(this.flipAxes);
+  }
+  setOrthoThickness(_thickness) {
+    // no op
+  }
+  setResolution(_x, _y) {
+    // no op
+  }
+  setAxisClip(_axis, _minval, _maxval, _isOrthoAxis) {
+    // no op
+  }
+  updateClipRegion(_xmin, _xmax, _ymin, _ymax, _zmin, _zmax) {
+    // no op
+  }
+
+  // Line-specific functions
+
+  /**
+   * Sets the color of the line material.
+   * @param color Base line color.
+   * @param useVertexColors If true, _the line will multiply the base color with
+   * the per-vertex colors defined in the geometry (see `setLineVertexData`). Default is false.
+   */
+  setColor(color, useVertexColors = false) {
+    this.lineMesh.material.color.set(color);
+    this.lineMesh.material.vertexColors = useVertexColors;
+    this.lineMesh.material.needsUpdate = true;
+  }
+
+  /**
+   * Sets the opacity of the line material.
+   *
+   * Note that transparent lines may have unexpected colors when intersecting
+   * with or overlapping the volume. Consider setting them to render as an
+   * overlay instead using `setOverlay()`.
+   * @param opacity Opacity value in the range `[0, 1]`. 0 is fully transparent,
+   * 1 is fully opaque.
+   */
+  setOpacity(opacity) {
+    const isTransparent = opacity < 1.0;
+    this.lineMesh.material.opacity = opacity;
+    this.lineMesh.material.transparent = isTransparent;
+    this.lineMesh.material.needsUpdate = true;
+  }
+
+  /**
+   * Sets whether a line should be rendered as an overlay (rendered on top of
+   * the volume) instead of a mesh (with depth, intersects with volume).
+   * @param renderAsOverlay If true, the line will be rendered on top of the
+   * volume, ignoring depth.
+   */
+  setRenderAsOverlay(renderAsOverlay) {
+    this.lineMesh.layers.set(renderAsOverlay ? OVERLAY_LAYER : MESH_LAYER);
+    this.lineMesh.material.depthTest = !renderAsOverlay;
+    this.lineMesh.material.depthTest = !renderAsOverlay;
+    this.lineMesh.material.needsUpdate = true;
+  }
+
+  /**
+   * Sets the width of the line in pixels.
+   * @param widthPx Width in pixels.
+   * @param useWorldUnits Whether to use world units for the line width. By
+   * default (false), the width is in screen pixels.
+   */
+  setLineWidth(widthPx, useWorldUnits = false) {
+    this.lineMesh.material.linewidth = widthPx;
+    this.lineMesh.material.worldUnits = useWorldUnits;
+    this.lineMesh.material.needsUpdate = true;
+  }
+
+  /**
+   * Sets the vertex data (position and RGB colors) for the line segments.
+   * @param positions A Float32Array of 3D coordinates, where each pair of
+   * coordinates is one line segment. Length must be a multiple of 6 (pairs of
+   * two 3-dimensional coordinates).
+   * @param colors A Float32Array of RGB values in the [0, 1] range, where each
+   * triplet corresponds to a vertex color.
+   * @throws {Error} If `positions` length is not a multiple of 6 or if `colors`
+   * length is not a multiple of 3.
+   */
+  setLineVertexData(positions, colors) {
+    if (positions.length % 6 !== 0) {
+      throw new Error(`positions length of ${positions.length} is not a multiple of 6 (pairs of two 3-dimensional coordinates)`);
+    }
+    if (colors !== undefined && colors.length % 3 !== 0) {
+      throw new Error(`colors length of ${colors.length} is not a multiple of 3 (triplets of RGB values)`);
+    }
+    const newBufferSize = Math.max(positions.length, colors ? colors.length : 0);
+    // If buffer size is too small, dispose of the old geometry and create a new
+    // one with the larger size.
+    if (newBufferSize > this.bufferSize) {
+      this.lineMesh.geometry.dispose();
+      this.lineMesh.geometry = new LineSegmentsGeometry();
+      this.bufferSize = newBufferSize;
+    }
+    this.lineMesh.geometry.setPositions(positions);
+    if (colors) {
+      this.lineMesh.geometry.setColors(colors);
+    }
+  }
+
+  /** Number of line segments that should be visible. */
+  setNumSegmentsVisible(segments) {
+    if (this.lineMesh.geometry) {
+      const count = segments;
+      this.lineMesh.geometry.instanceCount = Math.max(0, count);
+    }
+  }
+}

package/es/ThreeJsPanel.js

@@ -9,6 +9,7 @@ import RenderToBuffer from "./RenderToBuffer.js";
 import { copyImageFragShader } from "./constants/basicShaders.js";
 export const VOLUME_LAYER = 0;
 export const MESH_LAYER = 1;
+export const OVERLAY_LAYER = 2;
 const DEFAULT_PERSPECTIVE_CAMERA_DISTANCE = 5.0;
 const DEFAULT_PERSPECTIVE_CAMERA_NEAR = 0.1;
 const DEFAULT_PERSPECTIVE_CAMERA_FAR = 20.0;
@@ -554,9 +555,14 @@ export class ThreeJsPanel {
     this.meshRenderToBuffer.render(this.renderer);
 
     // Step 3: Render volumes, which can now depth test against the meshes.
+    this.renderer.autoClear = false;
     this.camera.layers.set(VOLUME_LAYER);
     this.renderer.setRenderTarget(null);
-    this.renderer.autoClear = false;
+    this.renderer.render(this.scene, this.camera);
+
+    // Step 4: Render lines and other objects that must render over volumes and meshes.
+    this.camera.layers.set(OVERLAY_LAYER);
+    this.renderer.setRenderTarget(null);
     this.renderer.render(this.scene, this.camera);
     this.renderer.autoClear = true;
 
@@ -588,6 +594,7 @@ export class ThreeJsPanel {
     const delta = this.timer.lastFrameMs / 1000.0;
     this.controls.update(delta);
     this.render();
+    this.onRenderCallback?.();
   }
   startRenderLoop() {
     this.inRenderLoop = true;
@@ -604,6 +611,9 @@ export class ThreeJsPanel {
     }
     this.timer.end();
   }
+  setOnRenderCallback(callback) {
+    this.onRenderCallback = callback ?? undefined;
+  }
   removeControlHandlers() {
     if (this.controlStartHandler) {
       this.controls.removeEventListener("start", this.controlStartHandler);
@@ -648,7 +658,7 @@ export class ThreeJsPanel {
     // read from the instance buffer
     const pixel = new Float32Array(4).fill(-1);
     this.renderer.readRenderTargetPixels(pickBuffer, sx, sy, 1, 1, pixel);
-    // For future reference, Simularium stores the following: 
+    // For future reference, Simularium stores the following:
     // (typeId), (instanceId), fragViewPos.z, fragPosDepth;
 
     if (pixel[3] === -1 || pixel[3] === 0) {

package/es/View3d.js

@@ -1,4 +1,4 @@
-import { AmbientLight, Vector3, Object3D, SpotLight, DirectionalLight, Euler, Scene, Color } from "three";
+import { AmbientLight, Vector3, Object3D, SpotLight, DirectionalLight, Euler, Scene, Color, Matrix4 } from "three";
 import { Pane } from "tweakpane";
 import { MESH_LAYER, ThreeJsPanel } from "./ThreeJsPanel.js";
 import lightSettings from "./constants/lights.js";
@@ -107,6 +107,18 @@ export class View3d {
     this.redraw();
   }
 
+  /**
+   * Returns the view projection matrix, which transforms from world coordinates
+   * to clip space coordinates.
+   *
+   * 3D coordinates within the camera's view frustum will be transformed to a
+   * [-1, 1] range in the X and Y axes, and a [0, 1] range in the Z axis.
+   */
+  getViewProjectionMatrix() {
+    const camera = this.canvas3d.camera;
+    return new Matrix4().multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
+  }
+
   /**
    * Force a redraw.
    * @param synchronous If true, the redraw will be done synchronously. If false (default), the
@@ -120,6 +132,13 @@ export class View3d {
       this.canvas3d.redraw();
     }
   }
+
+  /**
+   * Sets a listener that will be called after the 3D canvas renders.
+   */
+  setOnRenderCallback(callback) {
+    this.canvas3d.setOnRenderCallback(callback);
+  }
   unsetImage() {
     if (this.image) {
       this.canvas3d.removeControlHandlers();
@@ -824,6 +843,39 @@ export class View3d {
     }
   }
 
+  /**
+   * Adds a Line3d object as a child of the Volume, if a volume has been added
+   * to the view and the line is not already a child of it. Line positions will
+   * be in the normalized coordinate space of the Volume, where the origin
+   * (0,0,0) is at the center of the Volume and the extent is from -0.5 to 0.5
+   * in each axis.
+   */
+  addLineObject(line) {
+    if (this.image) {
+      this.image.addLineObject(line);
+      this.redraw();
+    }
+  }
+
+  /** Returns whether a Line3d object exists as a child of the volume. */
+  hasLineObject(line) {
+    if (this.image) {
+      return this.image.hasLineObject(line);
+    }
+    return false;
+  }
+
+  /**
+   * Removes a Line3d object from the Volume, if it exists. Note that the
+   * object's resources are not freed automatically (e.g. via `line.cleanup()`).
+   */
+  removeLineObject(line) {
+    if (this.image) {
+      this.image.removeLineObject(line);
+      this.redraw();
+    }
+  }
+
   /**
    * @description Enable or disable picking on a volume.  If enabled, the channelIndex is used to determine which channel to pick.
    * @param volume the image to enable picking on

package/es/Volume.js

@@ -14,13 +14,30 @@ export default class Volume {
    * Used to intelligently issue load requests whenever required by a state change. Modify with `updateRequiredData`.
    */
 
-  /** The maximum of the measurements of 3 axes in physical units (pixels*physicalSize) */
+  /**
+   * The maximum of the measurements of 3 axes in physical units.
+   *
+   * Equivalent to `Math.max(physicalSize.x, physicalSize.y, physicalSize.z)`.
+   */
 
-  /** The physical size of a voxel in the original level 0 volume */
+  /**
+   * The size of a voxel in the original level 0 volume in real-world (physical)
+   * units (e.g. μm).
+   */
 
-  /** The physical dims of the whole volume (not accounting for subregion) */
+  /**
+   * The dimensions of the whole volume (not accounting for subregion) in
+   * real-world (physical) units. Equivalent to `imageInfo.originalSize *
+   * physicalPixelSize`.
+   */
 
-  /** Normalized physical size of the whole volume (not accounting for subregion) */
+  /**
+   * Physical size of the whole volume (not accounting for subregion) normalized
+   * along the largest axis, so that all dimensions are `<= 1`.
+   *
+   * Example: If the physical size is `[100, 50, 25]` μm, then the
+   * normPhysicalSize will be `[1, 0.5, 0.25]`.
+   */
 
   constructor(imageInfo = defaultImageInfo(), loadSpec = new LoadSpec(), loader) {
     this.loaded = false;

package/es/VolumeDrawable.js

@@ -1,4 +1,4 @@
-import { Vector3, Object3D, Euler, Vector2, Box3 } from "three";
+import { Vector3, Object3D, Euler, Vector2, Box3, Group } from "three";
 import MeshVolume from "./MeshVolume.js";
 import RayMarchedAtlasVolume from "./RayMarchedAtlasVolume.js";
 import PathTracedVolume from "./PathTracedVolume.js";
@@ -23,6 +23,19 @@ export const colorObjectToArray = ({
 
 // A renderable multichannel volume image with 8-bits per channel intensity values.
 export default class VolumeDrawable {
+  // TODO: Move responsibility for drawable objects that are otherwise unrelated
+  // to the volume out of VolumeDrawable. Consider making a parent group that
+  // can contain all other drawable objects AND the VolumeDrawable and its owned
+  // objects (MeshVolume).
+  /**
+   * Group for all child objects of the volume. The group is scaled and
+   * transformed to the normalized volume coordinate space, where the volume's
+   * center is at (0, 0, 0) and the bounds have a range of [-0.5, 0.5] along each
+   * axis.
+   */
+
+  /** Set of drawable objects that are children of the volume's transform. */
+
   constructor(volume, options) {
     // THE VOLUME DATA
     this.volume = volume;
@@ -49,7 +62,9 @@ export default class VolumeDrawable {
     });
     this.sceneRoot = new Object3D(); //create an empty container
 
-    this.meshVolume = new MeshVolume(this.volume);
+    this.childObjectsGroup = new Group();
+    this.childObjects = new Set();
+    this.sceneRoot.add(this.childObjectsGroup);
     options.renderMode = options.renderMode || RenderMode.RAYMARCH;
     switch (options.renderMode) {
       case RenderMode.PATHTRACE:
@@ -67,8 +82,10 @@ export default class VolumeDrawable {
     }
 
     // draw meshes first, and volume last, for blending and depth test reasons with raymarch
+    this.meshVolume = new MeshVolume(this.volume);
     if (options.renderMode === RenderMode.RAYMARCH || options.renderMode === RenderMode.SLICE) {
-      this.sceneRoot.add(this.meshVolume.get3dObject());
+      this.childObjectsGroup.add(this.meshVolume.get3dObject());
+      this.childObjects.add(this.meshVolume);
     }
     this.sceneRoot.add(this.volumeRendering.get3dObject());
     // draw meshes last (as overlay) for pathtrace? (or not at all?)
@@ -216,7 +233,8 @@ export default class VolumeDrawable {
       normRegionSize
     } = this.volume;
     const scale = normPhysicalSize.clone().multiply(normRegionSize).multiply(this.settings.scale);
-    this.meshVolume.setScale(scale, this.volume.getContentCenter().multiply(this.settings.scale));
+    this.childObjectsGroup.scale.copy(scale);
+    this.childObjectsGroup.position.copy(this.volume.getContentCenter().multiply(this.settings.scale));
     // TODO only `RayMarchedAtlasVolume` handles scale properly. Get the others on board too!
     this.volumeRendering.updateVolumeDimensions();
     this.volumeRendering.updateSettings(this.settings, SettingsFlags.TRANSFORM);
@@ -234,7 +252,9 @@ export default class VolumeDrawable {
   setResolution(x, y) {
     const resolution = new Vector2(x, y);
     if (!this.settings.resolution.equals(resolution)) {
-      this.meshVolume.setResolution(x, y);
+      for (const object of this.childObjects) {
+        object.setResolution(x, y);
+      }
       this.settings.resolution = resolution;
       this.volumeRendering.updateSettings(this.settings, SettingsFlags.SAMPLING);
       this.pickRendering?.updateSettings(this.settings, SettingsFlags.SAMPLING);
@@ -259,7 +279,9 @@ export default class VolumeDrawable {
 
     // Configure mesh volume when in an orthographic axis alignment
     if (axis !== Axis.NONE && this.renderMode !== RenderMode.PATHTRACE) {
-      this.meshVolume.setAxisClip(axis, minval, maxval, !!isOrthoAxis);
+      for (const object of this.childObjects) {
+        object.setAxisClip(axis, minval, maxval, !!isOrthoAxis);
+      }
     }
     this.volumeRendering.updateSettings(this.settings, SettingsFlags.ROI | SettingsFlags.VIEW);
     this.pickRendering?.updateSettings(this.settings, SettingsFlags.ROI | SettingsFlags.VIEW);
@@ -323,7 +345,9 @@ export default class VolumeDrawable {
     if (this.renderMode === RenderMode.PATHTRACE) {
       return;
     }
-    this.meshVolume.setOrthoThickness(value);
+    for (const object of this.childObjects) {
+      object.setOrthoThickness(value);
+    }
     // No settings update because ortho thickness is calculated in the renderers
   }
 
@@ -345,7 +369,9 @@ export default class VolumeDrawable {
     const flipAxes = new Vector3(flipX, flipY, flipZ);
     if (!this.settings.flipAxes.equals(flipAxes)) {
       this.settings.flipAxes = flipAxes;
-      this.meshVolume.setFlipAxes(flipX, flipY, flipZ);
+      for (const object of this.childObjects) {
+        object.setFlipAxes(flipX, flipY, flipZ);
+      }
       this.volumeRendering.updateSettings(this.settings, SettingsFlags.TRANSFORM);
       this.pickRendering?.updateSettings(this.settings, SettingsFlags.TRANSFORM);
     }
@@ -367,7 +393,9 @@ export default class VolumeDrawable {
     // TODO confirm sequence
     this.volumeRendering.doRender(renderer, camera, depthTexture);
     if (this.renderMode !== RenderMode.PATHTRACE) {
-      this.meshVolume.doRender();
+      for (const object of this.childObjects) {
+        object.doRender();
+      }
     }
   }
   enablePicking(enabled, channelIndex) {
@@ -441,7 +469,9 @@ export default class VolumeDrawable {
     this.updateScale();
   }
   cleanup() {
-    this.meshVolume.cleanup();
+    for (const object of this.childObjects) {
+      object.cleanup();
+    }
     this.volumeRendering.cleanup();
     this.pickRendering?.cleanup();
   }
@@ -635,7 +665,9 @@ export default class VolumeDrawable {
   updateClipRegion(xmin, xmax, ymin, ymax, zmin, zmax) {
     this.settings.bounds.bmin = new Vector3(xmin - 0.5, ymin - 0.5, zmin - 0.5);
     this.settings.bounds.bmax = new Vector3(xmax - 0.5, ymax - 0.5, zmax - 0.5);
-    this.meshVolume.updateClipRegion(xmin, xmax, ymin, ymax, zmin, zmax);
+    for (const object of this.childObjects) {
+      object.updateClipRegion(xmin, xmax, ymin, ymax, zmin, zmax);
+    }
     this.volumeRendering.updateSettings(this.settings, SettingsFlags.ROI);
     this.pickRendering?.updateSettings(this.settings, SettingsFlags.ROI);
   }
@@ -717,6 +749,37 @@ export default class VolumeDrawable {
     this.settings.scale.copy(xyz);
     this.updateScale();
   }
+
+  /**
+   * Adds a Line3d object as a child of the Volume, if it does not already
+   * exist. Line objects will be in the normalized coordinate space of the
+   * Volume, where the origin (0,0,0) is at the center of the Volume and the
+   * extent is from -0.5 to 0.5 in each axis.
+   */
+  addLineObject(line) {
+    if (!this.childObjects.has(line)) {
+      this.childObjects.add(line);
+      this.childObjectsGroup.add(line.get3dObject());
+      line.setResolution(this.settings.resolution.x, this.settings.resolution.y);
+      line.setFlipAxes(this.settings.flipAxes.x, this.settings.flipAxes.y, this.settings.flipAxes.z);
+    }
+  }
+
+  /** Returns whether a line object exists as a child of the volume. */
+  hasLineObject(line) {
+    return this.childObjects.has(line);
+  }
+
+  /**
+   * Removes a Line3d object from the Volume, if it exists. Note that the
+   * object's resources are not freed automatically (e.g. via `line.cleanup()`).
+   */
+  removeLineObject(line) {
+    if (this.childObjects.has(line)) {
+      this.childObjects.delete(line);
+      this.childObjectsGroup.remove(line.get3dObject());
+    }
+  }
   setupGui(pane) {
     pane.addInput(this.settings, "translation").on("change", ({
       value

package/es/index.js

@@ -18,4 +18,5 @@ import { TiffLoader } from "./loaders/TiffLoader.js";
 import VolumeLoaderContext from "./workers/VolumeLoaderContext.js";
 import { VolumeLoadError, VolumeLoadErrorType } from "./loaders/VolumeLoadError.js";
 import { Light, AREA_LIGHT, SKY_LIGHT } from "./Light.js";
-export { Histogram, Lut, remapControlPoints, View3d, Volume, VolumeDrawable, LoadSpec, VolumeMaker, VolumeCache, RequestQueue, SubscribableRequestQueue, PrefetchDirection, OMEZarrLoader, JsonImageInfoLoader, RawArrayLoader, TiffLoader, VolumeLoaderContext, VolumeLoadError, VolumeLoadErrorType, VolumeFileFormat, createVolumeLoader, Channel, Light, ViewportCorner, AREA_LIGHT, RENDERMODE_PATHTRACE, RENDERMODE_RAYMARCH, SKY_LIGHT };
+import Line3d from "./Line3d.js";
+export { Histogram, Lut, Line3d, remapControlPoints, View3d, Volume, VolumeDrawable, LoadSpec, VolumeMaker, VolumeCache, RequestQueue, SubscribableRequestQueue, PrefetchDirection, OMEZarrLoader, JsonImageInfoLoader, RawArrayLoader, TiffLoader, VolumeLoaderContext, VolumeLoadError, VolumeLoadErrorType, VolumeFileFormat, createVolumeLoader, Channel, Light, ViewportCorner, AREA_LIGHT, RENDERMODE_PATHTRACE, RENDERMODE_RAYMARCH, SKY_LIGHT };

package/es/types/Line3d.d.ts

@@ -0,0 +1,70 @@
+import { Color, Euler, Group, Vector3 } from "three";
+import { IDrawableObject } from "./types";
+/**
+ * Simple wrapper for a 3D line segments object, with controls for vertex data,
+ * color, width, and segments visible.
+ */
+export default class Line3d implements IDrawableObject {
+    private meshPivot;
+    private scale;
+    private flipAxes;
+    private lineMesh;
+    private bufferSize;
+    constructor();
+    cleanup(): void;
+    setVisible(visible: boolean): void;
+    doRender(): void;
+    get3dObject(): Group;
+    setTranslation(translation: Vector3): void;
+    setScale(scale: Vector3): void;
+    setRotation(eulerXYZ: Euler): void;
+    setFlipAxes(flipX: number, flipY: number, flipZ: number): void;
+    setOrthoThickness(_thickness: number): void;
+    setResolution(_x: number, _y: number): void;
+    setAxisClip(_axis: "x" | "y" | "z", _minval: number, _maxval: number, _isOrthoAxis: boolean): void;
+    updateClipRegion(_xmin: number, _xmax: number, _ymin: number, _ymax: number, _zmin: number, _zmax: number): void;
+    /**
+     * Sets the color of the line material.
+     * @param color Base line color.
+     * @param useVertexColors If true, _the line will multiply the base color with
+     * the per-vertex colors defined in the geometry (see `setLineVertexData`). Default is false.
+     */
+    setColor(color: Color, useVertexColors?: boolean): void;
+    /**
+     * Sets the opacity of the line material.
+     *
+     * Note that transparent lines may have unexpected colors when intersecting
+     * with or overlapping the volume. Consider setting them to render as an
+     * overlay instead using `setOverlay()`.
+     * @param opacity Opacity value in the range `[0, 1]`. 0 is fully transparent,
+     * 1 is fully opaque.
+     */
+    setOpacity(opacity: number): void;
+    /**
+     * Sets whether a line should be rendered as an overlay (rendered on top of
+     * the volume) instead of a mesh (with depth, intersects with volume).
+     * @param renderAsOverlay If true, the line will be rendered on top of the
+     * volume, ignoring depth.
+     */
+    setRenderAsOverlay(renderAsOverlay: boolean): void;
+    /**
+     * Sets the width of the line in pixels.
+     * @param widthPx Width in pixels.
+     * @param useWorldUnits Whether to use world units for the line width. By
+     * default (false), the width is in screen pixels.
+     */
+    setLineWidth(widthPx: number, useWorldUnits?: boolean): void;
+    /**
+     * Sets the vertex data (position and RGB colors) for the line segments.
+     * @param positions A Float32Array of 3D coordinates, where each pair of
+     * coordinates is one line segment. Length must be a multiple of 6 (pairs of
+     * two 3-dimensional coordinates).
+     * @param colors A Float32Array of RGB values in the [0, 1] range, where each
+     * triplet corresponds to a vertex color.
+     * @throws {Error} If `positions` length is not a multiple of 6 or if `colors`
+     * length is not a multiple of 3.
+     */
+    setLineVertexData(positions: Float32Array, colors?: Float32Array): void;
+    /** Number of line segments that should be visible. */
+    setNumSegmentsVisible(segments: number): void;
+}

package/es/types/MeshVolume.d.ts

@@ -1,6 +1,7 @@
 import { BufferGeometry, Euler, Object3D, Vector3, Group, Material } from "three";
 import Volume from "./Volume.js";
-export default class MeshVolume {
+import type { IDrawableObject } from "./types.js";
+export default class MeshVolume implements IDrawableObject {
     private volume;
     private meshRoot;
     private meshPivot;

package/es/types/ThreeJsPanel.d.ts

@@ -3,6 +3,7 @@ import TrackballControls from "./TrackballControls.js";
 import { ViewportCorner } from "./types.js";
 export declare const VOLUME_LAYER = 0;
 export declare const MESH_LAYER = 1;
+export declare const OVERLAY_LAYER = 2;
 export type CameraState = {
     position: [number, number, number];
     up: [number, number, number];
@@ -53,6 +54,7 @@ export declare class ThreeJsPanel {
     private timestepIndicatorElement;
     showTimestepIndicator: boolean;
     private dataurlcallback?;
+    private onRenderCallback?;
     constructor(parentElement: HTMLElement | undefined, _useWebGL2: boolean);
     updateCameraFocus(fov: number, _focalDistance: number, _apertureSize: number): void;
     resetPerspectiveCamera(): void;
@@ -102,6 +104,7 @@ export declare class ThreeJsPanel {
     onAnimationLoop(): void;
     startRenderLoop(): void;
     stopRenderLoop(): void;
+    setOnRenderCallback(callback: (() => void) | null): void;
     removeControlHandlers(): void;
     setControlHandlers(onstart: EventListener<Event, "start", TrackballControls>, onchange: EventListener<Event, "change", TrackballControls>, onend: EventListener<Event, "end", TrackballControls>): void;
     hitTest(offsetX: number, offsetY: number, pickBuffer: WebGLRenderTarget | undefined): number;

package/es/types/View3d.d.ts

@@ -1,3 +1,4 @@
+import { Matrix4 } from "three";
 import { CameraState } from "./ThreeJsPanel.js";
 import VolumeDrawable from "./VolumeDrawable.js";
 import { Light } from "./Light.js";
@@ -5,6 +6,7 @@ import Volume from "./Volume.js";
 import { type ColorizeFeature, type VolumeChannelDisplayOptions, type VolumeDisplayOptions, ViewportCorner, RenderMode } from "./types.js";
 import { PerChannelCallback } from "./loaders/IVolumeLoader.js";
 import VolumeLoaderContext from "./workers/VolumeLoaderContext.js";
+import Line3d from "./Line3d.js";
 export declare const RENDERMODE_RAYMARCH = RenderMode.RAYMARCH;
 export declare const RENDERMODE_PATHTRACE = RenderMode.PATHTRACE;
 export interface View3dOptions {
@@ -52,6 +54,14 @@ export declare class View3d {
     getCanvasDOMElement(): HTMLCanvasElement;
     getCameraState(): CameraState;
     setCameraState(transform: Partial<CameraState>): void;
+    /**
+     * Returns the view projection matrix, which transforms from world coordinates
+     * to clip space coordinates.
+     *
+     * 3D coordinates within the camera's view frustum will be transformed to a
+     * [-1, 1] range in the X and Y axes, and a [0, 1] range in the Z axis.
+     */
+    getViewProjectionMatrix(): Matrix4;
     /**
      * Force a redraw.
      * @param synchronous If true, the redraw will be done synchronously. If false (default), the
@@ -59,6 +69,10 @@ export declare class View3d {
      * whenever possible for the best performance.
      */
     redraw(synchronous?: boolean): void;
+    /**
+     * Sets a listener that will be called after the 3D canvas renders.
+     */
+    setOnRenderCallback(callback: (() => void) | null): void;
     unsetImage(): VolumeDrawable | undefined;
     /**
      * Add a new volume image to the viewer.  (The viewer currently only supports a single image at a time - adding repeatedly, without removing in between, is a potential resource leak)
@@ -371,6 +385,21 @@ export declare class View3d {
      * @param id the selected id
      */
     setSelectedID(volume: Volume, channel: number, id: number): void;
+    /**
+     * Adds a Line3d object as a child of the Volume, if a volume has been added
+     * to the view and the line is not already a child of it. Line positions will
+     * be in the normalized coordinate space of the Volume, where the origin
+     * (0,0,0) is at the center of the Volume and the extent is from -0.5 to 0.5
+     * in each axis.
+     */
+    addLineObject(line: Line3d): void;
+    /** Returns whether a Line3d object exists as a child of the volume. */
+    hasLineObject(line: Line3d): boolean;
+    /**
+     * Removes a Line3d object from the Volume, if it exists. Note that the
+     * object's resources are not freed automatically (e.g. via `line.cleanup()`).
+     */
+    removeLineObject(line: Line3d): void;
     /**
      * @description Enable or disable picking on a volume.  If enabled, the channelIndex is used to determine which channel to pick.
      * @param volume the image to enable picking on

package/es/types/Volume.d.ts

@@ -30,13 +30,30 @@ export default class Volume {
     numChannels: number;
     channelNames: string[];
     channelColorsDefault: [number, number, number][];
-    /** The maximum of the measurements of 3 axes in physical units (pixels*physicalSize) */
+    /**
+     * The maximum of the measurements of 3 axes in physical units.
+     *
+     * Equivalent to `Math.max(physicalSize.x, physicalSize.y, physicalSize.z)`.
+     */
     physicalScale: number;
-    /** The physical size of a voxel in the original level 0 volume */
+    /**
+     * The size of a voxel in the original level 0 volume in real-world (physical)
+     * units (e.g. μm).
+     */
     physicalPixelSize: Vector3;
-    /** The physical dims of the whole volume (not accounting for subregion) */
+    /**
+     * The dimensions of the whole volume (not accounting for subregion) in
+     * real-world (physical) units. Equivalent to `imageInfo.originalSize *
+     * physicalPixelSize`.
+     */
     physicalSize: Vector3;
-    /** Normalized physical size of the whole volume (not accounting for subregion) */
+    /**
+     * Physical size of the whole volume (not accounting for subregion) normalized
+     * along the largest axis, so that all dimensions are `<= 1`.
+     *
+     * Example: If the physical size is `[100, 50, 25]` μm, then the
+     * normPhysicalSize will be `[1, 0.5, 0.25]`.
+     */
     normPhysicalSize: Vector3;
     normRegionSize: Vector3;
     normRegionOffset: Vector3;

package/es/types/VolumeDrawable.d.ts

@@ -6,6 +6,7 @@ import { RenderMode } from "./types.js";
 import { Light } from "./Light.js";
 import Channel from "./Channel.js";
 import { Axis } from "./VolumeRenderSettings.js";
+import Line3d from "./Line3d.js";
 type ColorArray = [number, number, number];
 type ColorObject = {
     r: number;
@@ -27,6 +28,15 @@ export default class VolumeDrawable {
     private fusion;
     sceneRoot: Object3D;
     private meshVolume;
+    /**
+     * Group for all child objects of the volume. The group is scaled and
+     * transformed to the normalized volume coordinate space, where the volume's
+     * center is at (0, 0, 0) and the bounds have a range of [-0.5, 0.5] along each
+     * axis.
+     */
+    private childObjectsGroup;
+    /** Set of drawable objects that are children of the volume's transform. */
+    private childObjects;
     private volumeRendering;
     private pickRendering?;
     private renderMode;
@@ -107,6 +117,20 @@ export default class VolumeDrawable {
     setTranslation(xyz: Vector3): void;
     setRotation(eulerXYZ: Euler): void;
     setScale(xyz: Vector3): void;
+    /**
+     * Adds a Line3d object as a child of the Volume, if it does not already
+     * exist. Line objects will be in the normalized coordinate space of the
+     * Volume, where the origin (0,0,0) is at the center of the Volume and the
+     * extent is from -0.5 to 0.5 in each axis.
+     */
+    addLineObject(line: Line3d): void;
+    /** Returns whether a line object exists as a child of the volume. */
+    hasLineObject(line: Line3d): boolean;
+    /**
+     * Removes a Line3d object from the Volume, if it exists. Note that the
+     * object's resources are not freed automatically (e.g. via `line.cleanup()`).
+     */
+    removeLineObject(line: Line3d): void;
     setupGui(pane: Pane): void;
     setZSlice(slice: number): boolean;
     get showBoundingBox(): boolean;

package/es/types/index.d.ts

@@ -19,10 +19,11 @@ import VolumeLoaderContext from "./workers/VolumeLoaderContext.js";
 import { VolumeLoadError, VolumeLoadErrorType } from "./loaders/VolumeLoadError.js";
 import { type CameraState } from "./ThreeJsPanel.js";
 import { Light, AREA_LIGHT, SKY_LIGHT } from "./Light.js";
+import Line3d from "./Line3d.js";
 export type { ImageInfo } from "./ImageInfo.js";
 export type { ControlPoint } from "./Lut.js";
 export type { CreateLoaderOptions } from "./loaders/index.js";
 export type { IVolumeLoader, PerChannelCallback, ThreadableVolumeLoader } from "./loaders/IVolumeLoader.js";
 export type { ZarrLoaderFetchOptions } from "./loaders/OmeZarrLoader.js";
 export type { WorkerLoader } from "./workers/VolumeLoaderContext.js";
-export { Histogram, Lut, remapControlPoints, View3d, Volume, VolumeDrawable, LoadSpec, VolumeMaker, VolumeCache, RequestQueue, SubscribableRequestQueue, PrefetchDirection, OMEZarrLoader, JsonImageInfoLoader, RawArrayLoader, type RawArrayData, type RawArrayInfo, type RawArrayLoaderOptions, TiffLoader, VolumeLoaderContext, VolumeLoadError, VolumeLoadErrorType, VolumeFileFormat, createVolumeLoader, Channel, Light, ViewportCorner, AREA_LIGHT, RENDERMODE_PATHTRACE, RENDERMODE_RAYMARCH, SKY_LIGHT, type CameraState, type ColorizeFeature, };
+export { Histogram, Lut, Line3d, remapControlPoints, View3d, Volume, VolumeDrawable, LoadSpec, VolumeMaker, VolumeCache, RequestQueue, SubscribableRequestQueue, PrefetchDirection, OMEZarrLoader, JsonImageInfoLoader, RawArrayLoader, type RawArrayData, type RawArrayInfo, type RawArrayLoaderOptions, TiffLoader, VolumeLoaderContext, VolumeLoadError, VolumeLoadErrorType, VolumeFileFormat, createVolumeLoader, Channel, Light, ViewportCorner, AREA_LIGHT, RENDERMODE_PATHTRACE, RENDERMODE_RAYMARCH, SKY_LIGHT, type CameraState, type ColorizeFeature, };

package/es/types/types.d.ts

@@ -1,4 +1,4 @@
-import { Camera, Color, DataTexture, OrthographicCamera, PerspectiveCamera, Vector3 } from "three";
+import { Camera, Color, DataTexture, Euler, Group, OrthographicCamera, PerspectiveCamera, Vector3 } from "three";
 export interface Bounds {
     bmin: Vector3;
     bmax: Vector3;
@@ -30,6 +30,13 @@ export declare const ARRAY_CONSTRUCTORS: {
 export interface ColorizeFeature {
     idsToFeatureValue: DataTexture;
     featureValueToColor: DataTexture;
+    /**
+     * Ignore the feature min and max, and treat the color ramp texture as a
+     * direct lookup for feature values. Feature values that are greater than
+     * the length of the color ramp will be wrapped around to the start
+     * (e.g. `value % colorRamp.length`).
+     */
+    useRepeatingColor: boolean;
     /**
      * Maps from a frame number to an info object used to look up the global ID
      * from a given segmentation ID (raw pixel value) on that frame. The info
@@ -64,6 +71,20 @@ export interface ColorizeFeature {
     outOfRangeDrawMode: number;
     hideOutOfRange: boolean;
 }
+export interface IDrawableObject {
+    cleanup(): void;
+    setVisible(visible: boolean): void;
+    doRender(): void;
+    get3dObject(): Group;
+    setTranslation(translation: Vector3): void;
+    setScale(scale: Vector3): void;
+    setRotation(eulerXYZ: Euler): void;
+    setFlipAxes(flipX: number, flipY: number, flipZ: number): void;
+    setOrthoThickness(thickness: number): void;
+    setResolution(x: number, y: number): void;
+    setAxisClip(axis: "x" | "y" | "z", minval: number, maxval: number, _isOrthoAxis: boolean): void;
+    updateClipRegion(xmin: number, xmax: number, ymin: number, ymax: number, zmin: number, zmax: number): void;
+}
 export interface FuseChannel {
     chIndex: number;
     lut: Uint8Array;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aics/vole-core",
-  "version": "3.15.2",
+  "version": "3.15.4",
   "description": "volume renderer for 3d, 4d, or 5d imaging data with OME-Zarr support",
   "main": "es/index.js",
   "type": "module",
@@ -78,6 +78,6 @@
     "vitest": "^3.0.8",
     "webpack": "^5.69.1",
     "webpack-cli": "^4.9.2",
-    "webpack-dev-server": "^4.7.4"
+    "webpack-dev-server": "^5.2.1"
   }
 }