high level WebGL sprite rendering with Canvas2D-like API
MIT License
This module is just a prototype / experiment. It will most likely change completely. The underlying gl-sprite-batch and gl-sprite-text are more stable.
A high-level 2D WebGL rendering API similar to HTML5 Canvas2D context. This is built on gl-sprite-batch, which can be used alongside (or instead of) this for more performance-critical features.
It dynamically batches textured quads with a single shader. This makes it ideal for games using sprite sheets, text rendering, particle systems, etc. It uses 'source over' blending by default (SRC_ALPHA
, ONE_MINUS_SRC_ALPHA
), and colours are premultiplied by their alpha. It can also draw filled and stroked rectangles and line segments.
Example:
var gl = require('webgl-context')()
var clear = require('gl-clear')()
var Sprites = require('gl-sprites')
var renderer = Sprites(gl)
function render(width, height) {
clear(gl)
renderer.ortho(width, height)
renderer.begin()
renderer.color = [1, 0, 0, 1]
//assumes gl-texture2d
renderer.drawImage(tex, 25, 25)
//rectangles and lines
renderer.save()
renderer.translate(25, 25)
renderer.drawRect(0, 0, 15, 15)
renderer.strokeRect(50, 50, 25, 25)
renderer.restore()
//assumes gl-sprite-text is being passed
renderer.drawText(textSprite, 20, 100)
renderer.end()
}
sprites = createSprites(gl[, opt])
MIT, see LICENSE.md for details.