KaTeX/KaTeX

Fast math typesetting for the web.

Ron Kok

@ronkok

@maths22 It wouldn't hurt to open a issue specifically for \text\AA. Research on this case may help point to a solution.

Jacob Burroughs

@maths22

Khan/KaTeX#1720 has been created

ErickSumargo

@ErickSumargo

@ronkok alright. thank you.

ErickSumargo

@ErickSumargo

@ronkok also, i'm struggling to make new line(s) when in inline-text mode.
display-mode has no prob thx to:
\begin {aligned}
... \
\end {aligned}

but how to in inline-mode or just some ordinary paragraphs?

Ron Kok

@ronkok

@ErickSumargo The {aligned} environment works in either display mode or inline mode. Also, KaTeX versions 10+ recognize \\ or \newline as hard line breaks for inline math. That is a pretty recent release. Some platforms have not updated to it yet.

Correction: versions 0.10+

ErickSumargo

@ErickSumargo

@ronkok tq for the information. But how about just ordinary paragraph? Say i have:

"Lorem ipsum dolor sit \(amet\), consectetur adipiscing elit, \\
sed do eiusmod tempor \(incididunt ut labore\) et dolore magna aliqua."

Ofc katex won't detect \\ besides "elit,". So how do i break line in just ordinary paragraph?

Ron Kok

@ronkok

@ErickSumargo The purpose of KaTeX is to bring the math capabilities of TeX to the web. The math of TeX, not all of TeX. If you are writing general narrative in KaTeX, you are using it for a purpose it was not designed to do. I would suggest falling back onto HTML or Markdown. They are built from the ground up to handle paragraphs.

ErickSumargo

@ErickSumargo

@ronkok very clear. thank you.

Kevin Deguzman

@deguzmankevin

👋 Hi everyone! I'm still fairly new to contributing to open source, so I was trying to tackle this small issue
(Khan/KaTeX#1681) of adding a favicon. I was able to set up the interactive editor, but can't quite figure out how to set up the KaTex server to check if what I added looks okay. I would really appreciate any help with this! :)

thaiqi2000

@thaiqi2000

Hello, Everyone! I am new to javascript development, so this may be a silly question: why need I use "yarn build" to produce distributed js code? That is: what's the relation between the js codes before and after?

Ron Kok

@ronkok

@thaiqi2000 The KaTeX JavaScript source code is contained in 78 separate files (modules). A package manager like npm or yarn will help you assemble modules and keep them updated. Both npm and yarnwill also run scripts. When run at the KaTeX root level, the yarn build script will tell the webpack utility to bundle all 78 files into a single file for distribution.

thaiqi2000

@thaiqi2000

@ronkok Thanks for being so kind to answer my question!

Kevin Barabash

@kevinbarabash

@deguzmankevin we use docusaurus for our documentation. It looks like there's a way to set the favicon in siteConfig.js, see https://docusaurus.io/docs/en/1.0.12/site-config. I don't actually know how to run the website locally, but you create a PR, netlify we deploy a version of the website based on your PR so that's one way that you check that things are working.

@deguzmankevin found it. You can test the website locally by going into the website folder, running yarn, followed by yarn start.

Nathan Clonts

@kokopelli314

@kevinbarabash For the local website development, running npm start in the website folder did the trick for me.

Magnus Lie Hetland

@mlhetland

Hi! In much of my LaTeX, I use sort of a “semi-French” style, with upright capitals. I’ve been able to set this up in LaTeX and in MathJax, but I’d like to use KaTeX – and I can’t quite find a way to do it. (Without using \mathrm or the like all over the place.) Any suggestions?

Ron Kok

@ronkok

@mlhetland Perhaps a set of macros would help? For instance, \gdef\A{\TextOrMath{A}{\mathrm{A}}} would define \A to behave as an upright capital A.

Magnus Lie Hetland

@mlhetland

That is one solution, sure. Whas I was looking for was primarily a way of changing the style globally, as some LaTeX font packages allow you to (with a switch). In LaTeX I use

 \count@=`A \advance\count@\m@ne
    \@whilenum\count@<`Z\do{%
      \advance\count@\@ne
      \begingroup\uccode`a=\count@
      \uppercase{\endgroup\DeclareMathSymbol{a}}{\mathalpha}{operators}{\count@}%
    }

(From http://tex.stackexchange.com/questions/251225)
And in MathJax I use

(function () {
  var MML
  MathJax.Hub.Register.StartupHook("mml Jax Ready",function () {
    MML = MathJax.ElementJax.mml
  });
  MathJax.Hub.Register.StartupHook("TeX Jax Ready",function () {
    var TEX = MathJax.InputJax.TeX

    var capitals = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"

    for (var i = 0; i < capitals.length; i++) {
        TEX.Definitions.special[capitals[i]] = "frenchStyle"
    }

    TEX.Parse.Augment({
      frenchStyle: function (c) {
        this.Push(this.mmlToken(MML.mi(c).With({mathvariant:MML.VARIANT.NORMAL})))
      }
    });
  });
})();

(Based on https://stackoverflow.com/questions/32814507)
Kind of hacky, I guess, but both solutions work. I was just hoping to find something similar for KaTeX.

Ron Kok

@ronkok

KaTeX macros that don't use a backslash could be written as ``

A set of KaTeX macros that don't use a backslash could be written at \gdef A{{\char65}}, \gdef B{{\char66}}, etc. If you don't want to write those macros into each document, you can write them in the rendering options

Ron Kok

@ronkok

Also,katex.js exposes the defineMacro function. So you could write your set of macros in a separate file. Say we call it frenchmath.js. That file would go into the same folder as katex.js. The HTML document would include in its <head> a line saying <script src="frenchmath.js"></script>, placed after the call to katex.js, and the french math file would contain a set of macros, each resembling:

katex.__defineMacro("A", function(context) {
  return "{\\char 65}"
});

Magnus Lie Hetland

@mlhetland

Ah! I see now that the documentation for the rendering option mentions the single character use. This all looks perfect – except it seems I'm using KaTeX the wrong way, so I can't get any of this to work. I'm using the minified version, which I guess maybe means __defineMacro isn't available…? (At least I'm told it's not a function.) Trying to use \gdef inside formulas gives me an error, and the display options don't seem to do much. (The displayMode option, for example, doesn't change mode, so I've used \displaystyle as a workaround.) I'm using it with Jekyll and Kramdown, and essentially followed the setup here, which I guess may be not altogether sound:
https://xuc.me/blog/katex-and-jekyll/
I mean, it works for normal use, but the fact that I can't get the above things to work is probably a sign that I should be doing things differently :->

Eh … I realize I'm using 0.1.1, while the current version is 0.10.0 xD OK, I'll have another go.

Magnus Lie Hetland

@mlhetland

Hah! Now it works perfectly. Thanks a lot!

Magnus Lie Hetland

@mlhetland

Back with another question … I'm typesetting figures in TikZ and converting them to SVG (using pdf2svg), and using them alongside KaTeX in the main text – and I haven't been able to figure out a proper combination of font sizes and scaling (in my TikZ/pdflatex) to emulate the look of KaTeX. It seems (for example) subscripts in KaTeX have the same design as normal-sized text, and are just scaled down? And beside that, everything looks more solid/black – and I don't think it's just a matter of SVG rendering (though I may be wrong).

See, e.g., https://algdat.idi.ntnu.no/faq/2018/11/15/p-np-npc-nph-og-reduksjoner.html

(The scaling might not be perfect either, but that's easier to fix.)

In part, it does seem like the SVG rendering is too wispy, in and of itself – like, e.g., the capacities in these flow networks:
https://algdat.idi.ntnu.no/faq/2018/11/07/kapasitets-og-flytokning.html

I've tried just using smaller font sizes (which tend to be blacker) and scaling them up (in the PDF/SVG), but then, of course, the letter shapes start looking a bit off.

Any thoughts of harmonizing the looks of the KaTeX math and the figures? (I could use a completely different, blacker font in the SVG, but that won't exactly make things more harmonious…)

Alexandre Bléron

@ennis

Hi, I want to change the style of a particular element within a katex equation when hovering over it. Is it possible to do that?

Alexandre Bléron

@ennis

i guess what i really want is KaTeX/KaTeX#90

Michael Ekstrand

@mdekstrand

Are there browser detection things KaTeX is doing that cause it to produce different HTML in the browser than in Node?

In the browser, it is rendering fractions with an SVG element for the horizontal bar. In Node, renderToText produces span elements with borders that wind up not being displayed correctly.

I have tested renderToText in the console in the browser, and it produces the SVG version

Gleb Mazovetskiy

@glebm

@mdekstrand Are you sure it's the same version of KaTeX?

console.log(`KaTeX version: ${katex.version}`)

Michael Ekstrand

@mdekstrand

Yes, I just confirmed it with the same KaTeX version.

input: \frac{\mathrm{TP}}{\mathrm{TP}+\mathrm{FN}}

browser output:

"<span class=\"katex\"><span class=\"katex-mathml\"><math><semantics><mrow><mfrac><mrow><mrow><mi mathvariant=\"normal\">T</mi><mi mathvariant=\"normal\">P</mi></mrow></mrow><mrow><mrow><mi mathvariant=\"normal\">T</mi><mi mathvariant=\"normal\">P</mi></mrow><mo>+</mo><mrow><mi mathvariant=\"normal\">F</mi><mi mathvariant=\"normal\">N</mi></mrow></mrow></mfrac></mrow><annotation encoding=\"application/x-tex\">\\frac{\\mathrm{TP}}{\\mathrm{TP}+\\mathrm{FN}}</annotation></semantics></math></span><span class=\"katex-html\" aria-hidden=\"true\"><span class=\"strut\" style=\"height:0.872331em;\"></span><span class=\"strut bottom\" style=\"height:1.275662em;vertical-align:-0.403331em;\"></span><span class=\"base\"><span class=\"mord\"><span class=\"mopen nulldelimiter\"></span><span class=\"mfrac\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\" style=\"height:0.872331em;\"><span style=\"top:-2.655em;\"><span class=\"pstrut\" style=\"height:3em;\"></span><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\"><span class=\"mord mtight\"><span class=\"mord mathrm mtight\">T</span><span class=\"mord mathrm mtight\">P</span></span><span class=\"mbin mtight\">+</span><span class=\"mord mtight\"><span class=\"mord mathrm mtight\">F</span><span class=\"mord mathrm mtight\">N</span></span></span></span></span><span style=\"top:-3.15em;\"><span class=\"pstrut\" style=\"height:3em;\"></span><span class=\"stretchy\" style=\"height:0.2em;\"><svg width='400em' height='0.2em' viewBox='0 0 400000 200' preserveAspectRatio='xMinYMin slice'><path d='M0 80H400000 v40H0z M0 80H400000 v40H0z'/></svg></span></span><span style=\"top:-3.394em;\"><span class=\"pstrut\" style=\"height:3em;\"></span><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\"><span class=\"mord mtight\"><span class=\"mord mathrm mtight\">T</span><span class=\"mord mathrm mtight\">P</span></span></span></span></span></span><span class=\"vlist-s\"></span></span><span class=\"vlist-r\"><span class=\"vlist\" style=\"height:0.403331em;\"></span></span></span></span><span class=\"mclose nulldelimiter\"></span></span></span></span></span>"

(Firefox)

node output:

'<span class="katex"><span class="katex-mathml"><math><semantics><mrow><mfrac><mrow><mi mathvariant="normal">T</mi><mi mathvariant="normal">P</mi></mrow><mrow><mrow><mi mathvariant="normal">T</mi><mi mathvariant="normal">P</mi></mrow><mo>+</mo><mrow><mi mathvariant="normal">F</mi><mi mathvariant="normal">N</mi></mrow></mrow></mfrac></mrow><annotation encoding="application/x-tex">\\frac{\\mathrm{TP}}{\\mathrm{TP}+\\mathrm{FN}}</annotation></semantics></math></span><span class="katex-html" aria-hidden="true"><span class="base"><span class="strut" style="height:1.275662em;vertical-align:-0.403331em;"></span><span class="mord"><span class="mopen nulldelimiter"></span><span class="mfrac"><span class="vlist-t vlist-t2"><span class="vlist-r"><span class="vlist" style="height:0.872331em;"><span style="top:-2.655em;"><span class="pstrut" style="height:3em;"></span><span class="sizing reset-size6 size3 mtight"><span class="mord mtight"><span class="mord mtight"><span class="mord mathrm mtight">T</span><span class="mord mathrm mtight">P</span></span><span class="mbin mtight">+</span><span class="mord mtight"><span class="mord mathrm mtight">F</span><span class="mord mathrm mtight">N</span></span></span></span></span><span style="top:-3.23em;"><span class="pstrut" style="height:3em;"></span><span class="frac-line" style="border-bottom-width:0.04em;"></span></span><span style="top:-3.394em;"><span class="pstrut" style="height:3em;"></span><span class="sizing reset-size6 size3 mtight"><span class="mord mtight"><span class="mord mtight"><span class="mord mathrm mtight">T</span><span class="mord mathrm mtight">P</span></span></span></span></span></span><span class="vlist-s"></span></span><span class="vlist-r"><span class="vlist" style="height:0.403331em;"><span></span></span></span></span></span><span class="mclose nulldelimiter"></span></span></span></span></span>'

Michael Ekstrand

@mdekstrand

data point: Chrome produces the same output as Node.

Eric Eastwood

@MadLittleMods

We updated Gitter to use the latest katex@0.10.0, gitlab-org/gitter/webapp!1308

You can test it out on Gitter next/staging, https://next.gitter.im/ (part of Gitter 19.32.0)

If you see anything wrong, feel free to create an issue, https://gitlab.com/gitlab-org/gitter/webapp/issues

deadmorous

@deadmorous

Hi, I'm trying to build KaTeX and it fails.

What I did is this:

git clone git@github.com:KaTeX/KaTeX.git
cd KaTeX/
npm install
npm run build

and the build output started as follows:

$ npm run build

> katex@0.10.1-pre build /home/username/KaTeX
> yarn prestart && rimraf dist/ && mkdirp dist && cp README.md dist && rollup -c && webpack

yarn run v1.13.0
$ yarn check && node src/unicodeMake.js
info fsevents@1.2.4: The platform "linux" is incompatible with this module.
info "fsevents@1.2.4" is an optional dependency and failed compatibility check. Excluding it from installation.
error "@babel/generator" is wrong version: expected "7.0.0", got "7.3.0"
error "@babel/helper-function-name" is wrong version: expected "7.0.0", got "7.1.0"
error "@babel/parser" is wrong version: expected "7.0.0", got "7.3.1"
...

The same failure occurs when I run yarn build.

What am I doing wrong? I have node version v8.10.0, npm version 3.5.2, and yarn version 1.13.0. And current KaTeX commit is 7f778d1543fc1a9021609fa29067073658fb0d4b.

Rains

@Rainylane

KaTeX在HTML中，超出元素宽度部分如何自动换行

ZhangMJ

@zmj97

Hi, I'm trying to use auto-render with making strict option false, my onload is onload="renderMathInElement(document.body, {strict: false});", but I still got console warn like 'LaTeX-incompatible input and strict mode is set to 'warn'', wht I got this and how could I fix it?

kszucher

@kszucher

Hi, how can I get the size of a rendered equation???

kszucher

@kszucher

i mean the dimensions of a bounding box

Alex J Best

@alexjbest

Hi, is there any idea when 0.10.2 will be released? KaTeX/katex-fonts#60 is pretty bad for us as safari users are being told that not equal things are actually equal! So a hotfix release with this in would be great. Thanks

Where communities thrive

People

Repo info

Activity