oCanvas changes the way you work with the canvas element. With the native canvas API you are drawing pixels onto the canvas. But when building something, you tend to think more in terms of objects than actual pixels. This is what oCanvas is made to do — create a bridge between the native API and the way you want to work. If you would want to access the native API, that is also possible.

Get started

The first thing you need to do is read about the oCanvas object. Through that, you will be able to create your core instance which everything is based on. To make it possible to use oCanvas for several canvases on the same page without interference, the oCanvas object only contains a base that will be instantiated for each new canvas you want to work with. This instance is referred to as the core instance. It contains everything you need. For more information about that instance, see Core.

When you have the core instance, you are ready to start adding things to the canvas. In oCanvas all objects that are being drawn to the canvas are called display objects. So the next step would be to read up on display objects, and you will learn how to create different objects and how to style them. When you have that clear, you can start looking at the other pages listed to the right and start using the loop function and add events and start to actually build something.