gl-line-plot
A 3D line plot for WebGL
Example
var shell = clearColor: 0000 var camera = shellvar createSelect = var createAxes = var createSpikes = var createLines = var mat4 = mat4 //State variablesvar axes lines select spikes var pickPoint = null //Set up cameracamera shell { selectshape = shellheight shellwidth select lines var selected = select pickPoint = lines} shell
Install
npm install gl-line-plot
API
var createLinePlot =
Constructor
var plot = createLinePlot(gl, options)
Methods
Basic Drawing
plot.draw(camera)
Draws the line plot with the given camera parameters
camera
is an object with the model, view and projection matrices of the plot as properties.
plot.update(options)
Updates the plot. This takes the following parameters:
options.position
An array of position values for the points on the curveoptions.color
An array of color values (or a singular color) for the curveoptions.pickId
The selection ID for the line plotoptions.lineWidth
The width of the lineoptions.dashes
An array of dash patterns representing the dash pattern. For example,[0.5,0.5,0.5]
options.dashScale
The number of times to repeat the dash pattern
plot.dispose()
Destroys the plot and releases all associated resources
Picking
plot.drawPick(camera)
Draws the line plot for picking purposes from the given camera
plot.pick(selection)
Returns selection information from the given user selection data.
selection
is the output fromgl-select
Returns An object with the following properties:
arcLength
the arc length parameter of the selectionposition
the position of the vertex at the selected pointindex
the index of the closest data point
Properties
plot.bounds
Gives the bounds on the line plot in data coordinates.
plot.clipBounds
Sets a clipping bound on the line plot
Credits
(c) 2014 Mikola Lysenko. MIT License