setBackground

• Less than a minute to read

Allows for replacing a background image of a design opened in the editor. The image can be taken from either a specified URL or the Customer's Canvas public gallery (in this case, the syntax is public:folder/filename.jpg).

Note

You should take care that the background has a correct DPI and dimensions, otherwise, it may distort the design size.

Params

• url - a URL to the image or a path in the Customer's Canvas gallery with the public: prefix as explained in Populating designs with user info.
• surfaceIndex - an index of a surface that should be modified (the current surface, if omitted).
• autoResize - if true, the background image will be resized to cover the entire design.
• toTile - if true, the background image will tile the entire design. It is useful for pattern backgrounds. If false (by default), the background size will become the product size.

For the complete list of parameters, you can refer to IDesignEditorDefinitionSetBackground.

Example

{
    "type": "gallery",
    "name": "bg",
    "params": {
        "items": [...]
    }
},
{
    "type": "design-editor", 
    "name": "design-editor",
    "params": {
        "initial": { ... }, 
        "setBackground": {
            "url": "{{ $['bg']._.url }}"
        }
    }
}