mathjax / MathJax-node

MathJax for Node
Apache License 2.0
614 stars 96 forks source link

CJK characters overlap #424

Closed Ir1d closed 6 years ago

Ir1d commented 6 years ago

Hi, I'm getting this result, the chinese characters overlap with each other.

image

I manually tried editing cjkCharWidth, but it doesn't work.

It seems that there is something wrong with scaling. I've got scale at 71.759, while at client-side mathjax I get 51.054 (which displays correctly).

demo page: https://new.oi-wiki.org/OI-wiki/site/string/sam/#endpos correct display: https://oi-wiki.org/string/sam/#endpos

mathjax:

\begin{cases}
    endpos(w)\subseteq endpos(u)&\text{若 $u$ 为 $w$ 的一个后缀}\\
    endpos(w)\cap endpos(u)=\emptyset&\text{另一种情况}\\
  \end{cases}

I wonder how to fix this, thx in advance.

dpvc commented 6 years ago

In the browser, MathJax can measure the width of glyphs that are not in its own fonts, but that is not possible in mathjax-node, which doesn't have an actual DOM in which those measurements can be made. So mathjax-node takes a guess at the size. The actual size used will depend on the ex-size that you specify in your call to mathjax-node (the default size is 6px per em), but depending on how this matches the ex-size of the surrounding font, this might not be correct. You should true using ex: 5 in your call to mathjax-node and see if that improves the situation for you.

Note that for glyphs that aren't in the MathJax fonts, mathjax-node must rely on the system fonts installed on the reader's computer. These may or may not match the ones you are using yourself, so in such situations, the results may not be consistent from user to user.

Ir1d commented 6 years ago

@dpvc Thx for replying!

I changed to ex: 7, cjkCharWidth: 16 and resulted pretty good. (no overlap now)

As far as I know, ex is used for scaling and cjkCharWidth is used for changing Width between charaters, is that correct?

mathjax-node must rely on the system fonts installed on the reader's computer.

I wonder if I manually change this line, is it the same with specifying undefinedFamily in svg config in mathjax ?

I changed that line to "STIXGeneral,'Arial Unicode MS',serif" and I found the resulted scaling was different from using original "monospace".

dpvc commented 6 years ago

As far as I know, ex is used for scaling and cjkCharWidth is used for changing Width between charaters, is that correct?

'ex' specifies the ex-height (in pixels) of the surrounding font, so that absolute units like px can be properly determined. This is also used to properly scale characters that are not in the MathJax fonts so that they will be the proper size in relation to the rest of the math.

cjkCharWidth tells MathJax the width (in pixels) of the monospaced CJK characters. Changing this does affect the spacing between characters in the sense that MathJax will reserve this amount of space regardless of the actual size of the font used, so if it is larger than the actual font, that will end up adding space.

I wonder if I manually change this line, is it the same with specifying undefinedFamily in svg config in mathjax ?

It is, but you should not do it. Since mathjax-node can't measure the widths of the characters, it is important that you use a monospaced font, because it assumes every character is the same width. If you use a variable-width font (like STIXGeneral, Arial Unicode MS, or serif), then the spacing reserved by MathJax will likely be badly off from the actual font used, and how badly off it is will vary from character to character.

Ir1d commented 6 years ago

Thank you so much!