3D volume renderer
Last updated 2 years ago by ilmarihei .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install gl-volume3d 
SYNC missed versions from official npm registry.


Visualization module for volumetric data.


var createScene      = require('gl-plot3d')
var createVolume     = require('gl-volume3d')

var scene = createScene()

var width = 64
var height = 64
var depth = 64

var data = new Uint16Array(width*height*depth)
for (var z=0; z<depth; z++)
for (var y=0; y<height; y++)
for (var x=0; x<width; x++) {
	var value = 1500 + 500 * (
		Math.sin(3 * 2*Math.PI*(z/depth-0.5)) +
		Math.cos(4 * 2*Math.PI*(x/width-0.5)) +
		Math.sin(5 * 2*Math.PI*(h/height-0.5))
	data[z*height*width + y*width + x] = value

var dims = [width, height, depth]
var bounds = [[0,0,0], [width, height, depth]]

var volumePlot = createVolume({
	gl: gl,
	values: data,
	dimensions: dims,
	isoBounds: [1600, 2000],
	intensityBounds: [1000, 2000],
	colormap: 'portland'
}, bounds)


Try out the example in your browser


npm i gl-volume3d

Basic interface


var volume = require('gl-volume3d')(params, bounds)

Creates a volume visualization out of a 3D array.

  • params is an object that has the following properties:

    • gl (Required) WebGL context to use
    • values (Required) An flattened 3D array of values
    • meshgrid (Optional) Meshgrid to use for the value coordinates
    • dimensions (Required) The dimensions of the array. When used with meshgrid, sets the resolution of the 3D texture. When using meshgrid, the 3D texture values are sampled in an uniform fashion between the start and end coordinates of the meshgrid.
    • isoBounds (Recommended) The range of values to envelop with the isosurface. Defaults to [1, Infinity], which creates an isosurface that has all values 1 and larger inside it.
    • intensityBounds (Optional) The range of values to map to [0..1] intensities. Defaults to the minimum and maximum values of the values array.
    • colormap (Optional) Name of the color map to use.
    • alphamap (Optional) Opacity lookup table, a 256-element array that maps intensity to voxel opacity. The first element is intensity 0 (after intensityBounds mapping), the last element is intensity 1.
    • opacity (Optional) Multiplier for the voxel opacities. Used for controlling the volume transparency.
  • bounds is a bounds object that tells what part of the 3D array to display. It defaults to [[0, 0, 0], [width, height, depth]].

Returns A volume plot object that can be passed to gl-mesh3d.


(c) 2013-2017 Mikola Lysenko, Ilmari Heikkinen. MIT License

Current Tags

  • 0.5.0                                ...           latest (2 years ago)

1 Versions

  • 0.5.0                                ...           2 years ago
Today 0
This Week 1
This Month 1
Last Day 1
Last Week 0
Last Month 1
Dependencies (14)
Dev Dependencies (7)
Dependents (0)

Copyright 2014 - 2017 © |