Skip to content
HTML5

Canvas, Web Storage, Geolocation API Reference

HTML5 browser APIs — Canvas 2D drawing, Web Storage for client-side key/value data, and Geolocation.

By EZ4Code Team

Canvas

The Canvas 2D rendering context for drawing shapes, text, and images programmatically.

canvas.getContext('2d') -> CanvasRenderingContext2D | null

Returns the 2D rendering context used for drawing on the canvas.

Returns: CanvasRenderingContext2D | null

ctx.fillRect(x, y, width, height)

Paints a filled rectangle using the current fillStyle.

Returns: void

ctx.arc(x, y, radius, startAngle, endAngle, anticlockwise?)

Adds a circular arc to the current sub-path. Call fill() or stroke() afterward to render.

Returns: void

ctx.fillText(text, x, y, maxWidth?)

Draws filled text at the given coordinates using the current font and fillStyle.

Returns: void

ctx.drawImage(image, dx, dy, dw?, dh?)

Draws an image, canvas, or video onto the canvas at the given position and size.

Returns: void

Storage

Web Storage API (localStorage and sessionStorage) for synchronous key/value persistence scoped per origin.

storage.setItem(key, value)

Adds or updates a key/value pair. Both key and value must be strings.

Returns: void

storage.getItem(key) -> string | null

Returns the value for the key, or null if the key does not exist.

Returns: string | null

storage.removeItem(key)

Removes the key and its value from storage.

Returns: void

storage.clear()

Removes all key/value pairs from the storage area.

Returns: void

storage.key(index) -> string | null

Returns the name of the key at the given index, useful for iterating storage.

Returns: string | null

Geolocation

The navigator.geolocation API for obtaining the user's geographic position.

navigator.geolocation.getCurrentPosition(success, error?, options?)

Gets the device's current position once. Requires a secure context (HTTPS) and user permission.

Returns: void

navigator.geolocation.watchPosition(success, error?, options?) -> number

Registers a handler called automatically each time the position changes. Returns a watch ID.

Returns: number (watch ID)

navigator.geolocation.clearWatch(id)

Unregisters a position watcher previously installed with watchPosition.

Returns: void

More HTML5 API References