Skip to content
A repository with examples using mathjax-v3
HTML JavaScript
Branch: master
Clone or download
zorkow Merge pull request #19 from mathjax/issue16
Correct skipStartupTypeset and autoNumber translations.  #16
Latest commit dfb21d8 Sep 12, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
archive/beta.3 Archive old beta.3 files and remote mathjax2 directory May 2, 2019
convert-configuration Make skipStartupTypeset negate its value when transferring to startup… Sep 12, 2019
custom-build Use correct CDN for loading speech rule engine Sep 4, 2019
custom-component Update mathjax path to point to CDN rather than mathjax3 directory Sep 4, 2019
custom-tex-extension Change CDN to jsdelivr Sep 4, 2019
load-mathjax Update address to use https Sep 4, 2019
.gitignore Update to use the mathjax3 npm distribution directly rather than load… Jun 10, 2018
LICENSE update license information Nov 6, 2017
README.md Fix address of converter Sep 4, 2019
assistive-mml.html Change CDN to jsdelivr Sep 4, 2019
assistive-mml.md Change CDN to jsdelivr Sep 4, 2019
customized-load.html Change CDN to jsdelivr Sep 4, 2019
customized-load.md Change CDN to jsdelivr Sep 4, 2019
equation-numbers.html Change CDN to jsdelivr Sep 4, 2019
equation-numbers.md Change CDN to jsdelivr Sep 4, 2019
equation-refs.html Change CDN to jsdelivr Sep 4, 2019
equation-refs.md Change CDN to jsdelivr Sep 4, 2019
input-mml2chtml.html Change CDN to jsdelivr Sep 4, 2019
input-mml2chtml.md Change CDN to jsdelivr Sep 4, 2019
input-mml2svg.html Change CDN to jsdelivr Sep 4, 2019
input-mml2svg.md Change CDN to jsdelivr Sep 4, 2019
input-tex2chtml.html
input-tex2chtml.md Change CDN to jsdelivr Sep 4, 2019
input-tex2mml.html Change CDN to jsdelivr Sep 4, 2019
input-tex2mml.md Change CDN to jsdelivr Sep 4, 2019
input-tex2svg.html Change CDN to jsdelivr Sep 4, 2019
input-tex2svg.md Change CDN to jsdelivr Sep 4, 2019
input-tex_mml2chtml.html Change CDN to jsdelivr Sep 4, 2019
input-tex_mml2chtml.md Change CDN to jsdelivr Sep 4, 2019
input-tex_mml2svg.html Change CDN to jsdelivr Sep 4, 2019
input-tex_mml2svg.md Change CDN to jsdelivr Sep 4, 2019
mml-attribute.html Change CDN to jsdelivr Sep 4, 2019
mml-attribute.md Change CDN to jsdelivr Sep 4, 2019
mml-chtml.html Change CDN to jsdelivr Sep 4, 2019
mml-chtml.md Change CDN to jsdelivr Sep 4, 2019
mml-svg.html Change CDN to jsdelivr Sep 4, 2019
mml-svg.md Change CDN to jsdelivr Sep 4, 2019
package.json
reveal-steps.html Change CDN to jsdelivr Sep 4, 2019
reveal-steps.md Update repositoru name Aug 30, 2019
speech-tex-chtml.html Change CDN to jsdelivr Sep 4, 2019
speech-tex-chtml.md Change CDN to jsdelivr Sep 4, 2019
tex-chtml.html Change CDN to jsdelivr Sep 4, 2019
tex-chtml.md Change CDN to jsdelivr Sep 4, 2019
tex-macros.html Change CDN to jsdelivr Sep 4, 2019
tex-macros.md Change CDN to jsdelivr Sep 4, 2019
tex-mml.html Change CDN to jsdelivr Sep 4, 2019
tex-mml.md Change CDN to jsdelivr Sep 4, 2019
tex-svg.html Change CDN to jsdelivr Sep 4, 2019
tex-svg.md Change CDN to jsdelivr Sep 4, 2019
toggle-steps.html Change CDN to jsdelivr Sep 4, 2019
toggle-steps.md Update repositoru name Aug 30, 2019
v2-color.html Change CDN to jsdelivr Sep 4, 2019
v2-color.md Change CDN to jsdelivr Sep 4, 2019
v2-compatibility.html Change CDN to jsdelivr Sep 4, 2019
v2-compatibility.md Update repositoru name Aug 30, 2019
v2-script-tags.html Change CDN to jsdelivr Sep 4, 2019
v2-script-tags.md Change CDN to jsdelivr Sep 4, 2019

README.md

MathJax-demos-web

A repository with examples using MathJax version 3 in web pages.

See the MathJax Node Demos for examples of how to use MathJax in node applications. See the MathJax documentation for complete details of how to use MathJax in web browsers and node.

Samples of MathJax v3

The examples below show how to use and configure MathJax components in your web pages. The links take you to the documentation for the individual example or to the live demo itself. The last few examples show how to create your own custom components, custom tex extensions, or customized single-file webpacked versions of MathJax.

Processing the Whole Page

Processing User Input

Interaction

Version 2 Compatibility

MathML and Assistive Extensions

Customization

MathJax Component Files

MathJax version 3 has the ability to create MathJax "components" that can be dynamically loaded by MathJax as needed (much as could be done in version 2). This allows portions of MathJax to be bundled together into components that include most or all of what you need to run MathJax, but still allows less-used pieces to be loaded on demand later when needed. This is similar to v2's combined configuration files and TeX extensions.

The main goal of these components is to use them for the delivery of MathJax from the CDNs that host MathJax. This allows you to customize the MathJax components that you use without having to have (as single files on the CDN) every possible combination of parts that anyone would need packaged together. We will provide a number of all-in-one packages that include an input and output jax together with the data for a font to be used, but also will provide separate components for the individual input and output jax, fonts, TeX extensions, and so on, so that you can mix-and-match them as needed.

MathJax components can be used in the browser as well as on the server in node applications, so browser and server-side applications can use the same code base and configurations. Components can be combined together into larger packages, either with other MathJax components, or with your own code, via webpack, for example.

Moreover, the tools for building components are available so that you can create your own custom components that you can serve from your own website if you have special needs not addressed by the CDN. For example, authors writing TeX extensions for MathJa can create their own components that can be loaded into MathJax from a different server even if the core MathJax is loaded from a CDN.

Although components are a convenient way of working with MathJax, those writing node scripts that use MathJax need not use the components as we have packaged them at all; they can continue to import MathJax into their projects directly, as in previous beta versions.

Configuring Components

The component system described above can be configured using a global variable MathJax that you set before loading the main MathJax component that you are planning to use. The MathJax variable specifies configuration blocks for the various components in much the same was as was done in version 2 (this is illustrated in the examples below, and described in more detail in a separate section below). MathJax will modify this global variable to include the methods and data that it creates during the startup process for your use in your applications.

To configure MathJax, use

<script>
MathJax = {
  [options]
};
</script>

before the script tag that loads the MathJax component file you plan to use, where options are a list of options that control various parts of MathJax. The options are grouped into blocks based on the component of MathJax that they affect. For example, the TeX input jax options are in a blocks called 'tex', and the SVG output jax options are in a block called 'svg'. An example configuration could be

<script>
MathJax = {
  tex: {
    inlineMath: [['$', '$'], ['\\(', '\\)']],
    packages: ['base', 'newcommand', 'configMacros']
  },
  svg: {
    fontCache: 'global'
  }
};
</script>

The options are listed in detail in the Configuring MathJax section of the MathJax Documentation.

Converting from Version 2

The structure of the MathJax configuration, and many of the names of the options, have changed from version 2 to version 3. For example, there is no longer a MathJax.Hub.Config() call, but instead, you use a global MathJax variable to set the configuration (this was possible in version 2, but most people used the older Mathjax.Hub.Config() approach).

In order to help you move from version 2 to version 3, there is a configuration converter that will take your old version 2 configuration and give you the corresponding version 3 configuration.

Note that not all options from version 2 are available. Some have not yet been implemented (like line breaking), while others no loner apply (like the options controlling previews).

Obtaining the Components

The component files for these demos are available from several CDN servers, which you can access without having to install or download any files. Just use a link such as

<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

to load the latest version (3.x.x) of the tex-chtml combined component file from the jsdelivr CDN. See the documentation for more details on how to use MathJax in web pages.

Local copies of the MathJax component files can be obtained from the MathJax Component Repository. See its README file for complete information about how to obtain the files.

MathJax Resources

You can’t perform that action at this time.