Class: Niivue
Defined in: niivue/index.ts:149
Niivue can be attached to a canvas. An instance of Niivue contains methods for loading and rendering NIFTI image data in a WebGL 2.0 context.
Example
let niivue = new Niivue({ crosshairColor: [0, 1, 0, 0.5], textHeight: 0.5 }); // a see-through green crosshair, and larger text labels
Extends
EventTarget
Constructors
Constructor
new Niivue(options: Partial<NVConfigOptions>): Niivue;
Defined in: niivue/index.ts:654
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
options | Partial<NVConfigOptions> | DEFAULT_OPTIONS | options object to set modifiable Niivue properties |
Returns
Niivue
Overrides
EventTarget.constructor;
Properties
| Property | Type | Default value | Description | Defined in |
|---|---|---|---|---|
_gl | WebGL2RenderingContext | null | - | niivue/index.ts:162 |
back | NVImage | null | - | niivue/index.ts:304 |
backgroundMasksOverlays | number | 0 | - | niivue/index.ts:241 |
blurShader | Shader | null | - | niivue/index.ts:228 |
bmpShader | Shader | null | - | niivue/index.ts:215 |
bmpTexture | WebGLTexture | null | - | niivue/index.ts:216 |
bmpTextureWH | number | 1.0 | - | niivue/index.ts:218 |
canvas | HTMLCanvasElement | null | - | niivue/index.ts:161 |
circleShader? | Shader | undefined | - | niivue/index.ts:213 |
clickToSegmentGrowingBitmap | Uint8Array | null | - | niivue/index.ts:179 |
clickToSegmentIsGrowing | boolean | false | - | niivue/index.ts:178 |
clickToSegmentXY | number[] | undefined | - | niivue/index.ts:180 |
CLIP_PLANE_ID | number | 1 | - | niivue/index.ts:333 |
colorbarHeight | number | 0 | - | niivue/index.ts:182 |
colorbarShader? | Shader | undefined | - | niivue/index.ts:208 |
colormapLists | ColormapListEntry[] | [] | - | niivue/index.ts:166 |
colormapTexture | WebGLTexture | null | - | niivue/index.ts:165 |
crosshairs3D | NiivueObject3D | null | - | niivue/index.ts:234 |
cuboidVertexBuffer? | WebGLBuffer | undefined | - | niivue/index.ts:322 |
currentClipPlaneIndex | number | 0 | - | niivue/index.ts:329 |
currentDrawUndoBitmap | number | undefined | - | niivue/index.ts:649 |
customLayout | object[] | [] | - | niivue/index.ts:345 |
customSliceShader | Shader | null | - | niivue/index.ts:209 |
deferredMeshes | LoadFromUrlParams[] | [] | - | niivue/index.ts:307 |
deferredVolumes | ImageFromUrlOptions[] | [] | - | niivue/index.ts:306 |
dicomLoader | DicomLoader | null | - | niivue/index.ts:152 |
DISTANCE_FROM_CAMERA | number | -0.54 | - | niivue/index.ts:335 |
document | NVDocument | undefined | - | niivue/index.ts:608 |
dragModes | object | undefined | - | niivue/index.ts:354 |
dragModes.angle | DRAG_MODE | DRAG_MODE.angle | - | niivue/index.ts:357 |
dragModes.callbackOnly | DRAG_MODE | DRAG_MODE.callbackOnly | - | niivue/index.ts:361 |
dragModes.contrast | DRAG_MODE | DRAG_MODE.contrast | - | niivue/index.ts:355 |
dragModes.measurement | DRAG_MODE | DRAG_MODE.measurement | - | niivue/index.ts:356 |
dragModes.none | DRAG_MODE | DRAG_MODE.none | - | niivue/index.ts:358 |
dragModes.pan | DRAG_MODE | DRAG_MODE.pan | - | niivue/index.ts:359 |
dragModes.slicer3D | DRAG_MODE | DRAG_MODE.slicer3D | - | niivue/index.ts:360 |
drawFillOverwrites | boolean | true | - | niivue/index.ts:185 |
drawLut | LUT | undefined | - | niivue/index.ts:175 |
drawOpacity | number | 0.8 | - | niivue/index.ts:176 |
drawPenAxCorSag | number | -1 | - | niivue/index.ts:184 |
drawPenFillPts | number[][] | [] | - | niivue/index.ts:186 |
drawPenLocation | number[] | undefined | - | niivue/index.ts:183 |
drawRimOpacity | number | -1.0 | - | niivue/index.ts:177 |
drawShapePreviewBitmap | Uint8Array | null | - | niivue/index.ts:188 |
drawShapeStartLocation | number[] | undefined | - | niivue/index.ts:187 |
drawTexture | WebGLTexture | null | - | niivue/index.ts:172 |
drawUndoBitmaps | Uint8Array[] | [] | - | niivue/index.ts:174 |
extentsMax? | vec3 | undefined | - | niivue/index.ts:246 |
extentsMin? | vec3 | undefined | - | niivue/index.ts:245 |
fiberShader? | Shader | undefined | - | niivue/index.ts:211 |
fontShader | Shader | null | - | niivue/index.ts:210 |
fontTexture | WebGLTexture | null | - | niivue/index.ts:212 |
furthestFromPivot | number | 10.0 | - | niivue/index.ts:327 |
furthestVertexFromOrigin | number | 100 | - | niivue/index.ts:308 |
genericVAO | WebGLVertexArrayObject | null | - | niivue/index.ts:232 |
gradientPrePassShader | Shader | null | - | niivue/index.ts:229 |
gradientTexture | WebGLTexture | null | - | niivue/index.ts:168 |
gradientTextureAmount | number | 0.0 | - | niivue/index.ts:169 |
graph | Graph | undefined | - | niivue/index.ts:336 |
growCutShader? | Shader | undefined | - | niivue/index.ts:219 |
initialized | boolean | false | - | niivue/index.ts:648 |
isBusy | boolean | false | - | niivue/index.ts:163 |
lastCalled | number | undefined | - | niivue/index.ts:330 |
line3DShader? | Shader | undefined | - | niivue/index.ts:200 |
lineShader? | Shader | undefined | - | niivue/index.ts:199 |
loaders | LoaderRegistry | {} | - | niivue/index.ts:150 |
matCapTexture | WebGLTexture | null | - | niivue/index.ts:214 |
mediaUrlMap | Map< | NVMesh | NVImage, string> | undefined | - | niivue/index.ts:647 |
meshShaders | object[] | undefined | - | niivue/index.ts:351 |
mousePos | number[] | undefined | - | niivue/index.ts:311 |
needsRefresh | boolean | false | - | niivue/index.ts:164 |
onAngleCompleted | (angle: CompletedAngle) => void | undefined | Callback when an angle measurement is completed | niivue/index.ts:582 |
onAzimuthElevationChange | (azimuth: number, elevation: number) => void | undefined | callback function to run when the user changes the rotation of the 3D rendering Example niivue.onAzimuthElevationChange = (azimuth, elevation) => { console.log('azimuth: ', azimuth) console.log('elevation: ', elevation) } | niivue/index.ts:545 |
onClickToSegment | (data: object) => void | undefined | callback function when clickToSegment is enabled and the user clicks on the image. data contains the volume of the segmented region in mm3 and mL Example niivue.onClickToSegment = (data) => { console.log('clicked to segment') console.log('volume mm3: ', data.mm3) console.log('volume mL: ', data.mL) } | niivue/index.ts:420 |
onClipPlaneChange | (clipPlane: number[]) => void | undefined | callback function to run when the user changes the clip plane Example niivue.onClipPlaneChange = (clipPlane) => { console.log('clipPlane: ', clipPlane) } | niivue/index.ts:554 |
onColormapChange | () => void | undefined | - | niivue/index.ts:463 |
onCustomMeshShaderAdded | (fragmentShaderText: string, name: string) => void | undefined | - | niivue/index.ts:555 |
onDebug | () => void | undefined | callback function to run when niivue reports a debug message Example niivue.onDebug = (debug) => { console.log('debug: ', debug) } | niivue/index.ts:490 |
onDicomLoaderFinishedWithImages | (files: | NVImage[] | NVMesh[]) => void | undefined | - | niivue/index.ts:559 |
onDocumentLoaded | (document: NVDocument) => void | undefined | callback function to run when the user loads a new NiiVue document Example niivue.onDocumentLoaded = (document) => { console.log('document: ', document) } | niivue/index.ts:568 |
onDragRelease | (params: DragReleaseParams) => void | undefined | callback function to run when the right mouse button is released after dragging Example niivue.onDragRelease = () => { console.log('drag ended') } | niivue/index.ts:379 |
onDrawingChanged | (action: string) => void | undefined | Callback when the drawing bitmap materially changes | niivue/index.ts:600 |
onDrawingEnabled | (enabled: boolean) => void | undefined | Callback when drawing mode is toggled on or off | niivue/index.ts:603 |
onDrawingToolChanged | (tool: string, penValue: number, isFilledPen: boolean) => void | undefined | Callback when the active drawing tool changes | niivue/index.ts:588 |
onError | () => void | undefined | callback function to run when niivue reports an error Example niivue.onError = (error) => { console.log('error: ', error) } | niivue/index.ts:460 |
onFrameChange | (volume: NVImage, index: number) => void | undefined | callback function to run when the user changes the volume when a 4D image is loaded Example niivue.onFrameChange = (volume, frameNumber) => { console.log('frame changed') console.log('volume: ', volume) console.log('frameNumber: ', frameNumber) } | niivue/index.ts:451 |
onImageLoaded | (volume: NVImage) => void | undefined | callback function to run when a new volume is loaded Example niivue.onImageLoaded = (volume) => { console.log('volume loaded') console.log('volume: ', volume) } | niivue/index.ts:430 |
onInfo | () => void | undefined | callback function to run when niivue reports detailed info Example niivue.onInfo = (info) => { console.log('info: ', info) } | niivue/index.ts:472 |
onIntensityChange | (volume: NVImage) => void | undefined | callback function to run when the user changes the intensity range with the selection box action (right click) Example niivue.onIntensityChange = (volume) => { console.log('intensity changed') console.log('volume: ', volume) } | niivue/index.ts:409 |
onLocationChange | (location: unknown) => void | undefined | callback function to run when the crosshair location changes Example niivue.onLocationChange = (data) => { console.log('location changed') console.log('mm: ', data.mm) console.log('vox: ', data.vox) console.log('frac: ', data.frac) console.log('values: ', data.values) } | niivue/index.ts:400 |
onMeasurementCompleted | (measurement: CompletedMeasurement) => void | undefined | Callback when a distance measurement is completed | niivue/index.ts:579 |
onMeshAdded | () => void | undefined | - | niivue/index.ts:525 |
onMeshAddedFromUrl | (meshOptions: LoadFromUrlParams, mesh: NVMesh) => void | undefined | callback function to run when a mesh is added from a url Example niivue.onMeshAddedFromUrl = (meshOptions, mesh) => { console.log('mesh added from url') console.log('meshOptions: ', meshOptions) console.log('mesh: ', mesh) } | niivue/index.ts:522 |
onMeshLoaded | (mesh: NVMesh) => void | undefined | callback function to run when a new mesh is loaded Example niivue.onMeshLoaded = (mesh) => { console.log('mesh loaded') console.log('mesh: ', mesh) } | niivue/index.ts:440 |
onMeshPropertyChanged | (meshIndex: number, key: string, val: unknown) => void | undefined | - | niivue/index.ts:557 |
onMeshRemoved | (mesh: NVMesh) => void | undefined | Callback when any mesh is removed from the scene | niivue/index.ts:594 |
onMeshShaderChanged | (meshIndex: number, shaderIndex: number) => void | undefined | - | niivue/index.ts:556 |
onMeshWithUrlRemoved | (url: string) => void | undefined | - | niivue/index.ts:526 |
onMouseUp | (data: Partial<UIData>) => void | undefined | callback function to run when the left mouse button is released Example niivue.onMouseUp = () => { console.log('mouse up') } | niivue/index.ts:388 |
onOptsChange | (propertyName: keyof NVConfigOptions, newValue: | string | number | boolean | number[] | Float32Array | number[] | MouseEventConfig | TouchEventConfig | [[number, number], [number, number]], oldValue: | string | number | boolean | number[] | Float32Array | number[] | MouseEventConfig | TouchEventConfig | [[number, number], [number, number]]) => void | undefined | Callback for when any configuration option changes. | niivue/index.ts:576 |
onPenValueChanged | (penValue: number, isFilledPen: boolean) => void | undefined | Callback when the drawing pen value changes | niivue/index.ts:585 |
onSliceTypeChange | (sliceType: SLICE_TYPE) => void | undefined | Callback when the slice type (view layout) changes | niivue/index.ts:597 |
onVolumeAddedFromUrl | (imageOptions: ImageFromUrlOptions, volume: NVImage) => void | undefined | callback function to run when a volume is added from a url Example niivue.onVolumeAddedFromUrl = (imageOptions, volume) => { console.log('volume added from url') console.log('imageOptions: ', imageOptions) console.log('volume: ', volume) } | niivue/index.ts:501 |
onVolumeOrderChanged | (volumes: NVImage[]) => void | undefined | Callback when volume stacking order changes | niivue/index.ts:606 |
onVolumeRemoved | (volume: NVImage, index: number) => void | undefined | Callback when any volume is removed from the scene | niivue/index.ts:591 |
onVolumeUpdated | () => void | undefined | callback function to run when updateGLVolume is called (most users will not need to use Example niivue.onVolumeUpdated = () => { console.log('volume updated') } | niivue/index.ts:511 |
onVolumeWithUrlRemoved | (url: string) => void | undefined | - | niivue/index.ts:502 |
onWarn | () => void | undefined | callback function to run when niivue reports a warning Example niivue.onWarn = (warn) => { console.log('warn: ', warn) } | niivue/index.ts:481 |
onZoom3DChange | (zoom: number) => void | undefined | callback function to run when the 3D zoom level changes Example niivue.onZoom3DChange = (zoom) => { console.log('3D zoom scale: ', zoom) } | niivue/index.ts:535 |
orientCubeShader? | Shader | undefined | - | niivue/index.ts:194 |
orientCubeShaderVAO | WebGLVertexArrayObject | null | - | niivue/index.ts:195 |
orientShaderAtlasI | Shader | null | - | niivue/index.ts:221 |
orientShaderAtlasU | Shader | null | - | niivue/index.ts:220 |
orientShaderF | Shader | null | - | niivue/index.ts:224 |
orientShaderI | Shader | null | - | niivue/index.ts:223 |
orientShaderPAQD | Shader | null | - | niivue/index.ts:226 |
orientShaderRGBU | Shader | null | - | niivue/index.ts:225 |
orientShaderU | Shader | null | - | niivue/index.ts:222 |
otherNV | Niivue[] | null | - | niivue/index.ts:324 |
overlayAlphaShader | number | 1 | - | niivue/index.ts:243 |
overlayOutlineWidth | number | 0 | - | niivue/index.ts:242 |
overlays | NVImage[] | [] | - | niivue/index.ts:305 |
overlayTexture | WebGLTexture | null | - | niivue/index.ts:189 |
overlayTextureID | WebGLTexture | null | - | niivue/index.ts:190 |
paqdTexture | WebGLTexture | null | - | niivue/index.ts:173 |
passThroughShader? | Shader | undefined | - | niivue/index.ts:201 |
pickingImageShader? | Shader | undefined | - | niivue/index.ts:207 |
pickingMeshShader? | Shader | undefined | - | niivue/index.ts:206 |
pivot3D | number[] | undefined | - | niivue/index.ts:326 |
position? | vec3 | undefined | - | niivue/index.ts:244 |
readyForSync | boolean | false | - | niivue/index.ts:264 |
rectOutlineShader? | Shader | undefined | - | niivue/index.ts:197 |
rectShader? | Shader | undefined | - | niivue/index.ts:196 |
renderDrawAmbientOcclusion | number | 0.4 | - | niivue/index.ts:181 |
renderGradientShader? | Shader | undefined | - | niivue/index.ts:202 |
renderGradientValues | boolean | false | - | niivue/index.ts:171 |
renderGradientValuesShader? | Shader | undefined | - | niivue/index.ts:203 |
renderShader? | Shader | undefined | - | niivue/index.ts:198 |
renderSliceShader? | Shader | undefined | - | niivue/index.ts:204 |
renderVolumeShader? | Shader | undefined | - | niivue/index.ts:205 |
screenSlices | object[] | [] | - | niivue/index.ts:312 |
selectedObjectId | number | -1 | - | niivue/index.ts:332 |
slice2DShader? | Shader | undefined | - | niivue/index.ts:192 |
sliceMMShader? | Shader | undefined | - | niivue/index.ts:191 |
sliceTypeAxial | SLICE_TYPE | SLICE_TYPE.AXIAL | - | niivue/index.ts:365 |
sliceTypeCoronal | SLICE_TYPE | SLICE_TYPE.CORONAL | - | niivue/index.ts:366 |
sliceTypeMultiplanar | SLICE_TYPE | SLICE_TYPE.MULTIPLANAR | - | niivue/index.ts:368 |
sliceTypeRender | SLICE_TYPE | SLICE_TYPE.RENDER | - | niivue/index.ts:369 |
sliceTypeSagittal | SLICE_TYPE | SLICE_TYPE.SAGITTAL | - | niivue/index.ts:367 |
sliceV1Shader? | Shader | undefined | - | niivue/index.ts:193 |
sobelFirstOrderShader | Shader | null | - | niivue/index.ts:230 |
sobelSecondOrderShader | Shader | null | - | niivue/index.ts:231 |
surfaceShader | Shader | null | - | niivue/index.ts:227 |
syncOpts | SyncOpts | undefined | - | niivue/index.ts:252 |
thumbnailVisible | boolean | false | - | niivue/index.ts:217 |
uiData | UIData | undefined | - | niivue/index.ts:269 |
unusedVAO | any | null | - | niivue/index.ts:233 |
useCustomGradientTexture | boolean | false | - | niivue/index.ts:170 |
volScale | number[] | [] | - | niivue/index.ts:309 |
VOLUME_ID | number | 254 | - | niivue/index.ts:334 |
volumeObject3D | NiivueObject3D | null | - | niivue/index.ts:325 |
volumeTexture | WebGLTexture | null | - | niivue/index.ts:167 |
vox | number[] | [] | - | niivue/index.ts:310 |
Accessors
drawBitmap
Get Signature
get drawBitmap(): Uint8Array;
Defined in: niivue/index.ts:792
Returns
Uint8Array
Set Signature
set drawBitmap(drawBitmap: Uint8Array): void;
Defined in: niivue/index.ts:796
Parameters
| Parameter | Type |
|---|---|
drawBitmap | Uint8Array |
Returns
void
isAlphaClipDark
Get Signature
get isAlphaClipDark(): boolean;
Defined in: niivue/index.ts:634
Get whether voxels below minimum intensity are drawn as dark or transparent.
Returns
boolean
True if dark voxels are opaque, false if transparent.
Set Signature
set isAlphaClipDark(newVal: boolean): void;
Defined in: niivue/index.ts:643
Set whether voxels below minimum intensity are drawn as dark or transparent.
See
Parameters
| Parameter | Type | Description |
|---|---|---|
newVal | boolean | True to make dark voxels opaque, false for transparent. |
Returns
void
meshes
Get Signature
get meshes(): NVMesh[];
Defined in: niivue/index.ts:784
Returns
NVMesh[]
Set Signature
set meshes(meshes: NVMesh[]): void;
Defined in: niivue/index.ts:788
Parameters
| Parameter | Type |
|---|---|
meshes | NVMesh[] |
Returns
void
opts
Get Signature
get opts(): NVConfigOptions;
Defined in: niivue/index.ts:616
Get the current visualization options.
Returns
scene
Get Signature
get scene(): Scene;
Defined in: niivue/index.ts:611
Get the current scene configuration.
Returns
sliceMosaicString
Get Signature
get sliceMosaicString(): string;
Defined in: niivue/index.ts:621
Get the slice mosaic layout string.
Returns
string
Set Signature
set sliceMosaicString(newSliceMosaicString: string): void;
Defined in: niivue/index.ts:626
Set the slice mosaic layout string.
Parameters
| Parameter | Type |
|---|---|
newSliceMosaicString | string |
Returns
void
volScaleMultiplier
Get Signature
get volScaleMultiplier(): number;
Defined in: niivue/index.ts:800
Returns
number
Set Signature
set volScaleMultiplier(scale: number): void;
Defined in: niivue/index.ts:804
Parameters
| Parameter | Type |
|---|---|
scale | number |
Returns
void
volumes
Get Signature
get volumes(): NVImage[];
Defined in: niivue/index.ts:776
Returns
NVImage[]
Set Signature
set volumes(volumes: NVImage[]): void;
Defined in: niivue/index.ts:780
Parameters
| Parameter | Type |
|---|---|
volumes | NVImage[] |
Returns
void
Methods
addColormap()
addColormap(key: string, cmap: ColorMap): void;
Defined in: niivue/index.ts:7106
create a new colormap
Parameters
| Parameter | Type | Description |
|---|---|---|
key | string | name of new colormap |
cmap | ColorMap | colormap properties (Red, Green, Blue, Alpha and Indices) |
Returns
void
See
addEventListener()
addEventListener<K>(
type: K,
listener: NiivueEventListener<K>,
options?: NiivueEventListenerOptions): void;
Defined in: niivue/index.ts:720
Type-safe addEventListener for Niivue events. Supports all standard EventTarget options including once, capture, passive, and signal with AbortController.
Type Parameters
| Type Parameter |
|---|
K extends keyof NiivueEventMap |
Parameters
| Parameter | Type | Description |
|---|---|---|
type | K | Event name |
listener | NiivueEventListener<K> | Event listener function |
options? | NiivueEventListenerOptions | Event listener options (capture, once, passive, signal) |
Returns
void
Example
niivue.addEventListener("locationChange", (event) => {
console.log("Location changed:", event.detail);
});
// With once option
niivue.addEventListener("imageLoaded", handler, { once: true });
// With AbortController
const controller = new AbortController();
niivue.addEventListener("locationChange", handler, {
signal: controller.signal,
});
controller.abort(); // removes the listener
Overrides
EventTarget.addEventListener;
addLabel()
addLabel(
text: string,
style: NVLabel3DStyle,
points?: number[] | number[][],
anchor?: LabelAnchorPoint,
onClick?: (label: NVLabel3D) => void): NVLabel3D;
Defined in: niivue/index.ts:10391
Add a 3D Label
Parameters
| Parameter | Type | Description |
|---|---|---|
text | string | the text content of the label |
style | NVLabel3DStyle | visual styling options for the label (e.g., color, scale, line width) |
points? | number[] | number[][] | a 3D point [x, y, z] or array of points to anchor the label in space |
anchor? | LabelAnchorPoint | optional label anchor position (e.g., top-left, center, etc.) |
onClick? | (label: NVLabel3D) => void | optional callback function to invoke when the label is clicked |
Returns
NVLabel3D
the created NVLabel3D instance
See
addMesh()
addMesh(mesh: NVMesh): void;
Defined in: niivue/index.ts:3328
add a new mesh to the canvas
Parameters
| Parameter | Type | Description |
|---|---|---|
mesh | NVMesh | the new mesh to add to the canvas |
Returns
void
Example
niivue = new Niivue();
niivue.addMesh(NVMesh.loadFromUrl({ url: "../someURL.gii" }));
See
addMeshesFromUrl()
addMeshesFromUrl(meshOptions: LoadFromUrlParams[]): Promise<NVMesh[]>;
Defined in: niivue/index.ts:5187
Add mesh and notify subscribers
Parameters
| Parameter | Type |
|---|---|
meshOptions | LoadFromUrlParams[] |
Returns
Promise<NVMesh[]>
addMeshFromUrl()
addMeshFromUrl(meshOptions: LoadFromUrlParams): Promise<NVMesh>;
Defined in: niivue/index.ts:5156
Add mesh and notify subscribers
Parameters
| Parameter | Type |
|---|---|
meshOptions | LoadFromUrlParams |
Returns
Promise<NVMesh>
addVolume()
addVolume(volume: NVImage): void;
Defined in: niivue/index.ts:3280
add a new volume to the canvas
Parameters
| Parameter | Type | Description |
|---|---|---|
volume | NVImage | the new volume to add to the canvas |
Returns
void
Example
niivue = new Niivue();
niivue.addVolume(NVImage.loadFromUrl({ url: "../someURL.nii.gz" }));
See
addVolumeFromUrl()
addVolumeFromUrl(imageOptions: ImageFromUrlOptions): Promise<NVImage>;
Defined in: niivue/index.ts:2565
Add an image and notify subscribers
Parameters
| Parameter | Type |
|---|---|
imageOptions | ImageFromUrlOptions |
Returns
Promise<NVImage>
See
addVolumesFromUrl()
addVolumesFromUrl(imageOptionsArray: ImageFromUrlOptions[]): Promise<NVImage[]>;
Defined in: niivue/index.ts:2578
Parameters
| Parameter | Type |
|---|---|
imageOptionsArray | ImageFromUrlOptions[] |
Returns
Promise<NVImage[]>
applyVolumeTransform()
applyVolumeTransform(volIdx: number, transform: AffineTransform): void;
Defined in: niivue/index.ts:4487
Apply a transform (translation, rotation, scale) to a volume's affine and update the scene. Useful for manual image registration between volumes.
Parameters
| Parameter | Type | Description |
|---|---|---|
volIdx | number | index of volume to modify (0 = base image, 1+ = overlays) |
transform | AffineTransform | transform to apply with translation (mm), rotation (degrees), and scale |
Returns
void
Example
// Rotate overlay 15 degrees around Y axis and translate 5mm in X
niivue.applyVolumeTransform(1, {
translation: [5, 0, 0],
rotation: [0, 15, 0],
scale: [1, 1, 1],
});
See
attachTo()
attachTo(id: string, isAntiAlias: any): Promise<Niivue>;
Defined in: niivue/index.ts:852
attach the Niivue instance to the webgl2 canvas by element id
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
id | string | undefined | the id of an html canvas element |
isAntiAlias | any | null | determines if anti-aliasing is requested (if not specified, AA usage depends on hardware) |
Returns
Promise<Niivue>
Examples
niivue = new Niivue().attachTo("gl");
await niivue.attachTo("gl");
See
attachToCanvas()
attachToCanvas(canvas: HTMLCanvasElement, isAntiAlias: boolean): Promise<Niivue>;
Defined in: niivue/index.ts:866
attach the Niivue instance to a canvas element directly
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
canvas | HTMLCanvasElement | undefined | the canvas element reference |
isAntiAlias | boolean | null | - |
Returns
Promise<Niivue>
Example
niivue = new Niivue();
await niivue.attachToCanvas(document.getElementById(id));
See
binarize()
binarize(volume: NVImage): void;
Defined in: niivue/index.ts:3464
Binarize a volume by converting all non-zero voxels to 1
Parameters
| Parameter | Type | Description |
|---|---|---|
volume | NVImage | the image volume to modify in place |
Returns
void
See
broadcastTo()
broadcastTo(otherNV: Niivue | Niivue[], syncOpts: object): void;
Defined in: niivue/index.ts:943
Sync the scene controls (orientation, crosshair location, etc.) from one Niivue instance to others. useful for using one canvas to drive another.
Parameters
| Parameter | Type | Description |
|---|---|---|
otherNV | Niivue | Niivue[] | the other Niivue instance(s) |
syncOpts | { 2d: boolean; 3d: boolean; } | - |
syncOpts.2d | boolean | - |
syncOpts.3d | boolean | - |
Returns
void
Example
niivue1 = new Niivue();
niivue2 = new Niivue();
niivue3 = new Niivue();
niivue1.broadcastTo(niivue2);
niivue1.broadcastTo([niivue2, niivue3]);
See
cleanup()
cleanup(): void;
Defined in: niivue/index.ts:759
Clean up event listeners and observers Call this when the Niivue instance is no longer needed. This will be called when the canvas is detached from the DOM
Returns
void
Example
niivue.cleanup();
clearAllMeasurements()
clearAllMeasurements(): void;
Defined in: niivue/index.ts:8601
Clear all persistent measurements and angles from the canvas.
Returns
void
Example
nv.clearAllMeasurements();
clearAngles()
clearAngles(): void;
Defined in: niivue/index.ts:8589
Clear all persistent angle measurements from the canvas.
Returns
void
Example
nv.clearAngles();
clearBounds()
clearBounds(mask: number, ltwh?: [number, number, number, number]): void;
Defined in: niivue/index.ts:11689
Clear a rectangular region of this instance's canvas.
Parameters
| Parameter | Type | Description |
|---|---|---|
mask | number | bitmask of buffers to clear (default: color+depth). |
ltwh? | [number, number, number, number] | optional [x, y, w, h] region in device px (GL coords, bottom-left). If not provided, clears the full instance bounds (getBoundsRegion). For multiplanar panels, pass the panel’s own [x,y,w,h]. |
Returns
void
clearCustomLayout()
clearCustomLayout(): void;
Defined in: niivue/index.ts:3122
Clear custom layout and rely on built-in layouts
Returns
void
clearMeasurements()
clearMeasurements(): void;
Defined in: niivue/index.ts:8577
Clear all persistent measurement lines from the canvas.
Returns
void
Example
nv.clearMeasurements();
cloneVolume()
cloneVolume(index: number): NVImage;
Defined in: niivue/index.ts:4646
clone a volume and return a new volume
Parameters
| Parameter | Type | Description |
|---|---|---|
index | number | the index of the volume to clone |
Returns
new volume to work with, but that volume is not added to the canvas
Example
niivue = new Niivue();
niivue.cloneVolume(0);
closeDrawing()
closeDrawing(): void;
Defined in: niivue/index.ts:6011
close drawing: make sure you have saved any changes before calling this!
Returns
void
Example
niivue.closeDrawing();
See
colormap()
colormap(lutName: string, isInvert: boolean): Uint8ClampedArray;
Defined in: niivue/index.ts:7525
Retrieve a colormap with optional inversion
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
lutName | string | '' | name of the lookup table (LUT) colormap |
isInvert | boolean | false | whether to invert the colormap |
Returns
Uint8ClampedArray
the RGBA colormap as a Uint8ClampedArray
See
colormaps()
colormaps(): string[];
Defined in: niivue/index.ts:7096
query all available color maps that can be applied to volumes
Returns
string[]
an array of colormap strings
Example
niivue = new Niivue();
colormaps = niivue.colormaps();
See
conform()
conform(
volume: NVImage,
toRAS: boolean,
isLinear: boolean,
asFloat32: boolean,
isRobustMinMax: boolean,
targetShape: [number, number, number],
targetVoxelSize: number,
rawFloat32: boolean): Promise<NVImage>;
Defined in: niivue/index.ts:7278
FreeSurfer-style conform reslices any image to a 256x256x256 volume with 1mm voxels
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
volume | NVImage | undefined | input volume to be re-oriented, intensity-scaled and resliced |
toRAS | boolean | false | reslice to row, column slices to right-anterior-superior not left-inferior-anterior (default false). |
isLinear | boolean | true | reslice with linear rather than nearest-neighbor interpolation (default true). |
asFloat32 | boolean | false | use Float32 datatype rather than Uint8 (default false). |
isRobustMinMax | boolean | false | clamp intensity with robust min max (~2%..98%) instead of FreeSurfer (0%..99.99%) (default false). |
targetShape | [number, number, number] | ... | output dimensions [x, y, z] (default [256, 256, 256]). |
targetVoxelSize | number | 1.0 | output voxel size in mm (default 1.0). |
rawFloat32 | boolean | false | return raw resampled Float32 data without intensity rescaling (default false). Useful for ML inference where original intensity values must be preserved. |
Returns
Promise<NVImage>
See
createConnectedLabelImage()
createConnectedLabelImage(
id: string,
conn: number,
binarize: boolean,
onlyLargestClusterPerClass: boolean): Promise<NVImage>;
Defined in: niivue/index.ts:7201
Create a connected component label map from a volume
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
id | string | undefined | ID of the input volume |
conn | number | 26 | connectivity for clustering (6 = faces, 18 = faces + edges, 26 = faces + edges + corners) |
binarize | boolean | false | whether to binarize the volume before labeling |
onlyLargestClusterPerClass | boolean | false | retain only the largest cluster for each label |
Returns
Promise<NVImage>
a new NVImage with labeled clusters, using random colormap
See
createCustomMeshShader()
createCustomMeshShader(fragmentShaderText: string, name: string): object;
Defined in: niivue/index.ts:6290
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
fragmentShaderText | string | undefined | custom fragment shader. |
name | string | 'Custom' | title for new shader. |
Returns
object
created custom mesh shader
| Name | Type | Defined in |
|---|---|---|
Frag | string | niivue/index.ts:6294 |
Name | string | niivue/index.ts:6294 |
shader? | Shader | niivue/index.ts:6294 |
createEmptyDrawing()
createEmptyDrawing(): void;
Defined in: niivue/index.ts:5346
generate a blank canvas for the pen tool
Returns
void
Example
niivue.createEmptyDrawing();
See
createNiftiArray()
createNiftiArray(
dims: number[],
pixDims: number[],
affine: number[],
datatypeCode: NiiDataType,
img: Uint8Array): Promise<Uint8Array>;
Defined in: niivue/index.ts:7231
Create a binary NIfTI file as a Uint8Array, including header and image data
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
dims | number[] | ... | image dimensions [x, y, z] |
pixDims | number[] | ... | voxel dimensions in mm [x, y, z] |
affine | number[] | ... | 4×4 affine transformation matrix in row-major order |
datatypeCode | NiiDataType | NiiDataType.DT_UINT8 | NIfTI datatype code (e.g., DT_UINT8, DT_FLOAT32) |
img | Uint8Array | ... | image data buffer (optional) |
Returns
Promise<Uint8Array>
a Uint8Array representing a complete NIfTI file
See
createOnLocationChange()
createOnLocationChange(axCorSag: number): void;
Defined in: niivue/index.ts:10274
Internal utility to generate human-readable location strings for the onLocationChange callback
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
axCorSag | number | NaN | optional axis index for coordinate interpretation (NaN by default) |
Returns
void
Remarks
Computes string representation of current crosshair position in mm (and frame if 4D).
See
decimateHierarchicalMesh()
decimateHierarchicalMesh(mesh: number, order: number): boolean;
Defined in: niivue/index.ts:3755
reduce complexity of FreeSurfer mesh
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
mesh | number | undefined | identity of mesh to change |
order | number | 3 | decimation order 0..6 |
Returns
boolean
boolean false if mesh is not hierarchical or of lower order
Example
niivue.decimateHierarchicalMesh(niivue.meshes[0].id, 4);
See
dispatchEvent()
dispatchEvent(event: Event): boolean;
Defined in: ../../../node_modules/typescript/lib/lib.dom.d.ts:8309
Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise.
Parameters
| Parameter | Type |
|---|---|
event | Event |
Returns
boolean
Inherited from
EventTarget.dispatchEvent;
doSyncGamma()
doSyncGamma(otherNV: Niivue): void;
Defined in: niivue/index.ts:972
Parameters
| Parameter | Type |
|---|---|
otherNV | Niivue |
Returns
void
drawGrowCut()
drawGrowCut(): void;
Defined in: niivue/index.ts:5373
dilate drawing so all voxels are colored. works on drawing with multiple colors
Returns
void
Example
niivue.drawGrowCut();
See
drawingBinaryDilationWithSeed()
drawingBinaryDilationWithSeed(seedXYZ: number[], neighbors: 6 | 18 | 26): void;
Defined in: niivue/index.ts:5599
Performs a 1-voxel binary dilation on a connected cluster within the drawing mask using the drawFloodFillCore function.
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
seedXYZ | number[] | undefined | voxel index of the seed voxel in the mask array. |
neighbors | 6 | 18 | 26 | 6 | Number of neighbors to consider for connectivity and dilation (6, 18, or 26). |
Returns
void
drawMosaic()
drawMosaic(mosaicStr: string): void;
Defined in: niivue/index.ts:11372
display a lightbox or montage view
Parameters
| Parameter | Type | Description |
|---|---|---|
mosaicStr | string | specifies orientation (A,C,S) and location of slices. |
Returns
void
Example
niivue.setSliceMosaicString("A -10 0 20");
See
drawOtsu()
drawOtsu(levels: number): void;
Defined in: niivue/index.ts:3526
remove dark voxels in air
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
levels | number | 2 | (2-4) segment brain into this many types. For example drawOtsu(2) will create a binary drawing where bright voxels are colored and dark voxels are clear. |
Returns
void
Example
niivue.drawOtsu(3);
See
drawUndo()
drawUndo(): void;
Defined in: niivue/index.ts:3385
Restore drawing to previous state
Returns
void
Example
niivue.drawUndo();
See
eventInBounds()
eventInBounds(evt: MouseEvent | TouchEvent | Touch): boolean;
Defined in: niivue/index.ts:11564
Returns true if a mouse/touch event happened inside this instance's bounds.
Parameters
| Parameter | Type |
|---|---|
evt | MouseEvent | TouchEvent | Touch |
Returns
boolean
findDrawingBoundarySlices()
findDrawingBoundarySlices(sliceType: SLICE_TYPE): object;
Defined in: niivue/index.ts:12358
Find the first and last slices containing drawing data along a given axis
Parameters
| Parameter | Type | Description |
|---|---|---|
sliceType | SLICE_TYPE | The slice orientation (AXIAL, CORONAL, or SAGITTAL) |
Returns
object
Object containing first and last slice indices, or null if no data found
| Name | Type | Defined in |
|---|---|---|
first | number | niivue/index.ts:12358 |
last | number | niivue/index.ts:12358 |
generateHTML()
generateHTML(canvasId: string, esm: string): Promise<string>;
Defined in: niivue/index.ts:4875
generates HTML of current scene
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
canvasId | string | 'gl1' | id of canvas NiiVue will be attached to |
esm | string | undefined | bundled version of NiiVue |
Returns
Promise<string>
HTML with javascript of the current scene
Example
const template = `<html><body><canvas id="gl1"></canvas><script type="module" async>
%%javascript%%</script></body></html>`;
nv1.generateHTML("page.html", esm);
generateLoadDocumentJavaScript()
generateLoadDocumentJavaScript(canvasId: string, esm: string): Promise<string>;
Defined in: niivue/index.ts:4834
generates JavaScript to load the current scene as a document
Parameters
| Parameter | Type | Description |
|---|---|---|
canvasId | string | id of canvas NiiVue will be attached to |
esm | string | bundled version of NiiVue |
Returns
Promise<string>
Example
const javascript = this.generateLoadDocumentJavaScript("gl1");
const html = `<html><body><canvas id="gl1"></canvas><script type="module" async>
${javascript}</script></body></html>`;
See
getCustomLayout()
getCustomLayout(): object[];
Defined in: niivue/index.ts:3131
Get the current custom layout if set
Returns
object[]
The current custom layout or null if using built-in layouts
getDescriptives()
getDescriptives(options: object): Descriptive;
Defined in: niivue/index.ts:6666
basic statistics for selected voxel-based image
Parameters
| Parameter | Type | Description |
|---|---|---|
options | { drawingIsMask?: boolean; endVox?: number[]; layer?: number; masks?: number[]; roiIsMask?: boolean; startVox?: number[]; } | an object containing the following properties: - layer: selects image to describe - masks: optional binary images to filter voxels - drawingIsMask: a boolean indicating if the drawing is used as a mask - roiIsMask: a boolean indicating if the ROI is used as a mask - startVox: the starting voxel coordinates - endVox: the ending voxel coordinates |
options.drawingIsMask? | boolean | - |
options.endVox? | number[] | - |
options.layer? | number | - |
options.masks? | number[] | - |
options.roiIsMask? | boolean | - |
options.startVox? | number[] | - |
Returns
numeric values to describe image or regions of images
Example
niivue.getDescriptives({
layer: 0,
masks: [],
drawingIsMask: true, // drawingIsMask and roiIsMask are mutually exclusive
roiIsMask: false,
startVox: [10, 20, 30], // ignored if roiIsMask is false
endVox: [40, 50, 60], // ignored if roiIsMask is false
});
See
getDicomLoader()
getDicomLoader(): DicomLoader;
Defined in: niivue/index.ts:2788
Get the currently assigned DICOM loader.
Returns
DicomLoader
getFrame4D()
getFrame4D(id: string): number;
Defined in: niivue/index.ts:7506
determine active 3D volume from 4D time series
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | the ID of the 4D NVImage |
Returns
number
currently selected volume (indexed from 0)
Example
nv1.getFrame4D(nv1.volumes[0].id);
See
getGradientTextureData()
getGradientTextureData(): Float32Array;
Defined in: niivue/index.ts:6558
Get the gradient texture produced by gradientGL as a TypedArray
Returns
Float32Array
Float32Array containing the gradient texture data, or null if no gradient texture exists
Example
niivue = new Niivue();
niivue.loadVolumes([{ url: "./someImage.nii" }]);
// ... after volume is loaded and gradient is computed
const gradientData = niivue.getGradientTextureData();
if (gradientData) {
console.log("Gradient texture dimensions:", gradientData.length);
}
See
getMeshIndexByID()
getMeshIndexByID(id: string | number): number;
Defined in: niivue/index.ts:3699
Returns the index of a mesh given its ID or index.
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | number | The mesh ID as a string, or an index number. |
Returns
number
The mesh index, or -1 if not found or out of range.
getMouseEventConfig()
getMouseEventConfig(): MouseEventConfig;
Defined in: niivue/index.ts:8670
Get current mouse event configuration.
Returns
Current mouse event configuration or undefined if using defaults
getOverlayIndexByID()
getOverlayIndexByID(id: string): number;
Defined in: niivue/index.ts:3842
get the index of an overlay by its unique id. unique ids are assigned to the NVImage.id property when a new NVImage is created.
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | the id string to search for |
Returns
number
See
NiiVue#getVolumeIndexByID
Example
niivue = new Niivue();
niivue.getOverlayIndexByID(someVolume.id);
getRadiologicalConvention()
getRadiologicalConvention(): boolean;
Defined in: niivue/index.ts:3229
Detect if display is using radiological or neurological convention.
Returns
boolean
radiological convention status
Example
let rc = niivue.getRadiologicalConvention();
getTouchEventConfig()
getTouchEventConfig(): TouchEventConfig;
Defined in: niivue/index.ts:8678
Get current touch event configuration.
Returns
Current touch event configuration or undefined if using defaults
getVolumeAffine()
getVolumeAffine(volIdx: number): number[][];
Defined in: niivue/index.ts:4448
Get the current affine matrix of a volume.
Parameters
| Parameter | Type | Description |
|---|---|---|
volIdx | number | index of volume (0 = base image, 1+ = overlays) |
Returns
number[][]
A deep copy of the 4x4 affine matrix as a 2D array (row-major)
Example
const affine = niivue.getVolumeAffine(1); // get affine of first overlay
getVolumeIndexByID()
getVolumeIndexByID(id: string): number;
Defined in: niivue/index.ts:3343
get the index of a volume by its unique id. unique ids are assigned to the NVImage.id property when a new NVImage is created.
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | the id string to search for |
Returns
number
Example
niivue = new Niivue();
niivue.getVolumeIndexByID(someVolume.id);
getZarrVolume()
getZarrVolume(): NVImage;
Defined in: niivue/index.ts:8719
Returns
getZarrVolumes()
getZarrVolumes(): NVImage[];
Defined in: niivue/index.ts:8728
Returns
NVImage[]
inBounds()
inBounds(x: number, y: number): boolean;
Defined in: niivue/index.ts:11636
Return true if the given canvas pixel coordinates are inside this Niivue instance's bounds.
Parameters
| Parameter | Type |
|---|---|
x | number |
y | number |
Returns
boolean
indexNearestXYZmm()
indexNearestXYZmm(
mesh: number,
Xmm: number,
Ymm: number,
Zmm: number): number[];
Defined in: niivue/index.ts:3737
returns the index of the mesh vertex that is closest to the provided coordinates
Parameters
| Parameter | Type | Description |
|---|---|---|
mesh | number | identity of mesh to change |
Xmm | number | location in left/right dimension |
Ymm | number | location in posterior/anterior dimension |
Zmm | number | location in foot/head dimension |
Returns
number[]
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
interpolateMaskSlices()
interpolateMaskSlices(
sliceIndexLow?: number,
sliceIndexHigh?: number,
options?: object): void;
Defined in: niivue/index.ts:12373
Interpolate between mask slices using geometric or intensity-guided methods
Parameters
| Parameter | Type | Description |
|---|---|---|
sliceIndexLow? | number | Lower slice index (optional, will auto-detect if not provided) |
sliceIndexHigh? | number | Higher slice index (optional, will auto-detect if not provided) |
options? | { applySmoothingToSlices?: boolean; binaryThreshold?: number; intensitySigma?: number; intensityWeight?: number; sliceType?: SLICE_TYPE; useIntensityGuided?: boolean; } | Interpolation options |
options.applySmoothingToSlices? | boolean | - |
options.binaryThreshold? | number | - |
options.intensitySigma? | number | - |
options.intensityWeight? | number | - |
options.sliceType? | SLICE_TYPE | - |
options.useIntensityGuided? | boolean | - |
Returns
void
json()
json(): ExportDocumentData;
Defined in: niivue/index.ts:4965
Converts NiiVue scene to JSON
Returns
loadConnectome()
loadConnectome(json:
| LegacyConnectome
| Connectome): this;
Defined in: niivue/index.ts:5332
load a connectome specified by json
Parameters
| Parameter | Type | Description |
|---|---|---|
json | | LegacyConnectome | Connectome | connectome model |
Returns
this
Niivue instance
See
loadConnectomeFromUrl()
loadConnectomeFromUrl(url: string, headers: object): Promise<Niivue>;
Defined in: niivue/index.ts:5275
Load a connectome from a given URL and initialize it.
Parameters
| Parameter | Type | Description |
|---|---|---|
url | string | the URL to a JSON-formatted connectome definition |
headers | { } | optional HTTP headers to include with the request (e.g. for authorization) |
Returns
Promise<Niivue>
the Niivue instance (for method chaining)
See
loadDeferred4DVolumes()
loadDeferred4DVolumes(id: string): Promise<void>;
Defined in: niivue/index.ts:7449
Load all volumes for image opened with limitFrames4D, the user can also click the ... on a 4D timeline to load deferred volumes
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | the ID of the 4D NVImage |
Returns
Promise<void>
loadDicoms()
loadDicoms(dicomList: ImageFromUrlOptions[]): Promise<Niivue>;
Defined in: niivue/index.ts:5057
Parameters
| Parameter | Type |
|---|---|
dicomList | ImageFromUrlOptions[] |
Returns
Promise<Niivue>
loadDocument()
loadDocument(document: NVDocument): Promise<Niivue>;
Defined in: niivue/index.ts:4663
Loads an NVDocument
Parameters
| Parameter | Type |
|---|---|
document | NVDocument |
Returns
Promise<Niivue>
Niivue instance
See
loadDocumentFromUrl()
loadDocumentFromUrl(url: string): Promise<void>;
Defined in: niivue/index.ts:4653
Loads an NVDocument from a URL and integrates it into the scene.
Parameters
| Parameter | Type |
|---|---|
url | string |
Returns
Promise<void>
loadDrawing()
loadDrawing(drawingBitmap: NVImage): boolean;
Defined in: niivue/index.ts:3406
Loads a drawing overlay and aligns it with the current background image. Converts the input image to match the background's orientation and stores it as a drawable bitmap. Initializes the undo history and prepares the drawing texture.
Parameters
| Parameter | Type | Description |
|---|---|---|
drawingBitmap | NVImage | A NVImage object representing the drawing to load. Must match the dimensions of the background image. |
Returns
boolean
true if the drawing was successfully loaded and aligned; false if dimensions are incompatible.
loadDrawingFromUrl()
loadDrawingFromUrl(fnm: string, isBinarize: boolean): Promise<boolean>;
Defined in: niivue/index.ts:3482
Open drawing
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
fnm | string | undefined | filename of NIfTI format drawing |
isBinarize | boolean | false | if true will force drawing voxels to be either 0 or 1. |
Returns
Promise<boolean>
Example
niivue.loadDrawingFromUrl("../images/lesion.nii.gz");
See
loadFont()
loadFont(fontSheetUrl: any, metricsUrl: object): Promise<void>;
Defined in: niivue/index.ts:6202
Load typeface for colorbars, measurements and orientation text.
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
fontSheetUrl | any | defaultFontPNG | URL to a bitmap font sheet image (e.g., a PNG atlas of glyphs) |
metricsUrl | { atlas: { distanceRange: number; height: number; size: number; type: string; width: number; yOrigin: string; }; glyphs: ( | { advance: number; atlasBounds?: undefined; planeBounds?: undefined; unicode: number; } | { advance: number; atlasBounds: { bottom: number; left: number; right: number; top: number; }; planeBounds: { bottom: number; left: number; right: number; top: number; }; unicode: number; })[]; kerning: any[]; metrics: { ascender: number; descender: number; emSize: number; lineHeight: number; underlineThickness: number; underlineY: number; }; } | defaultFontMetrics | URL to the corresponding font metrics JSON (defines character bounds and spacing) |
metricsUrl.atlas | { distanceRange: number; height: number; size: number; type: string; width: number; yOrigin: string; } | ... | - |
metricsUrl.atlas.distanceRange | number | 2 | - |
metricsUrl.atlas.height | number | 256 | - |
metricsUrl.atlas.size | number | 59.65625 | - |
metricsUrl.atlas.type | string | "msdf" | - |
metricsUrl.atlas.width | number | 512 | - |
metricsUrl.atlas.yOrigin | string | "bottom" | - |
metricsUrl.glyphs | ( | { advance: number; atlasBounds?: undefined; planeBounds?: undefined; unicode: number; } | { advance: number; atlasBounds: { bottom: number; left: number; right: number; top: number; }; planeBounds: { bottom: number; left: number; right: number; top: number; }; unicode: number; })[] | ... | - |
metricsUrl.kerning | any[] | [] | - |
metricsUrl.metrics | { ascender: number; descender: number; emSize: number; lineHeight: number; underlineThickness: number; underlineY: number; } | ... | - |
metricsUrl.metrics.ascender | number | 0.927734375 | - |
metricsUrl.metrics.descender | number | -0.244140625 | - |
metricsUrl.metrics.emSize | number | 1 | - |
metricsUrl.metrics.lineHeight | number | 1.171875 | - |
metricsUrl.metrics.underlineThickness | number | 0.048828125 | - |
metricsUrl.metrics.underlineY | number | -0.09765625 | - |
Returns
Promise<void>
a Promise that resolves when the font is loaded
Example
niivue.loadFont("./Roboto.png", "./Roboto.json");
See
loadFreeSurferConnectome()
loadFreeSurferConnectome(json: FreeSurferConnectome): Promise<Niivue>;
Defined in: niivue/index.ts:5300
load a connectome specified by json
Parameters
| Parameter | Type | Description |
|---|---|---|
json | FreeSurferConnectome | freesurfer model |
Returns
Promise<Niivue>
Niivue instance
See
loadFreeSurferConnectomeFromUrl()
loadFreeSurferConnectomeFromUrl(url: string, headers: object): Promise<Niivue>;
Defined in: niivue/index.ts:5288
Load a FreeSurfer-style connectome from a given URL and initialize it.
Parameters
| Parameter | Type | Description |
|---|---|---|
url | string | the URL of the JSON-formatted connectome file |
headers | { } | optional HTTP headers to include in the fetch request (e.g. for authorization) |
Returns
Promise<Niivue>
the Niivue instance (for method chaining)
See
loadFromArrayBuffer()
loadFromArrayBuffer(buffer: ArrayBuffer, name: string): Promise<void>;
Defined in: niivue/index.ts:2706
Load an image or mesh from an array buffer
Parameters
| Parameter | Type | Description |
|---|---|---|
buffer | ArrayBuffer | ArrayBuffer with the entire contents of a mesh or volume |
name | string | string of filename, extension used to infer type (NIfTI, MGH, MZ3, etc) |
Returns
Promise<void>
See
loadFromFile()
loadFromFile(file: File): Promise<void>;
Defined in: niivue/index.ts:2724
Load a mesh or image volume from a File object
Parameters
| Parameter | Type | Description |
|---|---|---|
file | File | File object selected by the user (e.g. from an HTML input element) |
Returns
Promise<void>
a Promise that resolves when the file has been loaded and added to the scene
See
loadFromUrl()
loadFromUrl(fnm: string): Promise<NVImage>;
Defined in: niivue/index.ts:7256
Load a NIfTI image from a URL and convert it to an NVImage object
Parameters
| Parameter | Type | Description |
|---|---|---|
fnm | string | URL of the NIfTI file to load |
Returns
Promise<NVImage>
a Promise resolving to an NVImage (not yet added to GPU or scene)
See
loadImages()
loadImages(images: (
| LoadFromUrlParams
| ImageFromUrlOptions)[]): Promise<Niivue>;
Defined in: niivue/index.ts:5018
Load an array of image or mesh URLs using appropriate handlers
Parameters
| Parameter | Type | Description |
|---|---|---|
images | ( | LoadFromUrlParams | ImageFromUrlOptions)[] | array of image or mesh descriptors (with URL and optional name) |
Returns
Promise<Niivue>
a Promise resolving to the current NiiVue instance after loading completes
Remarks
Automatically dispatches each item to either volume or mesh loader based on file extension or registered custom loader
See
loadMatCapTexture()
loadMatCapTexture(bmpUrl: string): Promise<WebGLTexture>;
Defined in: niivue/index.ts:12330
Load matcap for illumination model.
Parameters
| Parameter | Type | Description |
|---|---|---|
bmpUrl | string | name of matcap to load ("Shiny", "Cortex", "Cream") |
Returns
Promise<WebGLTexture>
Example
niivue.loadMatCapTexture("Cortex");
See
loadMeshes()
loadMeshes(meshList: LoadFromUrlParams[]): Promise<Niivue>;
Defined in: niivue/index.ts:5249
load an array of meshes
Parameters
| Parameter | Type | Description |
|---|---|---|
meshList | LoadFromUrlParams[] | the array of objects to load. each object must have a resolvable "url" property at a minimum |
Returns
Promise<Niivue>
Niivue instance
Example
niivue = new Niivue();
niivue.loadMeshes([{ url: "someMesh.gii" }]);
See
loadVolumes()
loadVolumes(volumeList: ImageFromUrlOptions[]): Promise<Niivue>;
Defined in: niivue/index.ts:5109
load an array of volume objects
Parameters
| Parameter | Type | Description |
|---|---|---|
volumeList | ImageFromUrlOptions[] | the array of objects to load. each object must have a resolvable "url" property at a minimum |
Returns
Promise<Niivue>
returns the Niivue instance
Example
niivue = new Niivue()
niivue.loadVolumes([{url: 'someImage.nii.gz}, {url: 'anotherImage.nii.gz'}])
See
meshShaderNames()
meshShaderNames(sort: boolean): string[];
Defined in: niivue/index.ts:6372
retrieve all currently loaded meshes
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
sort | boolean | true | sort output alphabetically |
Returns
string[]
list of available mesh shader names
Example
niivue.meshShaderNames();
See
moveCrosshairInVox()
moveCrosshairInVox(
x: number,
y: number,
z: number): void;
Defined in: niivue/index.ts:10959
move crosshair a fixed number of voxels (not mm)
Parameters
| Parameter | Type | Description |
|---|---|---|
x | number | translate left (-) or right (+) |
y | number | translate posterior (-) or +anterior (+) |
z | number | translate inferior (-) or superior (+) |
Returns
void
Example
niivue.moveCrosshairInVox(1, 0, 0);
See
moveVolumeDown()
moveVolumeDown(volume: NVImage): void;
Defined in: niivue/index.ts:4006
Move a volume down one index position in the stack of loaded volumes. This moves it down one layer
Parameters
| Parameter | Type | Description |
|---|---|---|
volume | NVImage | the volume to move |
Returns
void
Example
niivue = new Niivue();
niivue.moveVolumeDown(this.volumes[1]); // move the second image to the background position (it was 1 index, now will be 0)
moveVolumeToBottom()
moveVolumeToBottom(volume: NVImage): void;
Defined in: niivue/index.ts:3972
Move a volume to the bottom of the stack of loaded volumes. The volume will become the background
Parameters
| Parameter | Type | Description |
|---|---|---|
volume | NVImage | the volume to move |
Returns
void
Example
niivue = new Niivue();
niivue.moveVolumeToBottom(this.volumes[3]); // move the 4th volume to the 0 position. It will be the new background
moveVolumeToTop()
moveVolumeToTop(volume: NVImage): void;
Defined in: niivue/index.ts:4023
Move a volume to the top position in the stack of loaded volumes. This will be the top layer
Parameters
| Parameter | Type | Description |
|---|---|---|
volume | NVImage | the volume to move |
Returns
void
Example
niivue = new Niivue();
niivue.moveVolumeToTop(this.volumes[0]); // move the background image to the top layer position
moveVolumeUp()
moveVolumeUp(volume: NVImage): void;
Defined in: niivue/index.ts:3989
Move a volume up one index position in the stack of loaded volumes. This moves it up one layer
Parameters
| Parameter | Type | Description |
|---|---|---|
volume | NVImage | the volume to move |
Returns
void
Example
niivue = new Niivue();
niivue.moveVolumeUp(this.volumes[0]); // move the background image to the second index position (it was 0 index, now will be 1)
niftiArray2NVImage()
niftiArray2NVImage(bytes: Uint8Array): Promise<NVImage>;
Defined in: niivue/index.ts:7246
Convert a binary NIfTI file (as a Uint8Array) to an NVImage object
Parameters
| Parameter | Type | Description |
|---|---|---|
bytes | Uint8Array | binary contents of a NIfTI file |
Returns
Promise<NVImage>
a Promise resolving to an NVImage object
See
refreshColormaps()
refreshColormaps(): Niivue;
Defined in: niivue/index.ts:7580
Rebuild and upload all colormap textures for volumes and meshes
Returns
Niivue
the current NiiVue instance, or undefined if no colormaps are used
See
refreshDrawing()
refreshDrawing(isForceRedraw: boolean, useClickToSegmentBitmap: boolean): void;
Defined in: niivue/index.ts:6027
copy drawing bitmap from CPU to GPU storage and redraw the screen
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
isForceRedraw | boolean | true | refreshes scene immediately (default true) |
useClickToSegmentBitmap | boolean | false | - |
Returns
void
Example
niivue.refreshDrawing();
See
removeEventListener()
removeEventListener<K>(
type: K,
listener: NiivueEventListener<K>,
options?: NiivueEventListenerOptions): void;
Defined in: niivue/index.ts:732
Type-safe removeEventListener for Niivue events.
Type Parameters
| Type Parameter |
|---|
K extends keyof NiivueEventMap |
Parameters
| Parameter | Type | Description |
|---|---|---|
type | K | Event name |
listener | NiivueEventListener<K> | Event listener function to remove |
options? | NiivueEventListenerOptions | Event listener options |
Returns
void
Overrides
EventTarget.removeEventListener;
removeHaze()
removeHaze(level: number, volIndex: number): void;
Defined in: niivue/index.ts:3555
remove dark voxels in air
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
level | number | 5 | (1-5) larger values for more preserved voxels |
volIndex | number | 0 | volume to dehaze |
Returns
void
Example
niivue.removeHaze(3, 0);
See
removeMesh()
removeMesh(mesh: NVMesh): void;
Defined in: niivue/index.ts:3936
Remove a triangulated mesh, connectome or tractogram
Parameters
| Parameter | Type | Description |
|---|---|---|
mesh | NVMesh | mesh to delete |
Returns
void
Example
niivue = new Niivue();
niivue.removeMesh(this.meshes[3]);
See
removeMeshByUrl()
removeMeshByUrl(url: string): void;
Defined in: niivue/index.ts:3955
Remove a triangulated mesh, connectome or tractogram
Parameters
| Parameter | Type | Description |
|---|---|---|
url | string | URL of mesh to delete |
Returns
void
Example
niivue.removeMeshByUrl("../images/cit168.mz3");
removeVolume()
removeVolume(volume: NVImage): void;
Defined in: niivue/index.ts:3891
Remove a volume
Parameters
| Parameter | Type | Description |
|---|---|---|
volume | NVImage | volume to delete |
Returns
void
Example
niivue = new Niivue();
niivue.removeVolume(this.volumes[3]);
See
removeVolumeByIndex()
removeVolumeByIndex(index: number): void;
Defined in: niivue/index.ts:3921
Remove a volume from the scene by its index
Parameters
| Parameter | Type | Description |
|---|---|---|
index | number | index of the volume to remove |
Returns
void
Throws
if the index is out of bounds
See
removeVolumeByUrl()
removeVolumeByUrl(url: string): void;
Defined in: niivue/index.ts:2664
Remove volume by url
Parameters
| Parameter | Type | Description |
|---|---|---|
url | string | Volume added by url to remove |
Returns
void
See
resetVolumeAffine()
resetVolumeAffine(volIdx: number): void;
Defined in: niivue/index.ts:4501
Reset a volume's affine matrix to its original state when first loaded.
Parameters
| Parameter | Type | Description |
|---|---|---|
volIdx | number | index of volume to reset (0 = base image, 1+ = overlays) |
Returns
void
Example
niivue.resetVolumeAffine(1); // reset overlay to original position
reverseFaces()
reverseFaces(mesh: number): void;
Defined in: niivue/index.ts:3774
reverse triangle winding of mesh (swap front and back faces)
Parameters
| Parameter | Type | Description |
|---|---|---|
mesh | number | identity of mesh to change |
Returns
void
Example
niivue.reverseFaces(niivue.meshes[0].id);
See
saveDocument()
saveDocument(
fileName: string,
compress: boolean,
options: object): Promise<void>;
Defined in: niivue/index.ts:4992
Save the current scene as an .nvd document.
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
fileName | string | 'untitled.nvd' | Name of the file to create (default "untitled.nvd") |
compress | boolean | true | If true, gzip-compress the JSON (default true) |
options | { embedImages?: boolean; embedPreview?: boolean; } | {} | Fine-grained switches: • embedImages – store encodedImageBlobs (default true) • embedPreview – store previewImageDataURL (default true) |
options.embedImages? | boolean | undefined | - |
options.embedPreview? | boolean | undefined | - |
Returns
Promise<void>
Example
// smallest possible file – no preview, just metadata
await nv.saveDocument("scene.nvd", true, {
embedImages: false,
embedPreview: false,
});
See
saveHTML()
saveHTML(
fileName: string,
canvasId: string,
esm: string): Promise<void>;
Defined in: niivue/index.ts:4957
Save the current scene as a standalone HTML file
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
fileName | string | 'untitled.html' | name of the HTML file to save (default: "untitled.html") |
canvasId | string | 'gl1' | ID of the canvas element NiiVue will attach to |
esm | string | undefined | bundled ES module source for NiiVue |
Returns
Promise<void>
a Promise that resolves when the file is downloaded
See
saveImage()
saveImage(options: SaveImageOptions): Promise<boolean | Uint8Array>;
Defined in: niivue/index.ts:3591
Save voxel-based image to disk.
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
options | SaveImageOptions | defaultSaveImageOptions | configuration object with the following fields: - filename: name of the NIfTI image to create - isSaveDrawing: whether to save the drawing layer or the background image - volumeByIndex: which image layer to save (0 for background) |
Returns
Promise<boolean | Uint8Array>
true if successful when writing to disk, or a Uint8Array if exported as binary data
Example
niivue.saveImage({ filename: "myimage.nii.gz", isSaveDrawing: true });
niivue.saveImage({ filename: "myimage.nii.gz", isSaveDrawing: true });
See
saveScene()
saveScene(filename: string): Promise<void>;
Defined in: niivue/index.ts:814
save webgl2 canvas as png format bitmap
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
filename | string | 'niivue.png' | filename for screen capture |
Returns
Promise<void>
Example
niivue.saveScene("test.png");
See
setAdditiveBlend()
setAdditiveBlend(isAdditiveBlend: boolean): void;
Defined in: niivue/index.ts:3219
control whether voxel overlays are combined using additive (emission) or traditional (transmission) blending.
Parameters
| Parameter | Type | Description |
|---|---|---|
isAdditiveBlend | boolean | emission (true) or transmission (false) mixing |
Returns
void
Example
niivue.isAdditiveBlend(true);
See
setAtlasOutline()
setAtlasOutline(isOutline: number): void;
Defined in: niivue/index.ts:9240
Enable or disable atlas outline overlay
Parameters
| Parameter | Type | Description |
|---|---|---|
isOutline | number | number 0 to 1 for outline opacity |
Returns
void
See
setBounds()
setBounds(bounds: [number, number, number, number]): void;
Defined in: niivue/index.ts:4333
Update the drawing bounds for this Niivue instance.
Parameters
| Parameter | Type | Description |
|---|---|---|
bounds | [number, number, number, number] | [x1, y1, x2, y2] in normalized (0–1) coordinates. Example: nv.setBounds([0,0,0.5,0.5]) // top-left quarter nv.setBounds([0.5,0.5,1,1]) // bottom-right quarter |
Returns
void
setClipPlane()
setClipPlane(depthAzimuthElevation: number[]): void;
Defined in: niivue/index.ts:4142
Update the clip plane orientation in 3D view mode.
Parameters
| Parameter | Type | Description |
|---|---|---|
depthAzimuthElevation | number[] | a 3-component array: - depth: distance of clip plane from center of volume (0 to ~1.73, or >2.0 to disable clipping) - azimuth: camera angle around the object in degrees (0–360 or -180–180) - elevation: camera height in degrees (-90 to 90) |
Returns
void
Example
niivue = new Niivue();
niivue.setClipPlane([42, 42]);
See
setClipPlaneColor()
setClipPlaneColor(color: number[]): void;
Defined in: niivue/index.ts:4534
Set the color of the 3D clip plane.
Parameters
| Parameter | Type | Description |
|---|---|---|
color | number[] | An array of RGBA values. - R, G, B components range from 0.0 to 1.0. - A (alpha) component ranges from -1.0 to 1.0, where: - 0.0–1.0 → controls background translucency. - -1.0–0.0 → applies translucent shading to the volume instead of the background. |
Returns
void
Example
niivue.setClipPlaneColor([1, 1, 1, 0.5]); // white, translucent background
niivue.setClipPlaneColor([1, 1, 1, -0.5]); // white, translucent shading
See
setClipPlanes()
setClipPlanes(depthAziElevs: number[][]): void;
Defined in: niivue/index.ts:4124
Set multiple clip planes from their depth/azimuth/elevation definitions.
depth: distance of clip plane from center of volume, range 0..~1.73 (e.g. 2.0 for no clip plane) azimuth: camera position in degrees around object, typically 0..360 (or -180..+180) elevation: camera height in degrees, range -90..90
This replaces the entire clipPlanes and clipPlaneDepthAziElevs arrays,
ensuring they always have the same length.
Parameters
| Parameter | Type | Description |
|---|---|---|
depthAziElevs | number[][] | array of [depth, azimuthDeg, elevationDeg] values |
Returns
void
See
setClipPlaneThick()
setClipPlaneThick(_thick: number): void;
Defined in: niivue/index.ts:4546
Parameters
| Parameter | Type |
|---|---|
_thick | number |
Returns
void
Deprecated
This method has been removed. Use setClipPlanes instead, which generalizes clip plane configuration
See
setClipVolume()
setClipVolume(_low: number[], _high: number[]): void;
Defined in: niivue/index.ts:4555
Parameters
| Parameter | Type |
|---|---|
_low | number[] |
_high | number[] |
Returns
void
Deprecated
This method has been removed. Use setClipPlanes instead, which generalizes clip plane configuration
See
setColormap()
setColormap(id: string, colormap: string): void;
Defined in: niivue/index.ts:7118
update the colormap of an image given its ID
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | the ID of the NVImage |
colormap | string | the name of the colormap to use |
Returns
void
Example
niivue.setColormap(niivue.volumes[0].id,, 'red')
See
setColorMap()
setColorMap(id: string, colormap: string): void;
Defined in: niivue/index.ts:7390
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | ID of the volume |
colormap | string | name of the colormap to apply |
Returns
void
Deprecated
Use setColormap instead. This alias is retained for compatibility with NiiVue < 0.35.
setColormapNegative()
setColormapNegative(id: string, colormapNegative: string): void;
Defined in: niivue/index.ts:7403
use given color map for negative voxels in image
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | the ID of the NVImage |
colormapNegative | string | the name of the colormap to use |
Returns
void
Example
niivue = new Niivue();
niivue.setColormapNegative(niivue.volumes[1].id, "winter");
See
setCornerOrientationText()
setCornerOrientationText(isCornerOrientationText: boolean): void;
Defined in: niivue/index.ts:3039
determine if text appears at corner (true) or sides of 2D slice.
Parameters
| Parameter | Type | Description |
|---|---|---|
isCornerOrientationText | boolean | controls position of text |
Returns
void
Example
niivue.setCornerOrientationText(true);
See
setCrosshairColor()
setCrosshairColor(color: number[]): void;
Defined in: niivue/index.ts:4172
set the crosshair and colorbar outline color
Parameters
| Parameter | Type | Description |
|---|---|---|
color | number[] | an RGBA array. values range from 0 to 1 |
Returns
void
Example
niivue = new Niivue();
niivue.setCrosshairColor([0, 1, 0, 0.5]); // set crosshair to transparent green
See
setCrosshairWidth()
setCrosshairWidth(crosshairWidth: number): void;
Defined in: niivue/index.ts:4182
set thickness of crosshair
Parameters
| Parameter | Type |
|---|---|
crosshairWidth | number |
Returns
void
Example
niivue.crosshairWidth(2);
See
setCustomGradientTexture()
setCustomGradientTexture(data: Float32Array | Uint8Array, dims?: number[]): void;
Defined in: niivue/index.ts:6584
Set a custom gradient texture to use instead of the one produced by gradientGL When a custom gradient texture is set, the useCustomGradientTexture flag is set to true to prevent gradientGL from overwriting the custom texture during volume updates.
Parameters
| Parameter | Type | Description |
|---|---|---|
data | Float32Array | Uint8Array | Float32Array or Uint8Array containing RGBA gradient data, or null to revert to auto-generated gradient |
dims? | number[] | Optional dimensions array [width, height, depth]. If not provided, uses current volume dimensions |
Returns
void