4.3 - OBJ Data Format¶

Most modeling software stores its model data in proprietary file formats using binary data to minimize the size of the files. A cross platform data format is needed if data is to be shared between modeling programs. One such cross platform data format is the OBJ file format that was created by Wavefront. Blender can export and import OBJ data files. We will use the OBJ format for defining models for our WebGL programs because:

OBJ files are plain text, which allows the data to be read and parsed in JavaScript.
The plain text format removes any binary incompatibilities between the web server and various client browsers.

Exporting OBJ Data from Blender¶

As you create Blender models, always save them in the native Blender format which uses a .blend file extension. This guarantees that all attributes of your models can be retrieved if you open and edit the models at a later time.

When you are ready to use a model in a WebGL program, do the following:

Make sure that each model has a descriptive name that contains no spaces. For models, you need to name the geometry object, not the model object. (Use the Outliner Editor and expand the object to see the geometry.)
Select the File menu, Export command, and the Wavefront (.obj) sub-command.
Enter an appropriate file name. (Don’t include any spaces in your name and use all lower cases letters.)
In the lower left corner there is a set of options for the export. You may have to drag and expand the panel to see all of the options. Set the options as follows:
- Forward: “-Z Forward” (This rotates your model data by -90 degrees about X.)
- Up: “Y up” (This rotates your model data by -90 degrees about X.)
- Write Normals: OFF (To make the file as small as possible.)
- Include UV's: OFF (unless you defined a texture map, which we will cover later.)
- Write Materials: ON (to include color data.)
- Triangulate Faces: ON (because WebGL only renders triangles.)
- Objects as OBJ Objects: ON (so that objects will be named.)
An example of the export settings can be seen in the following image:
Select the “Export OBJ” button in the upper right corner.

Again, the example below shows you the default orientation of models in Blender.

Show the orientation of the sides of an object as viewed by Blender.

Animate
Open this webgl program in a new tab or window

Note: If you want your model to be exported exactly as it was design, with no change in orientation, then set Forward: to Y forward and set Up: to Z up.

Example OBJ Data File¶

The example below defines a simple cube. The first character or keyword on each line identifies the format and type of data on that line. The following gives the meaning of each “keyword” in the example.

# - comments, which are ignored
mtllib - the filename of a materials definition file
o - gives the name of a model. All data between this line and the next o line is a single model
v - defines the x, y, and z value of a single vertex
usemtl - use a specific color and material definition for the following polygons.
s - turn smooth shading off or on; flat shading is used when smooth shading is off.
f - defines the vertices that compose a face. Note that faces can have more than 3 vertices. In this example the faces have four vertices which define quad polygons. These must be divided into triangles before WebGL rendering.

# Blender v2.69 (sub 0) OBJ File: ''
# www.blender.org
mtllib model_cube01.mtl
o Cube
v  0.250000 -0.250000 -0.250000
v  0.250000 -0.250000  0.250000
v -0.250000 -0.250000  0.250000
v -0.250000 -0.250000 -0.250000
v  0.250000  0.250000 -0.250000
v  0.250000  0.250000  0.250000
v -0.250000  0.250000  0.250000
v -0.250000  0.250000 -0.250000
usemtl Red
s off
f 1 2 3 4
f 5 8 7 6
f 1 5 6 2
f 2 6 7 3
f 3 7 8 4
f 5 1 4 8

File Format Details¶

All of the details for an OBJ file are beyond the scope of these tutorials. If you are interested in more details, http://paulbourke.net/dataformats/obj/ is an excellent reference.

Glossary¶

OBJ file format: A cross-platform, text based file format for the exchange of geometry modeling data.
MTL file format: A cross-platform, text based file format for the exchange of color and material properties data.

Next Section - Tutorial Author