Interface EQN_Front

Equation front function

Bring an equation phrase's elements forward in the equation's draw stack. All elements within content are moved together as a group, keeping their current relative draw order. Nested front/back functions are applied inner-most first, so an inner front/back reorders the elements and this (outer) function then moves the reordered group as a unit.

The group's position is determined by, in order of precedence:

before - position the group just before (behind) the most-back of the named anchor element(s). num shifts it further back (default 0).
after - position the group just after (in front of) the most-front of the named anchor element(s). num shifts it further forward (default 0).
num - a positive value moves the group that many places forward; a negative value positions it |num| places behind the very front.
otherwise the group is brought completely to the front.

The reorder is applied whenever the form is shown, relative to the equation's natural (definition) draw order, so each form deterministically defines its own stacking.

Options can be an object, or an array in the property order below

See

To test examples, append them to the boilerplate

Example

// Three overlapping squares, offset so the stacking order is visible. Red is
// defined first so it sits at the back by default; `front` brings it on top
// of the green and blue squares.
const sq = color => figure.primitives.rectangle({ width: 0.6, height: 0.6, color });
figure.add({
  make: 'equation',
  elements: {
    r: sq([1, 0, 0, 1]),
    g: sq([0, 0.8, 0, 1]),
    b: sq([0, 0, 1, 1]),
  },
  forms: {
    0: [
      { offset: [{ front: ['r'] }, [0, 0]] },
      { offset: ['g', [0.3, -0.25]] },
      { offset: ['b', [0.6, -0.5]] },
    ],
  },
});

Example

// Object Definition with an anchor - position the red square just after (in
// front of) the green square, so it covers green but stays behind blue.
const sq = color => figure.primitives.rectangle({ width: 0.6, height: 0.6, color });
figure.add({
  make: 'equation',
  elements: {
    r: sq([1, 0, 0, 1]),
    g: sq([0, 0.8, 0, 1]),
    b: sq([0, 0, 1, 1]),
  },
  forms: {
    0: [
      { offset: [{ front: { content: 'r', after: 'g' } }, [0, 0]] },
      { offset: ['g', [0.3, -0.25]] },
      { offset: ['b', [0.6, -0.5]] },
    ],
  },
});

@interface

Interface EQN_Front

See

Example

Example

Settings