5.2 LegendText

LegendText is a class used to create custom text elements in LegendBox with custom visual properties such as the shape and color of the icon. States can be used in the text as well.

Parameters:

Required:

• expression: string The text-expression which will be displayed in LegendBox, can be a LaTeX-string too (Ex:"\int_{a}^{b} x^2\,dx")

Optional:

• color?: string A hex-string which defines the color for the icon (Ex:"#AA74B8")
• shape?: "circle" | "rectangle" | "triangle" Defines the icon in front of the text-expression
• useStates?: boolean Whether or not the LegendText object should listen to/depend on the states it contains

Default Parameters:

  shape: "circle",
  color: "#faa307",
  useStates: false,

Examples

Example 1: Initialization of LegendText

As text:

// LegendText with regular String
const text1 = new LegendText("node_1: node", {
  color: "#FFFFFF",
  shape: "triangle",
  useStates: false,
});

// LegendText with LaTeX string and with the use of states
// NOTE: state "a" and state "b" must e declared as well individually
const text2 = new LegendText("\\int_{a}^{b} x^2\\,dx", {
  color: "#faa307", 
  shape: "circle", 
  useStates: true,
});

As photo:

Result in LegendBox:

Example 2: Add LegendText to LegendBox

As text:

//Add in constructor
const legend = new LegendBox([text1]);

//Add with addElement-method
legend.addElement(text2)

As photo:

Example 3: A larger example

A larger example using both LegendBox and LegendText can be found here under 6. Examples