# 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.

# 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