EAGL.Examples.LearnOpenGL.GettingStarted.TransformationsExercise2 (eagl v0.9.0)
View SourceLearnOpenGL 5.2 - Transformations Exercise 2
This exercise demonstrates rendering multiple objects with different transformation behaviors in the same scene. It showcases two containers: one that rotates around a translated position (orbiting effect), and another that scales rhythmically based on a sine wave, creating a pulsing effect.
Original C++ Source
This example is based on the original LearnOpenGL C++ tutorial exercises: https://github.com/JoeyDeVries/LearnOpenGL/tree/master/src/1.getting_started/5.2.transformations_exercise2
Exercise Focus
This exercise demonstrates:
- Multiple Object Rendering: Drawing the same geometry with different transformations
- Combined Transformations: Translation + rotation vs translation + scaling
- Time-based Animations: Using time for both rotation and scaling effects
- Transformation Order Effects: How TR and TS create orbiting/corner-scaling behavior
Framework Adaptation Notes
State Management
Uses map-based state following the 4.x texture examples pattern:
%{
program: program_id,
vao: vertex_array_id,
vbo: vertex_buffer_id,
ebo: element_buffer_id,
texture1_id: texture1_id,
texture2_id: texture2_id
}
Vertex Layout
Vertex attributes match EAGL's standard layout:
location = 0
: Position (vec3)location = 2
: Texture coordinates (vec2)
The shader uses aTexCoord
at location 2 to match EAGL.Buffer conventions.
Transformation Differences
Container 1 (Bottom-right, orbiting):
translate(0.5, -0.5, 0.0)
firstrotate(time, 0, 0, 1)
second- Creates an orbiting effect around the world origin (not its own center)
Container 2 (Top-left, corner-scaling):
translate(-0.5, 0.5, 0.0)
firstscale(sin(time), sin(time), sin(time))
second- Creates scaling from the world origin corner (not its own center)
Educational Notes
Matrix Order Matters
The order of transformations affects the final result:
- Container 1: T * R = First translate, then rotate around world origin = orbiting
- Container 2: T * S = First translate, then scale from world origin = corner scaling
- To rotate/scale around object center: use R T or S T instead
Animation Techniques
- Rotation: Continuous rotation using time directly
- Scaling: Sine wave creates rhythmic pulsing between 0 and 1
- Multiple Objects: Same VAO/geometry, different transformation matrices
Performance Considerations
- Single VAO/VBO setup used for both containers
- Matrix calculations per frame for animations
- Uniform updates for each object before drawing
Keybindings
- ENTER: Exit the example (when
enter_to_exit: true
) - ESC: Alternative exit method