README
draw-billboard
Draws a 2D billboarded sprite in WebGL. Useful for debugging and small special effects.
Example
var shell = require("gl-now")()
var camera = require("game-shell-orbit-camera")(shell)
var renderText = require("gl-render-text")
var drawBillboard = require("draw-billboard")
var mat4 = require("gl-matrix").mat4
var texture
var positions = new Array(100)
shell.on("gl-init", function() {
var gl = shell.gl
texture = renderText(gl, "Billboard")
for(var i=0; i<100; ++i) {
positions[i] = [ 100 * (0.5 - Math.random()),
100 * (0.5 - Math.random()),
100 * (0.5 - Math.random()) ]
}
})
shell.on("gl-render", function() {
var proj = mat4.perspective(mat4.create(), Math.PI/4.0, shell.width/shell.height, 0.1, 1000.0)
var view = camera.view()
for(var i=0; i<100; ++i) {
drawBillboard(shell.gl, positions[i], { texture: texture, projection: proj, view: view })
}
})
Install
npm install draw-billboard
API
require("draw-billboard")(gl, position[, options])
Draws a billboard at the given position.
gl
is a WebGL contextpositions
is the position of the billboarded spriteoptions
is an object containing the following properties:texture
A WebGL texture objectlo
Lower texture coordinatehi
Upper texture coordiantewidth
Width of billboard to drawheight
Height of billboard to drawmodel
Model matrix for billboardview
View matrix for billboardprojection
Projection matrix for billboard
Credits
(c) 2013 Mikola Lysenko. MIT License