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.
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)
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
Parameters
number
width The width of the image to generate in pixels.
number
height The height of the image to generate in pixels.
object
canvas The Fabric.js canvas object to use for generating the image. This should be a valid Fabric.js object.
object
file The details of the file to create such as the filename and content_type.
Result
Properties
file
The details of the file that was created.
Examples
Generate two red rectangles on an 800 X 600 image
Image generated :
Inject Stubref into image
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.