Documentation

• Keybindings
  • Camera
  • Driver Animation
  • Renderer Change
  • TouchAnimation
• Model Loader

Keybindings

Camera

Direction	Key(s)
Forward	W
Backward	S
Left	A
Right	D
Up	E
Down	Q
Pitch Up	W + Shift
Pitch Down	S + Shift
Yaw Left	A + Shift
Yaw Right	D + Shift

Driver Animation

The Keys for this Animation can be specified in the constructor. Forward in the Table refers to the forward axis specified in the constructor, Right is the same. Currently the Arrowkeys are used.

Direction	Key(s)
Forward	ArrowUp
Backward(-Forward)	ArrowDown
Right	ArrowRight
Left(-Right)	ArrowLeft

Renderer Change

By pressing R the current Renderer is changed. The button Change Renderer does the same.

TouchAnimation

The TouchRotor-Animation listens for Touch or Dragevents and updates the rotation by the specified axis(currently only x or y).

Model Loader

With the Import Model Button Meshes defined in a custom JSON-format can be loaded and placed into the scene. Adding Animations to the loaded model is not yet supported.

The Format is specified as a vertices array of triples consisting of p,n and c and a indices array. p represents the Position of the vertex in 3D space, n its normal also in 3D space and c the colorvalue in 4D space.

The IVertexData interface describes the layout in code.

export interface IVertexData {
    vertices: {
        p: number[],
        n: number[],
        c: number[],
    }[];
    indices: number[];
}

The following json represents a red plane:

{
    "vertices": [
        {
            "p":[1,1,0],
            "n":[0,0,1],
            "c":[1,0,0,1]
        },
        {
            "p":[-1,1,0],
            "n":[0,0,1],
            "c":[1,0,0,1]
        },
        {
            "p":[1,-1,0],
            "n":[0,0,1],
            "c":[1,0,0,1]
        },
        {
            "p":[-1,-1,0],
            "n":[0,0,1],
            "c":[1,0,0,1]
        }
    ],
    "indices" : [
        0,1,2,2,3,1
    ]
}

A more sophisticated model of a star is available in the models folder or here.