PrintArea Class

A print area.

example
// Initialize a product with the "card.psd" template and a channel container.
const productDefinition = {
    surfaces: [{
        printAreas: [{
            name: "postcard",
            designFile: "card",
            containers: [{
                name: "foil",
                type: "texture",
                texture: "texture.jpg"
            }]
        }]
    }]
};

// Load the editor.
CustomersCanvas.IframeApi.loadEditor(iframe, productDefinition)

    // If the editor has been successfully loaded.
    .then(function (editor) {
        // When we get the product.
        editor.getProduct().then(function (product) {
            // Get the fourth container in a print area.
            product.currentSurface.printAreas[0].getContainers()[3]
                // Update this container with new parameters.
                .update({
                    name: "SilverTexture",
                    texture: "silver-texture.jpg"
                });
        });
    });

Methods

Name Description
addContainer

Adds a channel container to the print area.

getContainer

Gets a container by its name.

getContainers

Gets an array of all containers in the print area.

insertContainer

Inserts a channel container into the print area.

moveContainer

Moves a channel container to a new position in the array of containers.

removeContainer

Removes a channel container from the print area.

Properties

containers

containers: Container []

An array of channel containers for print embellishments.

example
// Initialize a product with the "card.psd" template and two channel containers.
const productDefinition = {
    surfaces: [{
        printAreas: [{
            name: "postcard",
            designFile: "card",
            containers: [
                {
                    name: "foil",
                    type: "texture",
                    texture: "texture.jpg"
                },
                {
                    name: "spot",
                    type: "spotColor",
                    previewColor: "rgba(255,255,0,1)"
                }
            ]
        }]
    }]
};

id

id: string

A unique identifier.

name

name: string

The item name.