CanvaElementLayout

Represents the layout of a CanvaElement.
The layout defines:
The dimensions of the element.
The position of the element (relative to the page).
The rotation of the element.
The visible section—the crop box—of the element.
Signature
type CanvaElementLayout = {
  height: number;
  width: number;
​
  left: number;
  top: number;
  rotation: number;
​
  cropBox: {
    left: number;
    top: number;
    height: number;
    width: number;
  };
};
Properties
The pixels in these properties are zoom-independent units. If the user changes the zoom level of the document, the pixel values don't change.
Name
Type
Required
Description
height
number
Yes
The height of the element, in pixels. This does not necessarily equal the height of the user's image.
width
number
Yes
The width of the element, in pixels. This does not necessarily equal the width of the user's image.
left
number
Yes
The distance between the leftmost edge of the page and the element, in pixels.
top
number
Yes
The distance between the topmost edge of the page and the element, in pixels.
rotation
number
Yes
The rotation of the element, in degrees. This is a value from -180 to 179. (The maximum value is 179 because 0 is equivalent to 180.)
cropBox
object
Yes
The visible section of the element.
cropBox.left
number
Yes
The distance between the leftmost edge of the element and the start of the visible section, in pixels.
cropBox.top
number
Yes
The distance between the topmost edge of the element and the start of the visible section, in pixels.
cropBox.height
number
Yes
The height of the visible section, in pixels.
cropBox.width
number
Yes
The width of the visible section, in pixels.

Name	Type	Required	Description
`height`	number	Yes	The height of the element, in pixels. This does not necessarily equal the height of the user's image.
`width`	number	Yes	The width of the element, in pixels. This does not necessarily equal the width of the user's image.
`left`	number	Yes	The distance between the leftmost edge of the page and the element, in pixels.
`top`	number	Yes	The distance between the topmost edge of the page and the element, in pixels.
`rotation`	number	Yes	The rotation of the element, in degrees. This is a value from `-180` to `179`. (The maximum value is `179` because `0` is equivalent to `180`.)
`cropBox`	object	Yes	The visible section of the element.
`cropBox.left`	number	Yes	The distance between the leftmost edge of the element and the start of the visible section, in pixels.
`cropBox.top`	number	Yes	The distance between the topmost edge of the element and the start of the visible section, in pixels.
`cropBox.height`	number	Yes	The height of the visible section, in pixels.
`cropBox.width`	number	Yes	The width of the visible section, in pixels.

Last modified 1yr ago