Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
src
 
 
 
 
 
 
 
 
 
 

README.md

load-wavefront-obj npm version Build Status

STILL VERY MUCH A WORK IN PROGRESS

Loads the graphics buffer data from a .obj file that's been parsed using a .obj parser and return a draw command that accepts options

View demo

To Install

$ npm install --save load-wavefront-obj

Tutorials

Running the demo locally

// TODO

Usage

var loadWFObj = require('load-wavefront-obj')

// You would usually parse your .obj files before runtime and then `xhr` GET request the pre-parsed JSON
var parseWFObj = require('wavefront-obj-parser')
var modelJSON = parseWFObj(GetWavefrontFileSomehow())

var gl = GetCanvasWebGLContextSomehow()

// This can be a DOM image element or a Uint8Array of pixel data
var image = document.getElementById('some-already-loaded-image')

var model = loadWFObj(gl, modelJSON, {texureImage: image})

// Later inside of your render function
model.draw({
  attributes: model.attributes,
  uniforms: {
    // Specify your uniforms
    uAmbientColor: [1.0, 1.0, 1.0],
    // ...
  }
})

See something broken, confusing or ripe for improvement? Feel free to open an issue or PR!

API

var model = loadWFObj(parsedWFJSON, options) -> object

parsedWFJSON

Required

Type: string

A wavefront .obj file that has been parsed into JSON.

Usually you'd use wavefront-obj-parser to parser the .obj file pre-runtime. But any parser that outputs the same format will do.

Options

textureImage

type HTMLImageElement or Uint8Array

You pass in an HTMLImageElement or Uint8Array for your model's texture

If using an image element, make sure that the onload event has already fired

// example of loading the image
var image = document.getElementById('my-image') || new window.Image()
image.src = 'https://cool-image-texture.com/cool-image.jpg'
image.onload = function () {
  loadWFObj(gl, modelJSON, {textureImage: image})
}

model

// lorem ipsum

TODO:

  • Finish the first iteration of the draw function
  • Demo in raw WebGL
  • Demo using regl
  • Write Documentation
  • Add tests using require('gl') and test against expected .png file fixtures. example

To Test:

The test suite requires imagemagick to be installed locally

$ npm run test

See Also

License

MIT

About

Load the graphics buffer data from a wavefront .obj model and return a draw command that accepts options

Resources

Packages

No packages published
You can’t perform that action at this time.