Published on 02/25/2013

Integrating 3D models in a Tao document

  • Integrating 3D models in a Tao document

This screencast demonstrates how easy it is to integrate and animate a 3D model directly inside a Tao Presentations document. Topics covered include: how to load the model, animate based on mouse movements, use animated images as background, add geometric shapes to a scene, use blending functions, and material shaders.

Viewing that in stereoscopic mode

A YouTube 3D video shows the result in stereoscopic mode. You can achieve the same result while running Tao Presentations simply by selecting the appropriate stereoscopic display mode from the View menu.

Source code

The complete source code for this example (with a few additional comments inserted) can be found below:

// Import the required modules: 3D object loader and basic materials
import ObjectLoader
import Materials


// Hide the mouse
enable_mouse_cursor false

// Default light
light 0
light_position 1000, 1000, 1000

// Draw the background before we do geometric transforms
draw_background

// Position the model in 3D space
translate 0, -80, 0
angle -> 0.0
angle := 0.1 * mouse_x
rotatex 15 - 5 * atan (0.01 * mouse_y)

// Draw the car with an additional rotation along the Y axis
locally
    rotatey angle
    draw_car

// Draw the car base
draw_base


// Drawing the car from 4 .obj files, materials, etc.
draw_car ->
    scale 50%, 50%, 50%

    // Draw the inner model and the wheels with their original textures
    object "models/audi-inner.obj"
    object "models/audi-wheels.obj"

    // Apply a cube map
    model_cube_map

    // Draw the glass with a darker tint
    color "#888"
    colored_object 0, 0, 0, 0, 0, 0, "models/audi-glass.obj"

    // Draw the car body with a material and a specific color
    iron
    color "green"
    colored_object 0, 0, 0, 0, 0, 0, "models/audi-body.obj"


// A cube map used to give a more realistic look to the model
model_cube_map ->
    cube_map 512,
        cube_map_face 0, "cmap/right.jpg"
        cube_map_face 1, "cmap/left.jpg"
        cube_map_face 2, "cmap/top.jpg"
        cube_map_face 3, "cmap/bottom.jpg"
        cube_map_face 4, "cmap/front.jpg"
        cube_map_face 5, "cmap/back.jpg"

    texture_transform
        rotatex 180
        rotatey 2.1 * angle


// Draw the background pictures with a blend function to make them "shine"
draw_background ->
    locally
        clear_color 0, 0, 0, 1
        color "white"
        translatez -4000
        blend_function "one", "one"
        locally
            rotatez 20 * time
            image 0, 0, 5, 5, "cclockwise.jpg"
        locally
            rotatez -10 * time
            image 0, 0, 5, 5, "clockwise.jpg"


// Draw the base on which the car is placed
draw_base ->
    locally
        // By default, cylinders are perpendicular to screen, so need to Z-rot
        translatey -70
        rotatex -90

        // Draw the metal part of the base
        locally
            model_cube_map
            color "cyan"
            iron
            cylinder 0, 0, 0, 450, 450, 150

        // Draw the transparent glass part of the base
        locally
            color "cyan", 0.5
            cylinder 0, 0, 0, 460, 460, 120

        // Draw the semi-transparent mechanism
        locally
            translatez 60
            rotatez 5.5 * angle
            image 0, 0, 3, 3, "base1.png"
        locally
            translatez 62
            rotatez 3.5 * angle
            image 0, 0, 3, 3, "base2.png"
        locally
            translatez 64
            rotatez -1.5 * angle
            image 0, 0, 3,3, "base3.png"
        locally
            translatez 66
            rotatez -2.7 * angle
            image 0, 0, 3, 3, "base4.png"

See also

If you liked this, you will also probably enjoy the beautiful car visualizer from +360°. What we just built is nowhere as complete, but then I hope it's also a little bit simpler :-)

Christophe de Dinechin

COMMENTS

No customer comments for the moment.

Add a comment

Shop

Newsletter