Upload
zekixx
View
224
Download
14
Tags:
Embed Size (px)
DESCRIPTION
Beginner level openscenegraph tutorial part two.
Citation preview
SMM011 1
OpenSceneGraph – Tutorial 2Realism and Animation
Mikael DruggeVirtual Environments II
Spring 2006
Based on material from http://www.openscenegraph.org/
SMM011 2
Agenda
• Realism• Loading models• MilkShape• Lightsources• StateSets• Materials• Textures
SMM011 3
Introduction
SMM011 4
What makes the difference...?
SMM011 5
What causes the difference...?
• Lightsources– Can change e.g. the ”mood” of a scene via the lighting
• Materials– Diffuse colour, the ”base colour”– Specularity/hardness, making plastics, metals, etc...– Reflections, (not in the GL pipeline, but in e.g. raytracing)– Emission, making objects glow or shine as if by light
• Textures– Image mapping– Bump mapping
SMM011 6
Creating models
• Modeling via code– Easy for simple models– But, requires a fair
bit of imagination– For example:
Sphere(0,-0.2,0,2);Sphere(1.3,1.4,0,1);Sphere(-1.3,1.4,0,1);Sphere(0,0,1.9,0.3);
What’s this?
SMM011 7
Creating models with modeling programs
• A number of 3D modeling tools exist...– 3D Studio, for graphics and raytracing– AutoCAD, for CAD applications– Maya, for graphics and animation– Imagine, an old Amiga raytracer– Wingz, modeler for POVray– MilkShape, a modeling program
SMM011 8
MilkShape
SMM011 9
Introduction to MilkShape 3D
• A basic low-polygon modeler• Originally designed for a game (Half-Life)• Supports basic operations
– Select, move, rotate, scale, extrude, etc– Low-level editing of vertices and faces– Primitives (spheres, boxes, cylinders…)
• Skeletal animation capabilities• Supports 37 file formats from 27 games/engines
SMM011 10
Introduction to MilkShape 3D
• Why have we chosen to use MilkShape?– It is fairly intuitive to use and learn– It’s powerful enough for this course– Handles a lot of different formats– Allows for 30-day free trial
SMM011 11
Example screenshot of MilkShape
SMM011 12
The coordinate system in MilkShape
X
Y Y
Z
Z
X
SMM011 13
Demo of MilkShape!
• Learning by doing, so let’s create something...
SMM011 14
Demo of MilkShape!
• Let’s see the result in OSG...
LoadingObjects
SMM011 15
Exporting
• Autodesk 3DS• LightWave 6.5x LWO
– Flattens all edges• Wavefront OBJ
– Materials in an extra MTL file
• 3DS or LWO recommended
SMM011 16
Loading models into OSG
SMM011 17
Remember this? Plugins...OSG
ScenegraphRendering elements
Tree/DAG nodes OSGDBDatabase loading
Plug-In management
OSGTextHandles text,
fonts, ...
Plug-Ins
OSGUtilTraversers
Enhancements
OSGSimSimulation (skybox,lights, time-of-day)
OSGParticleSpecial effects(fire, smoke...)
JPGPNGGIF...
3DSOSGLWO
...
import openscenegraph.osgDB.osgDBNamespace;
SMM011 18
Loading objects – code example
import openscenegraph.osgDB.osgDBNamespace;
Node node = osgDBNamespace.readNodeFile(“somefile.lwo”);
scene.addChild(node);
This will load themodel into a Node
Then just handle itlike any other node
SMM011 19
What to think about for external models
• Retrieving the dimensions for the model– Getting the BoundingSphere via node.getBound()
• getRadius()– E.g. for ”normalizing” the size of an unknown object
SMM011 20
Lightsources
SMM011 21
Lights and Lightsources
• LightSource– Extends the Group node
• addChild() still possible– Contains one Light
• setLight()• getLight() LightSource
Light
SMM011 22
The Light
• Encapsulates OpenGL glLight() functionality– setLightNum(), sets which GL light to operate on
• setAmbient(), ambient colour of the light• setDiffuse(), diffuse colour component• setSpecular(), specular component• Example – fire in a fireplace
– setDiffuse(orange), for the primary illumination– setAmbient(darkred), for simulating the ambient light
SMM011 23
The Light
• Light can be point source or spotlight– setPosition(), positions the light– setDirection(), aims the spotlight in the given direction
• Many functions to tweak the lighting– setConstantAttenuation(), also Linear and Quadratic
• Light intensity diminishes over a distance
SMM011 24
The Light
• More spotlight functions– setSpotCutoff(distance)– setSpotExponent(exp)– (Not much documentation about
these two functions – experiment!)
SMM011 25
The Light – shadows?
• No shadows– Shadows are expensive to compute– Possible to achieve in e.g. raytracing– OSG does not support real time shadows
• Some engines do, however,e.g. AgentFX by Agency9
SMM011 26
Example
Lighting
SMM011 27
Lightsources – example code
Light light1 = new Light();light1.setLightNum(0);
light1.setDiffuse(new Vec4fReference(1f,0f,1f, 1f));
light1.setPosition(new Vec4fReference(x, y, z, 1f));
Create a lightfor GL light #0
Purple light
Note this!
SMM011 28
Lightsources – example code
// create lightsource and set its lightLightSource ls = new LightSource();ls.setLight(light1);
// turn on the lightsourcels.setLocalStateSetModes(STATEATTRIBUTEValues.ON_Val);
SMM011 29
Lightsources – example code
// create a “stateset” for the root node StateSet stateset = new StateSet();root.setStateSet(stateset);
// turn the lightsource on for this statesetls.setStateSetModes(stateset, STATEATTRIBUTEValues.ON_Val);
(We’ll come back to StateSetsin a few slides, so don’t worry)
SMM011 30
Lightsources – example code
// then add the lightsource to the sceneroot.addChild(ls);
• Repeat the process if you need more lightsources– You should reuse the same StateSet however
• Keep in mind you can alter light properties during run-time– Colour, position, direction, etc...– Turn lights on and off, etc...
SMM011 31
Summary – how to add a lightsource
1. Create a new LightSource2. Create a new Light and associate with a GL light3. Adjust the light parameters; colours, attenuation...4. Make the lightsource use your light (via setLight())5. Create a stateset for the part of the scenegraph
tree that should be illuminated by the lightsource6. Turn on the lightsource in the stateset7. Add the lightsource to the scene
SMM011 32
Some things to think about
• setDiffuse() may be all you need, BUT• For materials where specularity, etc. are defined, the
lightsource needs to emit light that affects these too– If not, the material properties will seem to have no effect
• I.e. make sure you set the colour for all components– setDiffuse(somecolour);– setSpecular(somecolour);– etc...
SMM011 33
StateSets
SMM011 34
What is a StateSet?
• It encapsulates OpenGL state modes and attributes– Used for textures, lightsources, materials, transparency...
• E.g. specifies textures for Drawables– Drawables can share a single StateSet
• Sharing statesets is recommended! Why?– It minimizes state changes in the GL pipeline– Changing the state in the pipeline is expensive!– Thus, sharing the same StateSet is a good thing
SMM011 35
StateSets – example code revisited
// create a “stateset” for the root node StateSet stateset = new StateSet();root.setStateSet(stateset);
I.e. create a stateset that will applyfrom the root node and downwards.
(The entire scene will use thisstateset, meaning all of it will beilluminated by the lightsource inthe example a few slides ago.)
SMM011 36
Materials
SMM011 37
Introduction to Materials
• Not all objects are made of the same thing– Metals, glass, plastics, wood, paper, skin, crystal...
• Different properties, depending on– How rough/smooth the surface of the object is– How the light refracts when hitting an object– The colour of the object and the light
SMM011 38
Materials in OSG
• The ”Material” class– Encapsulates OpenGL’s glMaterial state
• Usage– Create a new Material and set its properties– Apply the material to a StateSet via
•stateset.setAttribute(material);
– Apply the StateSet to e.g. a Geode•geode.setStateSet(stateset);
SMM011 39
The Material class – some functions
• setDiffuse(MATERIALFace, Vec4fReference)• setSpecular(...)• setAmbient(...)• setEmission(...)• setShininess(...)• setAlpha/setTransparency(...)
Vec4f(R, G, B, Alpha)
Front and/orBack faces
SMM011 40
Materials – some examples and hints
• setDiffuse– The ”base colour” of an object
• setSpecular & setShininess– Plastics often have a white specularity, and are ”hard”,
i.e. they have a small area where this specularity occurs– Common mistake when making metals: making them too
”hard” and white – it’s better with a softer setting and a specularity in the same nuance as the diffuse colour
SMM011 41
Materials – some examples and hints
• setAmbient– Simulates the ”background noise” of all lightsources– Instead of black ”shadows”, use the ambient colour
• setEmission– Can make an object look like it radiates light
• Instead of using a real lightsource – they’re expensive– E.g. to create a torch, make the flame emissive and place
a lightsource within it, also use an ambient component
SMM011 42
Materials – some examples and hints
• setAlpha/setTransparency– Sets the Alpha value of ambient, diffuse, specular and
emission colours– setAlpha(value) = setTransparency(1 – value)– Useful for making e.g. windows, water, holograms, etc...
SMM011 43
Example – creating an orange plastic ball
shape = new ShapeDrawable(new Sphere(new Vec3fReference(0f, 0f, 0f), 1f));
geode = new Geode();stateset = new StateSet();material = new Material();
material.setDiffuse(MATERIALFace.FRONT_AND_BACK,new Vec4fReference(1.0f, 0.5f, 0.1f, 1f));
material.setSpecular(MATERIALFace.FRONT_AND_BACK,new Vec4fReference(1.0f, 1.0f, 1.0f, 1f));
material.setShininess(MATERIALFace.FRONT_AND_BACK, 63f);
•Orange colour•White specularity•Make it a bit harder
SMM011 44
Example – creating an orange plastic ball
stateset.setAttribute(material);geode.setStateSet(stateset);geode.addDrawable(shape);...
Associate materialwith the stateset
Apply the statesetto the geode withthe sphere object
SMM011 45
Example – a window
// you know this...shape = new ShapeDrawable(
new Box(new Vec3fReference(-1f, -1f, 0f), 1f, 0.2f, 2f));geode = new Geode();stateset = new StateSet();material = new Material();
// set the diffuse colour component to a lightblue nuancematerial.setDiffuse(MATERIALFace.FRONT_AND_BACK, new
Vec4fReference(0.4f, 0.8f, 1f, 1f));
SMM011 46
Example – a window
stateset.setMode(GL.GL_BLEND, STATEATTRIBUTEValues.ON_Val);
stateset.setRenderingHint(STATESETRenderingHint.TRANSPARENT_BIN_Val);
material.setTransparency(MATERIALFace.FRONT_AND_BACK,0.6f); The higher the number
the more transparency
You need to enableblending to gettransparency
Set a rendering hintto use transparent bin
SMM011 47
Example – a window
// set properties (you know this already… ☺)stateset.setAttribute(material);geode.setStateSet(stateset);geode.addDrawable(shape);root.addChild(geode);
• Transparency is easy (from an API perspective),just remember to enable the GL_BLEND mode
SMM011 48
Example – demo of Looks.java
Looks
SMM011 49
Textures
SMM011 50
Introduction to Textures
• Why do we need textures?– Difficult and expensive to model everything with polygons– E.g. wooden surfaces, wallpapers, labels, faces, etc...– Bumpmapping to simulate e.g. the texture of an orange– Image maps are often cheaper in terms of computation
SMM011 51
Textures in OSG
• The ”Texture” class– Encapsulates OpenGL’s texture functionality– Texture1D/2D/3D – subclasses for 1D/2D/3D
X
YExample Texture2D
SMM011 52
Texture coordinates
• ShapeDrawables have texture coordinates defined– I.e. create the shape and just apply the texture to it
• For a primitive GL rectangle, it’s also very simple– An example follows...
SMM011 53
Texture coordinates
// a rectangle
Vec2Array texcoords = new Vec2Array();texcoords.push_back(new Vec2f(0.00f, 0.00f));texcoords.push_back(new Vec2f(1.00f, 0.00f));texcoords.push_back(new Vec2f(1.00f, 1.00f));texcoords.push_back(new Vec2f(0.00f, 1.00f));bbGeometry.setTexCoordArray(0, texcoords);
0 1
3 2
SMM011 54
Questions?
Break...
SMM011 55
Agenda
• Callbacks• Animation• Kinematics• Morphing
SMM011 56
Callbacks
SMM011 57
Introduction to Callbacks
• A ”callback” is a function associated with an event– When the event occurs, the callback is invoked– Developer registers callbacks, which are then
automatically invoked by the system as needed• Callbacks exist outside of graphical programming
– Typically used in client-server systems
SMM011 58
Callbacks in OSG
• Callbacks are user-defined functions executed upontree traversal (e.g. when updating, drawing or culling)– Can associate a callback with a certain node– Upon traversal, every node with a callback gets it executed
SMM011 59
Callbacks in OSG
• Remember this code from the event loop?viewer.sync();viewer.update();viewer.frame();
• Invokes any update callbacks for nodes in the tree– Suitable place for animating an object
SMM011 60
Callbacks in OSG
• Why not do it like this?viewer.sync();viewer.update();... put animation code in here ...viewer.frame();
• The effect will be the same, but callbacks provide a better interface (simpler, cleaner, less cluttered, easier to maintain)
• Callbacks may increase performance on multithreaded systems– Callbacks’ code can execute in parallel
SMM011 61
Callbacks in OSG
• In the ”Node” class– setCullCallback(...)– setEventCallback(...)– setUpdateCallback(…)
• NodeCallback, the base class for callbacks– The callback function is named
• operatorMethod(Node, NodeVisitor)– Override this function with your own code
SMM011 62
Callbacks in OSG
• A callback can access user data via– node.setUserData()– node.getUserData()
• The user data can be used to store node-specific information, such as the rotation of a gun turret
• User data should extend the Referenced class– (Reference counted class for garbage collection)
SMM011 63
Example – adding a callback to a node
public class MyNodeCallback extends NodeCallback {public void operatorMethod(Node node, NodeVisitor nv) {
...}
}
...node.setUpdateCallback(new MyNodeCallback());
Put your callbackcode in this function
Applies the callbackto the specified node
SMM011 64
Animation
SMM011 65
What is animation?
• “A motion picture made by photographingsuccessive positions of inanimate objects(as puppets or mechanical parts)”...from the Merriam-Webster dictionary.
• I.e. changing an object’s position over time
SMM011 66
Cartoon vs. Computer Animation
• Cartoon/computer animation has common features– Both work on a frame per frame basis– Each frame holds a snapshot of the scene– In the next frame, the scene has changed slightly– The result?
• The viewer gets the impression of movement
SMM011 67
Cartoon vs. Computer Animation
• Framerate, number of frames per second (fps)– E.g. 60 fps in computer games, smooth scrolling/updates– Film projection, 24 fps, enough to trick the viewer
• Quality of animations– Some cartoons look really good, some others don’t– Why?
• Manual animation by hand drawing is expensive!• 24 fps, 90 minute movie, results in 129600 frames• One way to make it cheaper is to reduce the number of frames
via the framerate– Some low budget TV cartoons use e.g. 12 or 6 fps– Or, use a computer to do most of the work ☺
SMM011 68
Keyframe Animation
• Keyframe– A frame where objects are
• Positioned• Oriented• Scaled
– ...in a predefined way– Based on time (normally)
00:00:00
00:00:30
SMM011 69
Keyframe Animation
• Interpolating in between keyframes– You don’t want to specify every single frame
• (Like we did earlier)– Easier to set-up keyframes– Let the computer interpolate
• Comparison with cartoon animations– Some hand animators also work like this
• Artists draw the important keyframes• Animators draws the frames in between
– a.k.a. ”inbetweening”
SMM011 70
The AnimationPath in OSG
• Defines a path by which an object should move– Control points at specific times (seconds, real-world clock)
• Position• Rotation• Scaling
– Interpolates the frames in between the keyframes• Can also retrieve points at an arbitrary time, if needed
SMM011 71
The AnimationPath in OSG
• Applied via e.g. an AnimationPathCallback– transform.setUpdateCallback()– Called at the event-loop’s viewer.update()
• Can also be used to record the Viewer’s motion
SMM011 72
Animation Path – an exampletime, (xt, yt, zt)
10s, (10,20,30)
30s, (-5,10,32)
SMM011 73
Animation Path – attitudes
time, (xt, yt, zt), attitude
Note that rotationsare interpolated inbetween keyframes!What does this mean?
SMM011 74
Animation Path
• Loop/repeat mode– Looping
• Repeat forever– No loop
• Just play once– Swinging
• Play once, thenplay backwards,then repeat
SMM011 75
Example – moving in a square
AnimationPath ap = new AnimationPath();
// add positions for given timesap.insert(0.0, new ANIMATIONPATHControlPoint(
new Vec3dReference(40,40,0)));ap.insert(2.0, new ANIMATIONPATHControlPoint(
new Vec3dReference(-40,40,0)));ap.insert(4.0, new ANIMATIONPATHControlPoint(
new Vec3dReference(-40,-40,0)));ap.insert(6.0, new ANIMATIONPATHControlPoint(
new Vec3dReference(40,-40,0)));ap.insert(8.0, new ANIMATIONPATHControlPoint(
new Vec3dReference(40,40,0)));
ap.setLoopMode(ANIMATIONPATHLoopMode.LOOP);
For loops,make surestart/end isidentical
SMM011 76
Example – penguin moving in a square
PositionAttitudeTransform xform =new PositionAttitudeTransform();
xform.setUpdateCallback(new AnimationPathCallback(ap));
Node node = osgDBNamespace.readNodeFile("penguin.obj");
xform.addChild(node);root.addChild(xform);
We can onlyapply this toa transform!
SMM011 77
Example – demonstration
• AnimDemo.java– Moves in a square
AnimDemo
SMM011 78
Example – moving and rotating
Quat q = new Quat();
q.setAxis(Vec3d.ZAxis);q.setAngle(Math.PI/2);
ap.insert(15,new ANIMATIONPATHControlPoint(
new Vec3dReference(10,20,30), q));
(Keep in mind rotations areinterpolated in between...)
SMM011 79
Example – demonstration
• AnimDemo2.java– Moves and rotates
AnimDemo2
SMM011 80
AnimationPath – time-related functions
• getInterpolatedControlPoint(time)– Return an interpolated point for an arbitrary time
• getFirstTime(), getLastTime(), getPeriod()• getMatrix(time)
– Return the transformation matrix for an arbitrary time
SMM011 81
Summary of creating Animations with A.P.
• Animations are easy to implement in OSG1. Create an AnimationPath2. Add control points (keyframes) for specified times
• Positions, attitudes, scaling3. Apply an update callback for the path
– Apply on a transform node– Add geodes etc. to the transform
SMM011 82
Other ways of animating objects
• Add code in event handlers that manipulate transform nodes– If the user can directly manipulate an object, the
animation occurs as feedback to the user’s actions• Add your own update callback
– Extend e.g. the NodeCallback or AnimationPathCallback• Implement/override the operatorMethod()• Compute the interpolated positions and rotations
– More work in terms of code, but also more flexibility
SMM011 83
Things to keep in mind when animating
• Review the following event loop in pseudo-codeloop {
animate();draw();
}• What problems can this cause?• Hint – think about the performance of different computers...
loop {sync_time();animate();draw();
}
You need to keep trackof real clock time, and doanimation based on time,not on CPU performance!
SMM011 84
Animating the viewer
SMM011 85
Animating the Viewer
• The Viewer itself has no update callback• You can put your code in between update()/frame()
viewer.sync();viewer.update();... viewer animation goes here ...viewer.frame();
• And/or, use a MatrixManipulator...
SMM011 86
Matrix manipulators
• The ”MatrixManipulator” class– Abstract base class extending the standard GUIEventHandler– Defines interface for controlling cameras in response to GUI events– Subclasses (test with ”1”, ”2”, ”3” in standard Viewer)
• TrackballManipulator– The standard viewer mode
• DriveManipulator– Left button accelerates, right breaks
• FlightManipulator– Works like a flight simulator
SMM011 87
Matrix manipulators, more subclasses
• AnimationPathManipulator– Follow an animation path
• KeySwitchMatrixManipulator– Allows for easily changing among multiple manipulators– E.g. make a certain key ”k” switch to another manipulator
• NodeTrackerManipulator– Make viewer track a node with/without rotations
• TerrainManipulator– Make viewer follow the terrain (for rolling hills, etc)
SMM011 88
Matrix manipulators, how to apply
• viewer.addCameraManipulator(...);
• Exampleviewer.setUpViewer(
ESCAPE_SETS_DONE_Val |HEAD_LIGHT_SOURCE_Val);
viewer.addCameraManipulator(new FlightManipulator());
MatrixManipDemo
We only want ourown manipulator,not any other
SMM011 89
Kinematics – a brief introduction
SMM011 90
Kinematics
• Involves describingthe position of partsbased on joint angles
p = f(θ)• Parts position (p) is a
function of the angles (θ)• E.g. a robotic arm
– 3 angles we can specify,3 degrees of freedom
SMM011 91
Inverse kinematics
• In kinematics we studyp = f(θ)
• while in ”inverse kinematics”, we studyθ = g(p)
• I.e. based on a desired position of the object in the scene, what are the angles (θ) to achieve it?
• E.g. a robotic arm– How to make the hand catch an object– What angles should the joints be at
• May be none, one, or a set of solutions!
SMM011 92
Summary of kinematics
• It’s good to know the appropriate terms– Kinematics, p = f(θ), compute part position based on angles– Inverse kinematics, θ = g(p), get angles for desired position
• You may run into problems like these– How to make an arm reach for a certain object?– What constraints do you need?
• These also become part of the equations• E.g. an elbow, cannot bend it too far
– Scenegraphs generally help you with the basic kinematics
SMM011 93
Morphing
SMM011 94
What is Morphing?
• Extend the idea of animation to include vertices• Change the shape of an object
– Define certain shapes for different keyframes– Interpolate in between the keyframes– Produces a gradual shift of an object’s shape
• Some examples– Changing the face of a human into something else– Turning a floor into the shape of a human being
SMM011 95
Morphing – a trivial example in 2D
SMM011 96
Morphing – a non-trivial example in 2D
• Number of vertices differ for the shapes– Which vertex in A corresponds to which vertex in B?– How to add/eliminate vertices during interpolation?
(A) (B)
SMM011 97
Morphing, one more example
• When the number of vertices are equal between two keyframes, morphing is a bit simpler to implement– But may still be non-trivial Consider the following example
0 1
2
34
2 3
4
01
SMM011 98
Morphing, which interpolation is correct?
0 1
2
34
2 3
4
01
SMM011 99
Morphing, which interpolation is correct?
• Both can be correct, depending on what you want• It’s not just coding, you need to become good
animators also!– The animator needs to decide how morphing should be
handled, what effects are desired, etc.
Linear morphing basedon vertex identities
Morphing using theclosest vertices
SMM011 100
Pseudo-code for linear morphing
• For each vertex, interpolation is computed according toX = Xstart + frame * (Xend-Xstart)/numframes;Y = Ystart + frame * (Yend-Ystart)/numframes;Z = Zstart + frame * (Zend-Zstart)/numframes;
• Normals recalculated per face or per vertex– Flat shading requires only face normals – easy to compute– Some shading methods may require recalculated vertex normals
• This may be very slow
SMM011 101
Pseudo-code for linear morphing
X = Xstart;Xdelta = (Xend-Xstart)/numframes;
for (frame=0; frame<numframes; frame++) {draw object;
for (all vertices in object) {X += Xdelta;
}
for (all normals in object) {recalculate normal;
}}
SMM011 102
Example in OSG – not this time!
• Morphing is left as an exercise for the reader ☺– OSG does not provide specific morphing functionality– So, you need to implement it from scratch, more or less
• Some hints and ideas– Linear morphing is probably the easiest to start with
• Interpolate the vertex positions between keyframes• You may need to interpolate the normals as well
SMM011 103
Summary
SMM011 104
Summary
• Introduction– We often want our virtual world to look like the real world
• Modeling objects– Introduction to MilkShape and 3D modeling programs– Loading the creations as nodes into OSG
• Lightsources– How to illuminate a scene and alter its properties
• Materials– Basic GL parameters for changing the look of objects
• Textures– An introduction on how to use textures within OSG
SMM011 105
Summary
• Callbacks– Definition of callbacks, how to implement them in OSG
• Animation– Basics of animation, frames and keyframes– Computer and hand-drawn animation, similarities and differences– Animating objects with OSG functions or manually
• Kinematics– A brief introduction to the area– Applicable in e.g. robotics
• Morphing– Idea behind morphing, some examples on when to use it– What to think about, pseudo-code for linear morphing
SMM011 106
Questions?