3D WebGL scatter plots with custom point glyphs.
var createScene = require('gl-plot3d')
var createPoints = require('gl-scatter3d')
var scene = createScene()
var initialData = {
gl: scene.gl,
position: [ [1, 0, -1], [0, 1, -1], [0, 0, 1], [1,1,-1], [1,0,1], [0,1,1] ],
glyph: [ "▼", "★", "■", "◆", "✚", "✖" ],
color: [ [0,1,0], [0,0,1], [1,1,0], [1,0,1], [0,1,1], [0,0,0] ],
size: 12,
orthographic: true
}
for(var i=0; i<100; ++i) {
var theta = i / 100.0 * 2.0 * Math.PI
var x = Math.cos(theta)
var y = Math.sin(theta)
initialData.position.push([ x, y, 0 ])
initialData.glyph.push("●")
initialData.color.push([1, 0, 0])
}
var points = createPoints(initialData)
scene.add(points)
npm install gl-scatter3d
Constructs a scatter plot with the given parameters. options
is an object with the following properties:
-
gl
is a WebGL context -
position
(Required) an array of length 3 arrays encoding the position of the points in the scatter plot. -
color
A length 3 array encoding the color of the points in the scatter plot. To set colors per point, pass an array instead. Default is[0,0,0]
-
glyph
The glyph of each point. This is a UTF8 string representing some shape. Per point glyphs can be specified by passing an array. The default glyph is a circle,"●"
. For more glyph ideas, check out the unicode character set. Some other fun suggestions:"☢", "☯", "❤", "▲", "⚑"
. -
size
The size of each point, or specified per-point using an array. In orthographic, this is in screen coordinates, or in perspective this is in world coordinates. Default is0.1
-
orthographic
A flag, which if set totrue
causes the points to be drawn without perspective scaling. -
lineWidth
the width of the outline (set to 0 for no outline) Default is0
-
lineColor
the color of the outline for each marker -
font
the font used for drawing the glyphs (defaultnormal
) -
angle
an angle to rotate the glyphs by in radians (default0
) -
alignment
a 2d vector to offset text drawing by (default[0,0]
) -
project
a flag (or array of flags) which determines which axes to project onto -
projectOpacity
the opacity of the projected point sprites (default1.0
) -
projectScale
the scaling factor of the projected point sprites (default2.0/3.0
)
Returns A new scatter plot object
Updates the scatter plot object. The parameter options
has the same properties as the constructor.
The opacity of the point set (default 1)
A factor by which projections are rescaled
The opacity of the projected points
An array of projection values for each point
The width of the outline of each point
(c) 2014-2015 Mikola Lysenko. MIT License. Supported by plot.ly