🎨
FabricJS - Drawing Canvas
  • Introduction
    • 👋Welcome
    • Key Use Cases
    • Key Features
    • FAQs
  • Using the Plugin
    • Getting Started
    • Set up the Background
    • Set up Click Behavior
    • Saving the Canvas
    • Downloading the Canvas
  • Feature Reference
    • General Settings
    • Workflow Actions
    • Workflow Events
    • Exposed States
  • Use Cases
    • Templates
    • Canva/Visual Moodboard
    • PowerPoint & Slides
    • Image Editor
  • Useful tips
    • Custom Control Menu
    • Responsiveness
    • Element HTML id Attribute
Powered by GitBook
On this page
  1. Feature Reference

Exposed States

This plugin enables you to build a robust graphics canvas on your Bubble web page. There are hundreds of customizations, workflow events, workflow actions, and custom states you can apply to your own graphics canvas. Here is a list of several of the key features:

Exposed States You can access these states on the design or workflow tab, by referring to the Canvas-Main element's states.

State
Evaluates To

Element is Selected?

Yes/No - Yes if an object/element is selected on the Canvas

Selected Element Type

"drawing", "shape", "text" - if there is a selected Element on the Canvas, this publishes the Type of element

Selected Shape - Type

"Rectangle", "Ellipse", "Triangle", "Line" - If the selected Element is a Shape, this will publish the shape type

Selected Shape - Fill Color

Color - if the selected Element is a Shape, this publishes the Fill Color of that Shape

Selected Shape - Outline Color

Color - if the selected Element is a Shape, this publishes the Outline Color of that Shape

Selected Shape - Outline Width

Color - if the selected Element is a Shape, this publishes the Outline Width of that Shape

Selected Drawing - Color

Color - if the selected Element is a Drawing, this publishes the Color of that Drawing's stroke

Selected Drawing - Stroke Width

Color - if the selected Element is a Drawing, this publishes the Width of that Drawing's stroke

Selected Text - Font Family

Text - if the selected Element is a Text, this publishes the Font Family of that Text

Selected Text - Font Color

Text - if the selected Element is a Text, this publishes the Font Color of that Text

Selected Text - Font Size

Text - if the selected Element is a Text, this publishes the Font Size of that Text

Selected Text - Text Value

Text - if the selected Element is a Text, this publishes the Value of that Text

Selected Text - Text Value

Text - If the selected Element is a Text, this will publish the text value (i.e. the value inside of the textbox)

Drawing's PNG URL

Serialized Canvas

Selected Element IDs

Text - The text value(s) of the selected Element's unique IDs

Number of Undos Available

Number - The number of undo's available. When the Canvas is initially loaded, this will be 0. Each user action will increase this value by 1. Note: This setting is helpful if you want to create an undo button on your page and "grey it out" when the user has 0 undo's remaining.

Number of Redos Available

Number - The number of redo's available. When the Canvas is initially loaded, this will be 0. Each time the "undo" action is run will increase this value by 1. Note: This setting is helpful if you want to create an redo button on your page and "grey it out" when the user has 0 redo's remaining.

PreviousWorkflow EventsNextTemplates

Last updated 3 years ago

Text - The URL of the Canvas's PNG (

Text - The JSON of the Serialized Canvas ()

details here)
details here