MathLive: Math Input Made Easy
Try it at mathlive.io.
|
|
|
Render math equations by adding a two lines to your web page.
<!DOCTYPE html>
<html lang="en-US">
<body>
<h1>Euler's Identity</h1>
<p>$$e^{i\pi} + 1 = 0$$</p>
<script type="module">
import MathLive from 'https://unpkg.com/mathlive/dist/mathlive.mjs';
MathLive.renderMathInDocument();
</script>
</body>
</html>
You can also incorporate a “mathfield” to edit math just like you would edit text. The MathLive APIs allow you to interact with the mathfield, including extracting its content, inserting placeholders and more.
<!DOCTYPE html>
<html lang="en-US">
<body>
<div id="mathfield">f(x)=</div>
<script type="module">
import MathLive from 'https://unpkg.com/mathlive/dist/mathlive.mjs';
MathLive.makeMathField('mathfield');
</script>
</body>
</html>
This project is licensed under the MIT License.
0.53.3 2020-06-24
#504 "Spacing is inconsistent after editing"
The spacing of operators should be adjusted depending on what's around them: there is less space after a "-" sign when used as an infix operator than there is around a "-" sign used as a prefix operator (i.e. "-4" vs "3-4").
The code that was handling this was accounting for it by modifying the type of the element. This worked well enough for static rendering, but for dynamic rendering (i.e. editing), once modified the previous type of the element was lost and could not be restored (i.e. after deleting the atom in front of a "-" sign, the "-" was no longer a binary operator but a regular symbol).
This is now handled during layout without modifying the type of the element.
Workaround for a Safari bug where in some cases the caret would not blink.
#505 More consistent spacing between elements. Previously some Unicode math spacing characters were used. However, these characters are not rendered consistently. Switched to using CSS margins instead.
The LaTeX generated for a \left command with another command as a fence was
lacking a space, e.g. \left\lbracka\right\rbrack instead of
\left\lbrack a\right\rbrack
Smart fence for square brackets was not working correctly.
Fixed smartmode to avoid converting a decimal point to text when entering, e.g. "314.1576"
The alt/option+V shortcut now correctly inserts a placeholder in the square root
The "\arcos" function was incorrectly spelled "\arccos".
#508 In order to better support some deployment configurations, added a 'mathlive-fonts.css' file to the distribution package.
This is intended to be used by build/bundle environments that have an asset pipeline that can move/rename assets, including the font-files
Note that this method is not recommended. It will result in some cases where the layout is incorrect until the page is reloaded (especially for formulas using large symbols such as integrals or large parentheses).
To use it, add the following to the web pages using MathLive:
<link rel="stylesheet" href="dist/mathlive-fonts.css" />
FAQs
A web component for math input
The npm package mathlive receives a total of 37,100 weekly downloads. As such, mathlive popularity was classified as popular.
We found that mathlive demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
A malicious npm package disguised as a WhatsApp client is exploiting authentication flows with a remote kill switch to exfiltrate data and destroy files.
Security News
PyPI now supports digital attestations, enhancing security and trust by allowing package maintainers to verify the authenticity of Python packages.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.