There are two main JSON objects involved in the synthesis of render-able data.
-
reference: ObjectThe
referenceobject contains a list ofnamespaces, eachnamespaceincludes a list ofrefobjects.The
refobjects can be indexed by eithernumberorstring. In the first case,refobject can be represented by an array, in the second case,refobject can be written as a trivial JSON object. -
instance: ArrayEach element of this array will be rendered to the canvas. The
currentscope of its children is theinstancearray itself.
In both instance elements and namespace elements, key starting with a dollar symbol ($) will be treated as a reference.
-
A single
$references its enclosing scope, which is always the element's parent scope. -
$followed by a string will refer to the scope name after that string (e.g.$hellowill refer to namespace 'hello') -
The values of the magic key will be used as injection keys. Depending on the indexing type of reference, it can be either
number,number[],stringorstring[]
-
Single numbered reference
// reference ref = { layer: [ { layerName: 'layer 0' } ] } // instances instances = [ { $layer: 0 } ] // result result = [ { layerName: 'layer 0' } ]
-
Single number reference to current scope
-
instance[1] -> instance[0]// instances instances = [ { position: [100, 200] }, { $: 0 } ] // result result = [ { position: [100, 200] }, { position: [100, 200] } ]
-
reference['layer'][1] -> reference['layer'][0]// reference reference = { layer: [ { layerName: 'layer 0' }, { $: 0 } // instance[0] referred this line ] } // instances instances = [ { $layer: 1 } ] // result result = [ { layerName: 'layer 0' } ]
-
Feel free to examine and modify the content of demo.js.
node demo.jsNodeJS version recommended to be at least
v16.0.x