Skip navigation

Core

Functions for initializing the Kontra library and getting the canvas and context objects.

let { getCanvas, getContext, init } = kontra;

let { canvas, context } = init();

// or can get canvas and context through functions
canvas = getCanvas();
context = getContext();

import { getCanvas, getContext, init } from 'path/to/kontra.mjs';

let { canvas, context } = init();

// or can get canvas and context through functions
canvas = getCanvas();
context = getContext();

import { getCanvas, getContext, init } from 'kontra';

let { canvas, context } = init();

// or can get canvas and context through functions
canvas = getCanvas();
context = getContext();

Table of Contents

getCanvas(​)

Return the canvas element.

Return value

HTMLCanvasElement. The canvas element for the game.

getContext(​)

Return the context object.

Return value

CanvasRenderingContext2D. The context object the game draws to.

init(​[canvas][, options])

Initialize the library and set up the canvas. Typically you will call init() as the first thing and give it the canvas to use. This will allow all Kontra objects to reference the canvas when created.

let { init } = kontra;

let { canvas, context } = init('game');

import { init } from 'path/to/kontra.mjs';

let { canvas, context } = init('game');

import { init } from 'kontra';

let { canvas, context } = init('game');

Parameters

canvas Optional

String or HTMLCanvasElement. The canvas for Kontra to use. Can either be the ID of the canvas element or the canvas element itself. Defaults to using the first canvas element on the page.

options Optional

Object. Game options.

options.contextless Optional

Boolean. If the game will run in an contextless environment. A contextless environment uses a Proxy for the canvas and context so all property and function calls will noop. Defaults to false.

Return value

Object. An object with properties canvas and context. canvas it the canvas element for the game and context is the context object the game draws to.