Coder Social home page Coder Social logo

katex / katex Goto Github PK

View Code? Open in Web Editor NEW
17.7K 280.0 1.2K 79.72 MB

Fast math typesetting for the web.

Home Page: https://katex.org

License: MIT License

JavaScript 85.73% Shell 0.37% CSS 0.82% HTML 2.31% TeX 0.09% Dockerfile 0.13% Less 1.26% Makefile 0.31% Python 1.24% Perl 7.75%
math math-typesetting latex javascript katex

katex's Introduction

npm semantic-release CI codecov Discussions jsDelivr katex.min.js size Gitpod ready-to-code Financial Contributors on Open Collective

KaTeX is a fast, easy-to-use JavaScript library for TeX math rendering on the web.

  • Fast: KaTeX renders its math synchronously and doesn't need to reflow the page. See how it compares to a competitor in this speed test.
  • Print quality: KaTeX's layout is based on Donald Knuth's TeX, the gold standard for math typesetting.
  • Self contained: KaTeX has no dependencies and can easily be bundled with your website resources.
  • Server side rendering: KaTeX produces the same output regardless of browser or environment, so you can pre-render expressions using Node.js and send them as plain HTML.

KaTeX is compatible with all major browsers, including Chrome, Safari, Firefox, Opera, Edge, and IE 11.

KaTeX supports much (but not all) of LaTeX and many LaTeX packages. See the list of supported functions.

Try out KaTeX on the demo page!

Getting started

Starter template

<!DOCTYPE html>
<!-- KaTeX requires the use of the HTML5 doctype. Without it, KaTeX may not render properly -->
<html>
  <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-wcIxkf4k558AjM3Yz3BBFQUbk/zgIYC2R0QpeeYb+TwlBVMrlgLqwRjRtGZiK7ww" crossorigin="anonymous">

    <!-- The loading of KaTeX is deferred to speed up page rendering -->
    <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-hIoBPJpTUs74ddyc4bFZSM1TVlQDA60VBbJS0oA934VSz82sBx1X7kSx2ATBDIyd" crossorigin="anonymous"></script>

    <!-- To automatically render math in text elements, include the auto-render extension: -->
    <script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" integrity="sha384-43gviWU0YVjaDtb/GhzOouOXtZMP/7XUzwPTstBeZFe/+rCMvRwr4yROQP43s0Xk" crossorigin="anonymous"
        onload="renderMathInElement(document.body);"></script>
  </head>
  ...
</html>

You can also download KaTeX and host it yourself.

For details on how to configure auto-render extension, refer to the documentation.

API

Call katex.render to render a TeX expression directly into a DOM element. For example:

katex.render("c = \\pm\\sqrt{a^2 + b^2}", element, {
    throwOnError: false
});

Call katex.renderToString to generate an HTML string of the rendered math, e.g., for server-side rendering. For example:

var html = katex.renderToString("c = \\pm\\sqrt{a^2 + b^2}", {
    throwOnError: false
});
// '<span class="katex">...</span>'

Make sure to include the CSS and font files in both cases. If you are doing all rendering on the server, there is no need to include the JavaScript on the client.

The examples above use the throwOnError: false option, which renders invalid inputs as the TeX source code in red (by default), with the error message as hover text. For other available options, see the API documentation, options documentation, and handling errors documentation.

Demo and Documentation

Learn more about using KaTeX on the website!

Contributors

Code Contributors

This project exists thanks to all the people who contribute code. If you'd like to help, see our guide to contributing code. Code contributors

Financial Contributors

Become a financial contributor and help us sustain our community.

Individuals

Contribute on Open Collective

Organizations

Support this project with your organization. Your logo will show up here with a link to your website.

Organization 1 Organization 2 Organization 3 Organization 4 Organization 5 Organization 6 Organization 7 Organization 8 Organization 9 Organization 10

License

KaTeX is licensed under the MIT License.

katex's People

Contributors

ariabuckles avatar cbreeden avatar ccorn avatar deining avatar dependabot-preview[bot] avatar dependabot[bot] avatar edemaine avatar fabiospampinato avatar gagern avatar greenkeeper[bot] avatar hosseinagha avatar jeffeverett avatar jeresig avatar jremes-foss avatar katex-bot avatar kevinbarabash avatar kohler avatar konn avatar marcianx avatar mathiasbynens avatar mildsunrise avatar renovate[bot] avatar ronkok avatar ruiokada avatar semantic-release-bot avatar sophiebits avatar tabatkins avatar xsznix avatar xymostech avatar ylemkimon avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

katex's Issues

Fix metrics

Our metrics are messed up. Italic correction doesn't work, and some delimiters don't have the right heights.

\mathbb unicode to LaTeX mapping

I thought this list may be helpful for you guys, not sure how to exactly contribute to KaTeX.

"\u2102": "\\mathbb{C}",
"\u210D": "\\mathbb{H}",
"\u2115": "\\mathbb{N}",
"\u2119": "\\mathbb{P}",
"\u211A": "\\mathbb{Q}",
"\u211D": "\\mathbb{R}",
"\u2124": "\\mathbb{Z}",
"\uD538": "\\mathbb{A}",
"\uD539": "\\mathbb{B}",
"\uD53B": "\\mathbb{D}",
"\uD53C": "\\mathbb{E}",
"\uD53D": "\\mathbb{F}",
"\uD53E": "\\mathbb{G}",
"\uD540": "\\mathbb{I}",
"\uD541": "\\mathbb{J}",
"\uD542": "\\mathbb{K}",
"\uD543": "\\mathbb{L}",
"\uD544": "\\mathbb{M}",
"\uD546": "\\mathbb{O}",
"\uD54A": "\\mathbb{S}",
"\uD54B": "\\mathbb{T}",
"\uD54C": "\\mathbb{U}",
"\uD54D": "\\mathbb{V}",
"\uD54E": "\\mathbb{W}",
"\uD54F": "\\mathbb{X}",
"\uD550": "\\mathbb{Y}",
"\uD552": "\\mathbb{a}",
"\uD553": "\\mathbb{b}",
"\uD554": "\\mathbb{c}",
"\uD555": "\\mathbb{d}",
"\uD556": "\\mathbb{e}",
"\uD557": "\\mathbb{f}",
"\uD558": "\\mathbb{g}",
"\uD559": "\\mathbb{h}",
"\uD55A": "\\mathbb{i}",
"\uD55B": "\\mathbb{j}",
"\uD55C": "\\mathbb{k}",
"\uD55D": "\\mathbb{l}",
"\uD55E": "\\mathbb{m}",
"\uD55F": "\\mathbb{n}",
"\uD560": "\\mathbb{o}",
"\uD561": "\\mathbb{p}",
"\uD562": "\\mathbb{q}",
"\uD563": "\\mathbb{r}",
"\uD564": "\\mathbb{s}",
"\uD565": "\\mathbb{t}",
"\uD566": "\\mathbb{u}",
"\uD567": "\\mathbb{v}",
"\uD568": "\\mathbb{w}",
"\uD569": "\\mathbb{x}",
"\uD56A": "\\mathbb{y}",
"\uD56B": "\\mathbb{z}",

\newenvironment

Are there any plans to add support for \newcommand, and \newenvironment?

Ability to typeset all math on a page

Ideally, there would be a drop-in (or close to it) way for people currently using MathJax on their sites to switch to mostly using KaTeX, with MathJax as a fallback (like Khan Academy already does). Two APIs that might be provided:

  1. Render a string into LaTeX at a given place in the DOM
  2. Render all marked up strings (e.g. $e^x$) in a given page into LaTeX.

Exponents sometimes collide with fraction bars

image

Output on right is from latex for comparison. In KaTeX, the -6 \pi and -8 \pi exponents collide with the fraction bars above them. I'm on OS 10.9.4 and I see this issue in both Chrome and Firefox.

Superscript placement doesn't work

Right now, we add a 0.05em margin-left to superscripts and subscripts in order to make things like y' look reasonable. The correct approach to solving this should be found.

Indicate errors instead of showing an empty box

When I use a command that is not supported or have unbalanced braces, KaTeX (at least its demo) won't output anything at all. That is bad for obvious reasons.

Instead, output an informative error message, ideally highlighting unknown commands and parsing the rest for syntactically well-formed expressions, or printing something like "too many {".

Get rid of custom colors

Currently, we have functions like "\blue", which produce things in line with KA exercise colors, but these colors shouldn't be enforced/available for everyone. Instead, we should make a way to dynamically add extensions (like macros maybe).

KaTeX should totally have a CLI

I just saw KaTeX and love it! I usually have Node at the server, but that other project is written in another language (Python) and I'd like to render math from there.

It'd be awesome if this project had a simple CLI, that reads input and renders the HTML to stdout, to easily access KaTeX magic from other environments.

It would be added to package.json:

{
    "bin": "cli.js",
}

So that sudo npm install -g katex would get you a system-wide katex command!
You can then use it from i.e. Python to render math server-side.

import subprocess, io

katex = lambda s: subprocess.check_object('katex', stdin=io.StringIO(s))

katex('a = b \times c')  #--> '<span class="katex"><span class="katex-inner"><span class="strut" style="height:0.69444em;"></span><span class="strut bottom" style="height:0.69444em;vertical-align:0em;"></span><span class="base textstyle uncramped"><span class="mord mathit">a</span><span class="mrel">=</span><span class="mord mathit">b</span><span class="mord mathit">i</span><span class="mord mathit">m</span><span class="mord mathit">e</span><span class="mord mathit">s</span><span class="mord mathit">c</span></span></span></span>'
katex('\pi > 2a') #--> '<span class="katex"><span class="katex-inner"><span class="strut" style="height:0.65952em;"></span><span class="strut bottom" style="height:0.85396em;vertical-align:-0.19444em;"></span><span class="base textstyle uncramped"><span class="mord mathit">p</span><span class="mord mathit">i</span><span class="mrel">&gt;</span><span class="mord">2</span><span class="mord mathit">a</span></span></span></span>'

I can do that, if you agree.

add support for matrices

It would be great to support things like \begin{pmatrix} 1 & 0 \\ 0 & 1 \end{pmatrix} like MathJax does.

reference the TeXbook in js comments

In order to read this code one has to go back and forth between the TeXbook and the code. I think it would go a long way if wherever possible the code were commented saying which rule or page from the TeXbook it is implementing.

If there's a better medium for expressing thoughts like this than "Issues", I'm all ears.

Square root line position is inconsistent (depending on its contents)

This is on a Retina MBP.

The line above the contents of a square root is inconsistently placed. Interestingly, I just tested this on writelatex.com and they have a similar, but not identical, issue.

Some symbols (seemingly dependent on their height and categorization) cause this issue while others do not. All numerical digits cause this issue, along with parentheses. Short letters (like 'a') result in the whole square root dropping, but I think that is expected. Letters like "h" and "l" cause the rendering to be correct, unless a parenthesis is there. It seems like the tallest character determines the behavior.

I'm not sure if the top of the sqrt symbol is supposed to line up perfectly with the horizontal bar, or if there is supposed to be a little tail sticking out there. writelatex.com also has a slight tail sometimes. I don't have a native LaTeX renderer installed, so I can't test that.

KaTeX:
screen shot 2014-09-16 at 6 34 53 pm

(blown up:)
screen shot 2014-09-16 at 6 36 01 pm

writeLaTeX.com: (PDF output)
screen shot 2014-09-16 at 6 33 25 pm

Make KaTeX accessible

Make KaTeX accessible to people with disabilities in particular screen reader users as they are most affected by the current limitations

Add support for alternative math fonts

LaTeX has support for quite a few math fonts/alphabets. #19 references the need for \mathrm (roman fonts), but there are quite a few, as we can see here. The high priority ones, which don't require any nonstandard packages, would probably be:
\mathrm
\mathcal
\mathbb (requires amsfonts/amssymb)
\mathbf

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.