Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    draw-billboardpublic

    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 })
      }
    })

    Try it in your browser.

    Install

    npm install draw-billboard
    

    API

    require("draw-billboard")(gl, position[, options])

    Draws a billboard at the given position.

    • gl is a WebGL context
    • positions is the position of the billboarded sprite
    • options is an object containing the following properties:
      • texture A WebGL texture object
      • lo Lower texture coordinate
      • hi Upper texture coordiante
      • width Width of billboard to draw
      • height Height of billboard to draw
      • model Model matrix for billboard
      • view View matrix for billboard
      • projection Projection matrix for billboard

    Credits

    (c) 2013 Mikola Lysenko. MIT License

    Keywords

    none

    install

    npm i draw-billboard

    Downloadslast 7 days

    5

    version

    0.0.2

    license

    none

    repository

    github.com

    last publish

    collaborators

    • avatar