#Slate Properties
The slate
defines the parent canvas; the node
is the individual object on the slate
, and an association
defines the relationship between nodes.
Take note of these badges:
Badge | Description |
---|---|
Experimental | This is an expirimental feature. |
Slatebox App Enabled | This property works in conjuction with the Slatebox App. |
Collaboration Feature | This property works in collaboration mode, which must be bootrstrapped either with the Slatebox App or some other mechanism. |
#Slate Properties
Properties ยท View on Github example | Description | Type | Default |
---|---|---|---|
id abcd | Unique identifier for the slate | string | "" |
container abcd | The id of the container that will host the slate (so this would be slateCanvas if the container was <div id='slateCanvas'></div> ) | string | "" |
instance abcd | Unique instance id of the slate (only necessary in collaboration mode) | string | "" |
name slate name | Name of the slate | string | "" |
description slate description | Description of the slate | string | "" |
basedOnThemeId theme12 | Apply a specific theme to the slate using the [theme](Theme API) | string | null |
Experimental syncWithTheme true | Sync the shape creation with the theme in question | boolean | false |
containerStyle.backgroundColor #333 or transparent | Static hex background color of the slate (hex or transparent) | string | transparent |
containerStyle.backgroundImage https://picsum.photos/id/237/200/300 | Background src image of the slate | string | "" |
containerStyle.backgroundSize cover | CSS Background Size Property. (cover or contain , etc) | string | "" |
Experimental containerStyle.backgroundEffect abcd | Use an SVG filter effect for the background | string | null |
containerStyle.backgroundColorAsGradient true | Enable background gradient | boolean | null |
containerStyle.backgroundGradientType linear or radial | Specify the background gradient to apply to the slate | string | null |
containerStyle.backgroundGradientColors ['#ccc', '#333] | Array of hex colors that make up the gradient | array | [] |
Slatebox App Enabled containerStyle.backgroundGradientStrategy shades | Define the gradient strategy (only when using the Slatebox App to generate the colors). Either shades (variance of a single color) or pallette (complementary colors) can be used. | string | shades |
viewPort.useIntertiaScrolling true | Use inertia scrolling for the Slate canvas. (Two finger touchpad slide navigation) | boolean | true |
viewPort.showGrid true | Show background alignment 50 x 50 grid | boolean | false |
viewPort.snapToObjects false | Auto-snap to the neighboring objects when positioning nodes | boolean | true |
viewPort.gridSize 100 | Size of square outline inside the grid | integer | 50 |
viewPort.width 10000 | Width in px of the canvas | integer | 50000 |
viewPort.height 10000 | Height in px of the canvas | integer | 50000 |
viewPort.left abcd | Initial left (x) position of the canvas | integer | 25000 |
viewPort.top abcd | Initial top (y) position of the canvas | integer | 25000 |
enabled false | Set to false to disable the slate and make it non-interactive | boolean | true |
allowDrag false | Allow the canvas to be draggable | boolean | true |
showbirdsEye abcd | Show the birds eye view in the upper | boolean | true |
sizeOfbirdsEye 150 | Default size of birds eye square in px | integer | 200 |
showMultiSelect false | Show the multi select button on the slate | boolean | true |
showZoom false | Show the zoom slider on the slate | boolean | true |
showUndoRedo abcd | Show undo / redo buttons on the slate | boolean | true |
showStatus abcd | Show the status x,y coordinates in the upper left | boolean | false |
showLocks abcd | Show the node locks on the slate when a node has options.locked set to true | boolean | true |
mindMapMode abcd | Enable mind map mode on the slate. Mind-map mode automatically creates parent -> child relationships when a node is added from another node. | boolean | true |
Slatebox App Enabled isPublic false | Determine if a slate is public, private, or unlisted when using the Slatebox App. | boolean | true |
Slatebox App Enabled isUnlisted false | Determine if a slate is public, private, or unlisted when using the Slatebox App. | boolean | false |
Slatebox App Enabled isPrivate false | Determine if a slate is public, private, or unlisted when using the Slatebox App. | boolean | false |
Experimental autoEnableDefaultFilters abcd | Auto enable SVG background filters for slate | boolean | false |
Collaboration Feature followMe abcd | Enable follow-me mode: enforce the Slate canvas and zoom positions to be synced across all collaborators | boolean | false |