toCanvaImageBlob

Converts any of the following inputs into a CanvaImageBlob:
​CanvaElement​
​CanvaMedia​
​CanvaImageUrl​
​HTMLCanvasElement​
​HTMLImageElement​
​SVGElement​
This method supersedes the fromCanvas and fromElement methods.
Usage
1
const { imageHelpers } = window.canva;
2
const canva = window.canva.init();
3
​
4
canva.onReady(async (opts) => {
5
  const image = await imageHelpers.toCanvaImageBlob(opts.element, {
6
    quality: "preview",
7
  });
8
  console.log(image);
9
});
Copied!
Parameters
Name
Type
Required
Description
image
CanvaElement | CanvaMedia | CanvaImageUrl | HTMLCanvasElement | HTMLImageElement | SVGElement
Yes
The input to convert into a CanvaImageBlob.
opts
object
No
Options for configuring the CanvaImageBlob.
opts.quality
ImageQuality
No
The quality of the CanvaImageBlob. This parameter is only used when the input is aCanvaElement or CanvaMedia.
opts.type
string
No
The MIME type of the CanvaImageBlob. The supported values include "image/jpeg", "image/png", and "image/svg+xml". This parameter is only used when the input is a HTMLCanvasElement or HTMLImageElement.
Returns
Promise<CanvaImageBlob>
Types
ImageQuality
Signature
1
const enum ImageQuality = {
2
  FULL = "full",
3
  PREVIEW = "preview",
4
  THUMBNAIL = "thumbnail"
5
}
Copied!
Properties
Name
Value
FULL
"full"
PREVIEW
"preview"
THUMBNAIL
"thumbnail"

getSize

toCanvas

Last modified 7mo ago

Copy link

Contents