Symbols Library

pergola.symbols (defined in lib/symbols.js) is an object whose properties represent a collection of symbols. Each property is an array with one or more object elements defining SVG primitives, or text, or image elements, in the format expected by the pergola.SVG() node builder (without the appendTo property). A symbol property can also be an object designating a category, like it's the case for pergola.symbols.arrow, defining in turn the object properties tiny, small, and large, each having a subset of symbol properties up, down, left, and right; the reference to one of those would be: pergola.symbols.arrow.small.left.

Example of a symbol definition:

 lens : [
    {element : "path", d : "M4.5 3.4l6.5,5", stroke : "#323232", "stroke-width" : 1.25, "stroke-linecap" : "round"},
    {element : "circle", r : 5.75, fill : "#FFFFFF", stroke : "#727272", "stroke-width" : 1.5, "fill-opacity" : .6}

A symbol can be referenced when instantiating a class that implements the symbol property, for example pergola.Button, or can be used as standlone by passing it to the pergola.symbol() utility function. See the Symbols library chapter in the tutorial for in-depth information and use cases for symbols and icons. Below is the current list of symbol properties of the pergola.symbols object: