JSPM

  • Created
  • Published
  • Downloads 44706
  • Score
    100M100P100Q144144F
  • License MIT

Render and edit beautifully typeset math

Package Exports

  • mathlive
  • mathlive/dist/mathlive.core.css
  • mathlive/dist/mathlive.css
  • mathlive/dist/mathlive.mjs

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (mathlive) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

math live

Maintenance GitHub license

Build Status Greenkeeper badge David

Screenshot

MathLive is a JavaScript library to render and edit math.

  • Fast and small
  • Tex-quality typesetting
  • Easy to use interface for math editing
  • Works great on desktop and on mobile devices thanks to an extensive set of virtual keyboards.
  • Comprehensive APIs, including generation of LaTeX, MathML and Abstract Syntax Tree (MASTON)
  • And it is easy to customize to your needs!

Try it at mathlive.io!

The popover panel A Virtual Keyboard
The Loop Equation

How To Use MathLive

To display math

You can use MathLive to simply render math equations by adding a few lines to your web page.

<!doctype html><html lang="en-US">
<head>
    ...
    <link rel="stylesheet" href="mathlive.core.css">
    <link rel="stylesheet" href="mathlive.css">
</head>
<body>
    <h1>Euler's Identity</h1>
    <p>$$e^{i\pi} + 1 = 0$$</p> 

    <script type='module'> 
        import MathLive from 'dist/mathlive.mjs';
        MathLive.renderMathInDocument();
    </script>
</body>
</html>

To edit math

You can also incorporate a “math field” to edit math just like you would edit text. The MathLive APIs allow you to interact with the math field, including extracting its content, inserting placeholders and more.

<!doctype html><html lang="en-US">
<head>
    ...
    <link rel="stylesheet" href="mathlive/mathlive.core.css">
    <link rel="stylesheet" href="mathlive/mathlive.css">
</head>
<body>
    <div id='mathfield'>f(x)=</div>

    <script type='module'> 
        import MathLive from 'dist/mathlive.mjs';
        MathLive.makeMathField('mathfield');
    </script>
</body>
</html>

How You Can Help

More Questions?

License

This project is licensed under the MIT License.