MathJax icon indicating copy to clipboard operation
MathJax copied to clipboard

Unexpected SVG output for `\multiline` environment

Open dmca-glasgow opened this issue 4 months ago • 3 comments

Using MathJax v4 (node direct method), given a multiline environment:

\begin{multline*}
a \\ b
\end{multline*}

I noticed using the 2 new and useful demo pages for SVG and CHTML the behaviour is different when resizing the browser window— the CHTML version has a fluid width but the SVG version has a fixed width.

I came across this behaviour when using SVG rendering in my project, with abnormally scaled maths here:

Image

I think the problem is I need to tell MathJax what the appropriate line width is, and potentially re-render on window resize.

Would switching to the CHTML renderer solve this issue without having to re-render on resize? Are there any other pros and cons to using the CHTML renderer instead?

Thanks.

dmca-glasgow avatar Sep 08 '25 14:09 dmca-glasgow

I noticed ... the behaviour is different when resizing the browser window— the CHTML version has a fluid width but the SVG version has a fixed width.

Yes, that is correct. The size of SVG output is fixed at the size it was when originally typeset (except for expressions with tags, as the tags do float with the window size). While it might be possible to handle the multlined environment by putting each line into a separate SVG element, that is not currently being done, and would make things more complicated internally.

I'm marking this as a feature request for potential future action.

Would switching to the CHTML renderer solve this issue without having to re-render on resize?

Yes. The CHTML output changes size along with the container.

Are there any other pros and cons to using the CHTML renderer instead?

Pros: The CHTML output can be selected for copying (though I question the usefulness of that, as it is just the text and not the layout). The CHTML output can be more easily styled by CSS.

Cons: There are browser bugs and difference that can affect the CHTML output (e.g., Safari doesn't always get the baseline alignment correct). The SVG output is more reliable in its layout in that respect.

dpvc avatar Sep 10 '25 11:09 dpvc

Thanks for the info @dpvc :)

One last question about CHTML vs SVG... will the new overflow: linebreak automatically occur for long expressions with CHTML on window resize? Or in that scenario will I need to re-render like SVG?

dmca-glasgow avatar Sep 10 '25 11:09 dmca-glasgow

will the new overflow: linebreak automatically occur for long expressions with CHTML on window resize?

No. Neither output jax re-computes the line breaks on window changes.

dpvc avatar Sep 10 '25 11:09 dpvc