The Fatum context

Visualization using Fatum is centered around a context. This context is responsible for handling everything related to your visualization. It is the main entry point for the user.

Creating a context

The easy way

Fatum provides a utility function to help you setup a context. Fatum.createFatumContext(canvas) will create and setup a context on the canvas you provide.

Other handlers

Furthermore, Fatum provides other utility function for your context :

The hard way

If you need specific options for the context creation, you may wish to setup the context yourself.

A Fatum context can be created using its js constructor Fatum.Fatum(). This will create a visualization context that you will be able to use. However, the context is not yet ready to display anything.

Here it is in code :

var canvas = /* get your canvas */;
Fatum.createContext(canvas, true, true, {/* webgl context options */});
var fatum = new Fatum.Fatum();
fatum.initGL();
var camera = fatum.camera();
camera.setViewport([0,0,canvas.width,canvas.height]);

Managing visual elements

The Fatum context allow you to add Marks and Connections to the visualization.

To add a Mark, call addMark().

To add a Connection, call addConnection(m1,m2). This will connect the two given Marks.

Once you have added some elements, you can acces them in two ways :

When creating a Mark, its properties are populated with default values. These values can be changed using the defaultMark() method. This method returns a placeholder mark that stores default values. Its proeprties can be modified just like a Mark.

For more information about the Marks and Connections, see the corresponding sections.

Rendering

Fatum cannot know when to render by itself. You need to call the rendering function in order to refresh the visualization. Two methods are available to refresh the visualization :

Most of the time, a single rendering is enough. However, when an animation is launched, Fatum cannot keep rendering each step until the animation finishes. But the context will tell you when it should be refreshed. Two mechanisms exist for this purpose :

The entities rendered are controled by a layer system. The different layers are :

In order for a certain type of objects to be rendered, you need to activate its layer using layerOn(layer). The flags are defined in Fatum. It is possible to deactivate a layer with layerOff(layer) and to toggle the layer's visibility with layerToggle(layer).

Controling the double buffering

The fatum context holds the buffer used for double buffering. There two ways to control them :

Camera

It is possible to access the Camera using the camera()method.

A convienence method center()is also provided to quickly center the visualization on visible objects.

For more information about the camera, see the corresponding section.