Draw

The default 2d context to use for drawing, usually mainContext

Keeps track of how many draw calls there were each frame for debugging

Draw an ellipse filled with a radial gradient from the center to the rim

• Best when batched with other untextured polys
• If drawing mostly textured sprites, bake the gradient into a texture and use drawTile instead
• Stacking gradients at the exact same position may show a faint vertical artifact

Engine font image, 8x8 font provided by the engine

The primary 2D canvas visible to the user

The size of the main canvas (and other secondary canvases)

2d context for mainCanvas

Keeps track of how many primitives were drawn each frame for debugging A single draw call can render many primitives (e.g. a WebGL sprite batch).

Array containing texture info for batch rendering system

Offscreen canvas that can be used for image processing

Offscreen canvas that can be used for image processing

Offscreen canvas with willReadFrequently that can be used for image processing

Offscreen canvas with willReadFrequently that can be used for image processing

Draw this canvas layer centered in world space, with color applied if using WebGL

Fit the camera to a rectangle in world space by setting cameraPos and cameraScale

• worldMargin pads the content rectangle in world units, so the gap scales with the content on resize
• screenInset reserves space in screen pixels on each viewport edge (for example a HUD band) and re-centers the content away from that edge, so the reserved band stays a fixed pixel size on resize
• worldMargin and screenInset may each be a number for all sides, a Vector2 (x=left/right, y=top/bottom), or an object with any of {top, right, bottom, left}

Combines LittleJS canvases onto the main canvas This is necessary for things like screenshots and video

Draw directly to a 2d canvas context in world space. The Y axis is flipped so world-Y-up coordinates render right-side up (matches the WebGL path). Callers whose drawing depends on Y direction (e.g. linear gradients) should flip their own Y endpoints accordingly.

Draw colored circle using passed in point

Draw a circle filled with a radial gradient from the center to the rim

• Best when batched with other untextured polys
• If drawing mostly textured sprites, bake the gradient into a texture and use drawTile instead
• Stacking gradients at the exact same position may show a faint vertical artifact

Draw colored ellipse using passed in point

Helper function to draw an image with color and additive color applied This is slower then normal drawImage when color is applied

Draw colored line between two points

Draw connected lines between a series of points

Draw colored polygon using passed in points

Draw colored rect centered on pos

Draw a rect centered on pos with a gradient from top to bottom

Draw colored regular polygon using passed in number of sides

Draw text on main canvas in world space Automatically splits new lines into rows

Draw text in screen space Automatically splits new lines into rows

Draw a texture tiled (wrapped) across a rectangle in world space. Useful for backgrounds, repeating patterns, and seamless fills. The whole texture is tiled — sub-region (TileInfo) wrapping is not supported.

Draw textured tile centered in world space

Get the size of the camera window in world space

Returns true if fullscreen mode is active

Check if a box, point, or circle is on screen with a circle test If size is a Vector2, uses the length as diameter This can be used to cull offscreen objects from render or update

Load a texture at a specific index

Convert from screen to world space coordinates

Convert from screen to world space coordinates for a directional vector (no translation)

Convert screen space transform to world space

Enable additive blending

Set the cursor style

Create a tile info object using a grid based system

• This can take vecs or floats for easier use and conversion
• If an index is passed in, the tile size and index will determine the position

Toggle fullscreen mode

Convert from world to screen space coordinates

Convert from screen to world space coordinates for a directional vector (no translation)