1. Tasks
  2. Dynamic Image Generator

Tasks

Dynamic Image Generator

Generate an image based on a Fabric.js object

This task allows you to use Fabric.js to generate an image based on a Fabric.js object. This is useful for creating images dynamically based on user input or other data.
You can use substitution to inject data from the stub into the image.

TIP

You can use the Stubber Fabric.js Canvas Builder to build your Fabric.js object in a visual way.
Then use the Export JSON button to get the JSON object to use in the task. (save into the canvas property)

TIP

To build the initial Fabric.js object you can use Claude Try a prompt similar to this : Please can you generate a fabric.js object that... [your description], please response with the JSON object only.

Basic usage

loading...

Parameters

width
number

The width of the image to generate in pixels.


height
number

The height of the image to generate in pixels.


canvas
object

The Fabric.js canvas object to use for generating the image. This should be a valid Fabric.js object.


file
object

The details of the file to create such as the filename and content_type.


Result

loading...

Properties

file

object

The details of the file that was created.


Examples

Generate two red rectangles on an 800 X 600 image

loading...

Image generated :

Inject Stubref into image

loading...

Image generated :

Stubber Fabric.js Canvas Builder

You can use the Stubber Fabric.js Canvas Builder to build your Fabric.js object in a visual way.
Then use the Export JSON button to get the JSON object to use in the task. (save into the canvas property)

The builder allows you to create and edit Fabric.js objects, and see the changes in real time. Click on an object to edit it's properties, and use the toolbar to add new objects.

You can also import JSON from an existing Fabric.js canvas, and export the canvas to JSON.