Reference loadImage()

loadImage()

Loads an image to create a p5.Image object.

loadImage() interprets the first parameter one of three ways. If the path to an image file is provided, loadImage() will load it. Paths to local files should be relative, such as '/assets/thundercat.jpg'. URLs such as 'https://example.com/thundercat.jpg' may be blocked due to browser security. Raw image data can also be passed as a base64 encoded image in the form 'data:image/png;base64,arandomsequenceofcharacters'.

The second parameter is optional. If a function is passed, it will be called once the image has loaded. The callback function can optionally use the new p5.Image object.

The third parameter is also optional. If a function is passed, it will be called if the image fails to load. The callback function can optionally use the event error.

Images can take time to load. Calling loadImage() in preload() ensures images load before they're used in setup() or draw().

Examples

Syntax

loadImage(path, [successCallback], [failureCallback])

Parameters

path

path of the image to be loaded or base64 encoded image.

successCallback

function called with p5.Image once it loads.

failureCallback

function called with event error if the image fails to load.

Notice any errors or typos? Please let us know. Please feel free to edit src/image/loading_displaying.js and open a pull request!

Related References