HTML Editor: Graphical Equation

1. About: The Graphical Equation Tool

This is a visual editor that allows you to create mathematical and chemical expressions, using either your keyboard or a set of icons. This tool is good for new users and does most of the formatting work for you. To access it select the Equation button on the toolbar and then select  Graphical Equations.

graphical equation button in the HTML Editor Toolbar

In the window that opens, you can select from any of 10 tabs to build your expression. 

Tip: We recommend building the structure of your equation first, and then adding the numbers and inline notations second.

Depending upon the expression you wish to create, you may have to mix and match characters, symbols, and operators on different tabs.

Note: If you cannot find an icon, click on any of the Expand arrows to open a dropdown menu with more options.

expand arrow
Close

Tab 1: General Equations

This tab allows you to add a template for building equations, and includes editing functions.

tab 1

Includes:

  • Fractions
  • Super and subscripts
  • Dynamic parenthesis and other groupings
  • Binary operations
  • Comparisons
  • Empty sets, infinity, and pi
  • Copy, cut, past, undo and redo
  • Format font
  • Font family and size
  • Righ to left or Arabic ligature
Close

Tab 2: Symbols

This tab gives you access to a variety of symbols, some of which are also available on your keyboard.

tab 2

Includes:

  • Negation operator
  • Plus, minus, forward slash and other basic math symbols
  • Pi, infinity, empty site, and other algebraic symbols
  • Equal signs
  • Greater than, less than and other comparison symbols
  • Set theory symbols
  • Logic symbols
  • Geometry symbols
  • Circled symbols

Close

Tab 3: Arrows

This tab allows you to insert a variety of arrow types into your expression.

tab 3

Includes:

  • Right and left facing arrows, with and without bars
  • Ellipses
  • Dashes
  • Arrows over, under, and between script
  • Vector, arrow, and bar accents
Close

Tab 4: Greek, Latin, and Arabic Characters

This tab allows you to add a variety of  Greek, Latin, Arabic and chemical characters and symbols.

tab 4

Includes:

  • Greek letters
  • Double-struck capital letters
  • Fraktur capitals
  • Script capitals
  • Special characters
  • Arabic numerals
  • Chemical elements
Close

Tab 5: Matrices and Basic Math Operations

Use this tab to build and format matrices, and to set up simple math equations.

tab 5

Includes:

  • Create matrices with bars, brackets, and parentheses
  • Create rows and columns with bars, brackets, and parentheses
  • Add curly brackets and align equations
  • Add ellipses
  • Stack characters for basic math (addition, subtraction, multiplication and division) operations
Close

Tab 6: Scripts and Layout

This tab provides functions for adding scripts or layouts to your equation.

tab 6

Includes:

  • Fractions
  • Roots
  • Super and subscripts
  • Positioning and sizing for elements above and under one another
  • Under and over scripts with braces
  • Big operator layouts
  • Digit, thinner, and back spaces
Close

Tab 7: Decorations

This tab allows you to add fences such as brackets and vertical bars around text fields.

tab 7

Includes:

  • Parentheses, brackets and vertical lines
  • Top and bottom parentheses and brackets
  • Accents
  • Enclosures
  • Strike throughs
Close

Tab 8: Big Operators Tab

This tab includes big operator notations.

tab 8

Includes:

  • Summations
  • Products
  • Scripts
  • Unions
Close

Tab 9: Calculus Equations

Add a template for building calculus equations.

tab 9

Includes:

  • Integrals
  • Differentials and derivatives
  • Limits
  • Vector calculus
  • Trigonometry
Close

Tab 10: Contextual Settings

By default, the contextual tab is empty until you need it.

tab 10

When you place your cursor somewhere in an expression that has extra settings, those settings will appear in the contextual tab. For example, when you create a matrix, and then place your cursor somewhere in that matrix, you will get options in the contextual tab to add lines, alignment, spacing and other formatting to your table.

Close

Back to Top