Captures a sequence of frames from the canvas that can be saved as images.
saveFrames() creates an array of frame objects. Each frame is stored as an object with its file type, file name, and image data as a string. For example, the first saved frame might have the following properties:
{ ext: 'png', filenmame: 'frame0', imageData: 'data:image/octet-stream;base64, abc123' }.
The first parameter, filename, sets the prefix for the file names. For example, setting the prefix to 'frame' would generate the image files frame0.png, frame1.png, and so on.
The second parameter, extension, sets the file type to either 'png' or 'jpg'.
The third parameter, duration, sets the duration to record in seconds. The maximum duration is 15 seconds.
The fourth parameter, framerate, sets the number of frames to record per second. The maximum frame rate value is 22. Limits are placed on duration and framerate to avoid using too much memory. Recording large canvases can easily crash sketches or even web browsers.
The fifth parameter, callback, is optional. If a function is passed, image files won't be saved by default. The callback function can be used to process an array containing the data for each captured frame. The array of image data contains a sequence of objects with three properties for each frame: imageData, filename, and extension.
Note: Frames are downloaded as individual image files by default.
Examples
Syntax
saveFrames(filename, extension, duration, framerate, [callback])Parameters
prefix of file name.
file extension, either 'jpg' or 'png'.
duration in seconds to record. This parameter will be constrained to be less or equal to 15.
number of frames to save per second. This parameter will be constrained to be less or equal to 22.
callback function that will be executed to handle the image data. This function should accept an array as argument. The array will contain the specified number of frames of objects. Each object has three properties: imageData, filename, and extension.