Set up a new core instance.

Syntax create(settings)

Return Type Core


Set up a new core instance. This method is mandatory for each oCanvas project. Without this you don't get access to the core instance where everything happens. The argument settings is an object of different settings that will change how oCanvas works with the current instance. All properties except canvas have default values, and can thus be ignored.


settings : Object
Object of settings that controls how oCanvas works. Its properties are as follows:
canvas : String or HTMLCanvasElement
Specifies the canvas element that oCanvas will work with. Either a CSS selector string, or an HTMLCanvasElement.
Required. No default.
background : String
Sets the background of the canvas to this value. It has to be a string, but accepts all CSS color values, gradients and images (special syntax, see the fill property of display objects).
Default: "transparent"
clearEachFrame : Boolean
Specifies if the timeline module will clear the canvas before each frame or not.
Default: true
drawEachFrame : Boolean
Specifies if the timeline module will draw the canvas after each frame or not.
Default: true
fps : Number
The number of frames per second the timeline and animate modules will run at.
Default: 30
plugins : Array
Sets which plugins should be used on this core instance. The array contains the plugin names.
Default: []
disableScrolling : Boolean
Disables scrolling on touch devices. It only disables it on the canvas element, the rest of the page is scrollable.
Default: false

Return Value

Core. Returns the newly created core instance.


Example 1

We create a core instance by passing in an object as the only argument to create(). We specify two properties in this object, canvas and a background. The variable canvas will now contain the core instance with access to everything you can do with oCanvas. In the background oCanvas instantiated and initialized everything and set the background to what we specified.

View Example
var canvas = oCanvas.create({
	canvas: "#canvas",
	background: "#0cc"