Equation Symbols API Reference
Contents
- EQN_Symbol
- EQN_VinculumSymbol
- EQN_BoxSymbol
- EQN_ArrowSymbol
- EQN_SumSymbol
- EQN_ProdSymbol
- EQN_IntegralSymbol
- EQN_RadicalSymbol
- EQN_DivisionSymbol
- EQN_StrikeSymbol
- EQN_BracketSymbol
- EQN_AngleBracketSymbol
- EQN_BraceSymbol
- EQN_BarSymbol
- EQN_SquareBracketSymbol
- EQN_LineSymbol
EQN_Symbol
Base object options for all equation symbols
isTouchable, touchBorder, color and onClick change the corresponding
properties on the FigureElementPrimitive, and could therefore also
be set in mods. However, as these are commonly used, they are included in
the root object for convenience.
EQN_VinculumSymbol
Extends EQN_Symbol
Vinculum symbol used in fractions ( EQN_Fraction equation function).
width
|<---------------------------------------->|
| |
| | ____
00000000000000000000000000000000000000000000 A
00000000000000000000000000000000000000000000 | lineWidth
00000000000000000000000000000000000000000000 __V_
Properties
- symbol: 'vinculum'
- lineWidth: number | undefined = 0.01
- draw: 'static' | 'dynamic' | undefined = 'dynamic'
- staticWidth: number | 'first' | undefined = 'first'
used when
draw=static.numbersets width of static symbol -'first'calculates and sets width based on first use
Define as element
figure.add({
make: 'equation',
elements: {
v: { symbol: 'vinculum' },
},
forms: {
form1: { frac: ['a', 'v', 'b'] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { frac: ['a', 'vinculum', 'b'] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { frac: ['a', 'v1_vinculum', { frac: ['c', 'v2_vinculum', 'b'] }] },
form2: { frac: [['a', 'ef'], 'v1', { frac: ['c', 'v2', 'd'] }] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { frac: ['a', { vinculum: { lineWidth: 0.004 } }, 'b'] },
},
});
EQN_BoxSymbol
Extends EQN_Symbol
Box equation symbol used in EQN_Box and as a EQN_EncompassGlyph.
width
|<--------------------------------------------------->|
| |
| |
------- 0000000000000000000000000000000000000000000000000000000
A 0000000000000000000000000000000000000000000000000000000
| 0000 0000
| 0000 0000
| 0000 0000
height | 0000 0000
| 0000 0000
| 0000 0000
| 0000 0000
| 0000 0000
| 0000000000000000000000000000000000000000000000000000000
V______ 0000000000000000000000000000000000000000000000000000000
Properties
- symbol: 'box'
- lineWidth: number | undefined = 0.01
- fill: boolean | undefined = false
- width: number | undefined
force width instead of auto calculation
- height: number | undefined
force height instead of auto calculation
- draw: 'static' | 'dynamic' | undefined = dynamic
'dynamic'updates vertices on resize,'static'only changes scale transform - staticWidth: number | 'first' | undefined
used when
draw=static.numbersets width of static symbol -'first'calculates and sets width based on first use - staticHeight: number | 'first' | undefined
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
b: { symbol: 'box', lineWidth: 0.008 },
},
forms: {
form1: { box: ['a', 'b', true, 0.1] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { box: ['a', 'box', true, 0.1] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { box: ['a', 'b_box', false, 0.1] },
form2: { box: ['a', 'b', false, 0.2] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { box: ['a', { box: { lineWidth: 0.004 } }, true, 0.1] },
},
});
EQN_ArrowSymbol
Extends EQN_Symbol
Arrow equation symbol.
The arrow direction defines where it can be used:
'left','right': EQN_Bar (top and bottom sides), EQN_Comment, and EQN_LeftRightGlyph'up','down': EQN_Bracket, EQN_Bar (left and right sides), and EQN_TopBottomGlyph
Note, as the default direciton is 'right', using the inline definition of
arrow will only work with EQN_Bar (top and bottom sides),
EQN_Comment, and EQN_LeftRightGlyph.
arrowWidth
|<--------------->|
| |
| |
-------|------- 0 |
A | 00000 |
arrowHeight | | 0000000 |
| | 00000000000 |
V | 000000000000000 |
------ 0000000000000000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
0000000
| |
| |
|<--->|
lineWidth
Properties
- symbol: 'arrow'
- direction: 'up' | 'down' | 'left' | 'right' | undefined = 'right'
- lineWidth: number | undefined = 0.01
- arrowWidth: number | undefined = 0.01
- arrowHeight: number | undefined = 0.04
- lineWidth: number | undefined = 0.01
- draw: 'static' | 'dynamic' | undefined = dynamic
'dynamic'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
rightArrow: { symbol: 'arrow', direction: 'right' },
},
forms: {
form1: { bar: ['a', 'rightArrow', false, 0.05, 0.03] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { bar: ['a', 'arrow', false, 0.05, 0.03] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { bar: ['a', 'ar_arrow', false, 0.05, 0] },
form2: { bar: ['a', 'ar', false, 0.05, 0.1] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: {
bar: {
content: 'a',
side: 'left',
symbol: { arrow: { direction: 'up' } },
overhang: 0.1,
},
},
},
});
EQN_SumSymbol
Extends EQN_Symbol
Sum equation symbol used with the EQN_SumOf equation function.
---------- 00000000000000000000000000000000000
A 0000000 000000
| 0000000 000
| 0000000 00
| 0000000
| 0000000
| 0000000
| 0000000
| 0000000
| 0000000
| 0000000
| 000000
| 000
| 0000
height | 0000
| 0000 \
| 0000 \
| 0000 lineWidth
| 0000
| 0000
| 0000
| 0000 00
| 0000 000|
| 0000 000000|
V 000000000000000000000000000000000000 |
-------- 000000000000000000000000000000000000 |
| |
| |
| width |
|<------------------------------------>|
Properties
- symbol: 'sum'
- lineWidth: number | undefined
(
height * 0.88 / (25 * height + 15)) - sides: number | undefined = 5
number of sides that make up serif curve
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
sigma: { symbol: 'sum' },
},
forms: {
form1: { sumOf: ['sigma', 'a', 'a = 0', 'n'] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { sumOf: ['sum', 'a', 'a = 0', 'n'] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { sumOf: ['s1_sum', 'a', 'a = 0', 'n'] },
form2: { sumOf: ['s1', 'a', 'a = 0', 'm'] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { sumOf: [{ sum: { lineWidth: 0.01 } }, 'a', 'a = 0', 'n'] },
},
});
EQN_ProdSymbol
Extends EQN_Symbol
Product equation symbol used with the EQN_ProdOf equation function.
width
|<--------------------------------------------------------->|
| |
| |
| |
| lineWidth |
| / |
| / |
---- 00000000000000000000000000000000000000000000000000000000000000
A 000000000000000000000000000000000000000000000000000000
| 00000000000000000000000000000000000000000000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
height | 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 00000000000 00000000000
| 0000000000000 00000000000000
V 00000000000000000 000000000000000000
----- 0000000000000000000000000 00000000000000000000000000
Properties
- symbol: 'prod'
- lineWidth: number | undefined = related to height
- sides: number | undefined = 5
number of sides that make up serif curve
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
sigma: { symbol: 'prod' },
},
forms: {
form1: { prodOf: ['sigma', 'a', 'a = 0', 'n'] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { prodOf: ['prod', 'a', 'a = 0', 'n'] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { prodOf: ['p1_prod', 'a', 'a = 0', 'n'] },
form2: { prodOf: ['p1', 'a', 'a = 0', 'm'] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { prodOf: [{ prod: { lineWidth: 0.01 } }, 'a', 'a = 0', 'n'] },
},
});
EQN_IntegralSymbol
Extends EQN_Symbol
Integral equation symbol used with the EQN_Integral equation function.
-------------------------------------------------- 0000000
A 000000011111111
| 0000000 111111111111
| 0000000 11111111111111
| 0000000 11111111111111
| 0000000 111111111111
| 000000000 11111111
| 000000000
| 0000000000
| 000000000
| 0000000000
| 0000000000
| 00000000000
| 00000000000
| 000000000000
| 000000000000 lineWidth
| height ------->000000000000<----------
| 000000000000
| 000000000000
| 000000000000
| 00000000000
| 00000000000
| 0000000000
| 0000000000
| Serif 000000000
| \ 000000000
| \ 0000000000
| 11111111 000000000
| 111111111111 00000000
| 11111111111111 0000000
| 11111111111111 0000000
| 111111111111 0000000
V 111111110000000
------- 0000000
Properties
- symbol: 'int'
- lineWidth: number | undefined = related to height
- sides: number | undefined = 30
number of sides that make up s curve
- num: number | undefined = 1
number of integral symbols
- type: 'line' | 'generic' | undefined = generic
linedraws a circle through the symbols denoting a line integral - tipWidth: number | undefined = related to lineWidth
width of s curve tip
- serif: boolean | undefined = true
falseto remove serifs - serifSides: number | undefined = 10
number of sides in serif circles
- lineIntegralSides: number | undefined = 20
number of sides in line integral circle
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
int: { symbol: 'int' },
},
forms: {
form1: { int: ['int', 'x dx', 'a', 'b'] },
},
});
Triple Integral
figure.add({
make: 'equation',
elements: {
int: { symbol: 'int', num: 3 },
},
forms: {
form1: { int: ['int', 'dx dy dz'] },
},
});
Line Integral
figure.add({
make: 'equation',
elements: {
int: { symbol: 'int', type: 'line' },
},
forms: {
form1: { int: ['int', 'r dr'] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { int: ['int', 'x dx', 'a', 'b'] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { int: ['i1_int', 'x dx', 'a', 'b'] },
form2: { int: ['i1', 'y dy', 'a', 'b'] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { int: [{ int: { serif: false } }, 'x dx', 'a', 'b'] },
},
});
EQN_RadicalSymbol
Extends EQN_Symbol
Radical equation symbol used in EQN_Root.
The radical symbol allows customization on how to draw the radical. Mostly it will not be needed, but for edge case equation layouts it may be useful.
height
|
|
|_____________________________ XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
A X|
| startHeight X | CCCCCCCCCCCCCCCCCCCCCCC
| | X | CCCCCCCCCCCCCCCCCCCCCCC
| | tickHeight X | CCCCCCCCCCCCCCCCCCCCCCC
| | | X | CCCCCCCCCCCCCCCCCCCCCCC
| |____V____ X | CCCCCCCCCCCCCCCCCCCCCCC
| A | X X | CCCCCCCCCCCCCCCCCCCCCCC
| | |__X |X X | CCCCCCCCCCCCCCCCCCCCCCC
| | A | | X X | CCCCCCCCCCCCCCCCCCCCCCC
| | | | X X | CCCCCCCCCCCCCCCCCCCCCCC
| | | | X X | CCCCCCCCCCCCCCCCCCCCCCC
V___V______|__|____X |
| | | |
| | | |
tickWidth >|--|< | |
| | | |
| |<-->|downWidth |
| |
|<----------------->|
startWidth
Properties
- symbol: 'radical'
- lineWidth: number | undefined = 0.01
- width: number | undefined = normally defined by content size
force width of content area
- height: number | undefined = normally defined by content size
force height of content area
- startWidth: number | undefined = 0.5
- startHeight: number | undefined = 0.5
- maxStartWidth: ?number | undefined = 0.15
- maxStartHeight: ?number | undefined = 0.15
- tickHeight: number | undefined
- tickWidth: number | undefined
- downWidth: number | undefined
- proportionalToHeight: boolean | undefined = true
truemakesstartHeight,startWidth,tickHeight,tickWidth, anddownWidtha percentage of height instead of absolute - lineWidth2: number | undefined = 2 x lineWidth
lineWidth of down stroke
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use - staticWidth: number | 'first' | undefined = 'first'
used when
draw=static.numbersets width of static symbol -'first'calculates and sets width based on first use
Define in element
figure.add({
make: 'equation',
elements: {
r: { symbol: 'radical' },
},
forms: {
form1: { root: ['r', 'a', false, 0.05] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { root: ['radical', 'a', false, 0.05] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { root: ['r1_radical', 'a', false, 0.05] },
form2: { root: ['r1', ['a', 'b'], false, 0.05] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { root: [{ radical: { lineWidth: 0.005 } }, 'a', false, 0.05] },
},
});
EQN_DivisionSymbol
Extends EQN_Symbol
Division equation symbol used in EQN_Root.
The division symbol allows customization on how to draw the long form and short form division symbol. Mostly it will not be needed, but for edge case equation layouts it may be useful.
left space right space
bend width |<->|<---->| >|--|<
| | | | |
| | | | |
------- XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX____V
A X | | |_______|
| X | CCCCCCCCCCCCCCCCCCCCCCC A
| X CCCCCCCCCCCCCCCCCCCCCCC top space
| X CCCCCCCCCCCCCCCCCCCCCCC
height | X CCCCCCCCCCCCCCCCCCCCCCC
| X CCCCCCCCCCCCCCCCCCCCCCC
| X CCCCCCCCCCCCCCCCCCCCCCC
| X CCCCCCCCCCCCCCCCCCCCCCC
| X CCCCCCCCCCCCCCCCCCCCCCC
| X CCCCCCCCCCCCCCCCCCCCCCC bottom space
V X CCCCCCCCCCCCCCCCCCCCCCC_______V
------ X _________________________________________|
| A
| |
| width |
|<----------------------------------------->
Properties
- symbol: 'division'
- lineWidth: number | undefined = 0.01
- width: number | undefined = normally defined by content size
force width of content area
- height: number | undefined = normally defined by content size
force height of content area
- bendWidth: number | undefined = 0
- sides: number | undefined = 10
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use - staticWidth: number | 'first' | undefined = 'first'
used when
draw=static.numbersets width of static symbol -'first'calculates and sets width based on first use
Define in element
figure.add({
make: 'equation',
elements: {
d: { symbol: 'division', bendWidth: 0.05 },
},
forms: {
form1: { box: ['abc', 'd'] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { box: ['abc', 'division'] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { box: ['abc', 'd1_division'] },
form2: { box: ['abc', 'd1'] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { box: ['abc', { division: { lineWidth: 0.005 } }] },
},
});
EQN_StrikeSymbol
Extends EQN_Symbol
Strike equation symbol used in EQN_Strike.
Integral equation symbol used with the EQN_Strike and EQN_StrikeComment equation functions.
Four styles of strike symbol are available:
000 000
000 000
000 000
000 0000000000000000
000 000
000 000
000 000
cross horizontal
000 000
000 000
000 000
000 000
000 000
000 000
000 000
forward back
Properties
- symbol: 'strike'
- style: 'cross' | 'forward' | 'back' | 'horizontal' | undefined = 'cross'
- lineWidth: number | undefined = 0.015
- width: number | undefined = normally defined by
content size
force width of strike
- height: number | undefined = normally defined by
content size
force height of strike
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use - staticWidth: number | 'first' | undefined = 'first'
used when
draw=static.numbersets width of static symbol -'first'calculates and sets width based on first use
Define in element
figure.add({
make: 'equation',
elements: {
s: { symbol: 'strike', style: 'cross', lineWidth: 0.01 },
},
forms: {
form1: { strike: ['ABC', 's'] },
},
});
Forward Strike
figure.add({
make: 'equation',
elements: {
s: { symbol: 'strike', style: 'forward', lineWidth: 0.01 },
},
forms: {
form1: { strike: ['ABC', 's'] },
},
});
Back Strike
figure.add({
make: 'equation',
elements: {
s: { symbol: 'strike', style: 'back', lineWidth: 0.01 },
},
forms: {
form1: { strike: ['ABC', 's'] },
},
});
Horizontal Slash
figure.add({
make: 'equation',
elements: {
s: { symbol: 'strike', style: 'horizontal', lineWidth: 0.01 },
},
forms: {
form1: { strike: ['ABC', 's'] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { strike: ['ABC', 'strike'] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { strike: ['ABC', 's1_strike'] },
form2: { strike: ['DEFGH', 's1'] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { strike: ['ABC', { strike: { style: 'forward' } }] },
},
});
EQN_BracketSymbol
Extends EQN_Symbol
Bracket equation symbol used in EQN_Bracket, EQN_Bar, EQN_Matrix, and EQN_Comment.
tipWidth
----->| |<---
| |
| |
000
0000
00000
000000
000000
000000
lineWidth 000000
------>000000<---
000000
|000000
|000000
| 000000
| 00000
| 0000
| 000
| |
| |
|<------->|
width
Properties
- symbol: 'bracket'
- side: 'left' | 'right' | 'top' | 'bottom' | undefined = 'left'
how to orient the bracket
- sides: number | undefined = 10
number of sides in bracket curve
- lineWidth: number | undefined = depends on height
- tipWidth: number | undefined = depends on lineWidth
- width: number | undefined = normally depends on height
force width bracket
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
lb: { symbol: 'bracket', side: 'left' },
rb: { symbol: 'bracket', side: 'right' },
},
forms: {
form1: { brac: ['lb', 'a', 'rb'] },
},
});
Define inline
figure.add({
make: 'equation',
forms: {
form1: {
brac: [
{ lb_bracket: { side: 'left' } },
'a',
{ rb_bracket: { side: 'right' } },
],
},
},
});
EQN_AngleBracketSymbol
Extends EQN_Symbol
Angle bracket equation symbol used in EQN_Bracket, EQN_Bar, EQN_Matrix, and EQN_Comment.
width
|<------->|
| |
--------|----- 0000
A | 0000
| | 0000
| | 0000
| | 0000
| 0000
height | 0000
| 0000
| 0000
| 0000
| 0000
| 0000
| 0000
V_____________ 0000
Properties
- symbol: 'angleBracket'
- side: 'left' | 'right' | 'top' | 'bottom' | undefined = 'left'
how to orient the angle bracket
- lineWidth: number | undefined = depends on height
- width: number | undefined = normally depends on height
force width bracket
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
lb: { symbol: 'angleBracket', side: 'left' },
rb: { symbol: 'angleBracket', side: 'right' },
},
forms: {
form1: { brac: ['lb', 'a', 'rb'] },
},
});
Define inline
figure.add({
make: 'equation',
forms: {
form1: {
brac: [
{ lb_angleBracket: { side: 'left' } },
'a',
{ rb_angleBracket: { side: 'right' } },
],
},
},
});
EQN_BraceSymbol
Extends EQN_Symbol
Brace equation symbol used in EQN_Bracket, EQN_Bar, EQN_Matrix, and EQN_Comment.
width
|<------>|
| |
| |
| 000
| 000
| 000
| 0000
| 0000
| 0000
| 0000
| 000
| 000
000
000
000
0000
0000
0000
0000
- - -0000 - - - -
| 000 |
| 000 |
| 000 |
- - - - - - - - -
\
\
\
- - - - - - - - - - - - - - - - - - - - - - - - -
| 00000000000000 |
| 00000000000000 |
| 000000000000 tipWidth |
| 000000000000 | |
| 000000000000 | |
| 0000000000000 _______V_ |
| 00000000000 |
| 0000000_________ |
| A |
- - - - - - - - - - - - - - - - - - - - - - - - -
Properties
- symbol: 'brace'
- side: 'left' | 'right' | 'top' | 'bottom' | undefined = 'left'
how to orient the brace
- lineWidth: number | undefined = depends on height
- tipWidth: number | undefined = depends on lineWidth
- width: number | undefined = normally depends on height
force width bracket
- sides: number | undefined = 10
number of sides in curved sections
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
lb: { symbol: 'brace', side: 'left' },
rb: { symbol: 'brace', side: 'right' },
},
forms: {
form1: { brac: ['lb', 'a', 'rb'] },
},
});
Define inline
figure.add({
make: 'equation',
forms: {
form1: {
brac: [
{ lb_brace: { side: 'left' } },
'a',
{ rb_brace: { side: 'right' } },
],
},
},
});
EQN_BarSymbol
Extends EQN_Symbol
Bar equation symbol.
The bar side defines where it can be used:
'top','bottom': EQN_Bar (top and bottom sides), EQN_Comment, and EQN_LeftRightGlyph'left','right': EQN_Bracket, EQN_Bar (left and right sides), EQN_Matrix and EQN_TopBottomGlyph
Note, as the default direciton is 'right', using the inline definition of
arrow will only work with EQN_Bar (top and bottom sides),
EQN_Comment, and EQN_LeftRightGlyph.
>| |<---- lineWidth
| |
| |
000
000
000
000
000
000
000
000
000
000
000
Properties
- symbol: 'bar'
- side: 'left' | 'right' | 'top' | 'bottom' | undefined = 'left'
how to orient the bar
- lineWidth: number | undefined = 0.01
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
b: { symbol: 'bar', side: 'top' },
},
forms: {
form1: { bar: ['a', 'b', false, 0.05, 0.03] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: {
bar: {
content: 'a',
symbol: 'bar',
side: 'left',
overhang: 0.1,
},
},
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { bar: ['a', { bar: { side: 'top' } }, false, 0.05, 0.03] },
form2: { bar: [['a', 'bc'], { bar: { side: 'top' } }, false, 0.05, 0.03] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { bar: ['a', { bar: { side: 'top' } }, false, 0.05, 0.03] },
},
});
EQN_SquareBracketSymbol
Extends EQN_Symbol
Square bracket equation symbol used in EQN_Bracket, EQN_Bar, EQN_Matrix, and EQN_Comment.
width
|<--------------------->|
| |
___ ____
A 0000000000000000000000000 A
| 0000000000000000000000000 | tipWidth
| 0000000000000000000000000 ___V
| 00000000
| 00000000
| 00000000
| 00000000
height | 00000000
| 00000000
| 00000000
| 00000000
| 00000000
| 00000000
| 0000000000000000000000000
| 0000000000000000000000000
V___ 0000000000000000000000000
| |
| |
|<---->|
line width
Properties
- symbol: 'squareBracket'
- side: 'left' | 'right' | 'top' | 'bottom' | undefined = 'left'
how to orient the square bracket
- lineWidth: number | undefined = 0.01
- tipWidth: number | undefined = 0.01
- width: number | undefined = depends on lineWidth
- radius: number | undefined = 0
optional curved corner radius
- sides: number | undefined = 5
number of sides in curve
- draw: 'static' | 'dynamic' | undefined = dynamic
'static'updates vertices on resize,'static'only changes scale transform - staticHeight: number | 'first' | undefined = 'first'
used when
draw=static.numbersets height of static symbol -'first'calculates and sets height based on first use
Define in element
figure.add({
make: 'equation',
elements: {
lb: { symbol: 'squareBracket', side: 'left' },
rb: { symbol: 'squareBracket', side: 'right' },
},
forms: {
form1: { brac: ['lb', 'a', 'rb'] },
},
});
Define inline
figure.add({
make: 'equation',
forms: {
form1: {
brac: [
{ lb_squareBracket: { side: 'left' } },
'a',
{ rb_squareBracket: { side: 'right' } },
],
},
},
});
EQN_LineSymbol
Extends EQN_Symbol
A line symbol to be used in EQN_Annotate and EQN_Comment as an EQN_LineGlyph to draw a line between the content and an annotation.
The line can be solid or dashed, and have arrows on either or both ends.
Properties
- width: number | undefined
line width
- dash: TypeDash | undefined
dash style of line
- arrow: OBJ_LineArrows | undefined
arrow styles of line where start is toward the content
Define in element
figure.add({
make: 'equation',
elements: {
l: { symbol: 'line', arrow: 'barb', width: 0.005 },
},
forms: {
form1: { topComment: ['a', 'b', 'l', 0.2, 0.2] },
},
});
Dashed line
figure.add({
make: 'equation',
elements: {
l: { symbol: 'line', dash: [0.01, 0.01], width: 0.005 },
},
forms: {
form1: { topComment: ['a', 'b', 'l', 0.2, 0.2] },
},
});
Define inline simple one use
figure.add({
make: 'equation',
forms: {
form1: { topComment: ['a', 'b', 'line', 0.2, 0.2] },
},
});
Define inline with reuse
const eqn = figure.add({
make: 'equation',
forms: {
form1: { topComment: ['a', 'b', 'l1_line', 0.2, 0.2] },
form2: { topComment: ['c', 'd', 'l1', 0.2, 0.2] },
},
});
eqn.animations.new()
.goToForm({ delay: 1, target: 'form2', animate: 'move' })
.start();
Define inline with customization
figure.add({
make: 'equation',
forms: {
form1: { topComment: ['a', 'b', { line: { arrow: 'barb' } }, 0.2, 0.2] },
},
});
'dynamic'updates vertices on resize,'static'only changes scale transform