Skip to content

Line Breaking problems

Jump to bottom Edit New page
Davide P. Cervone edited this page May 26, 2013 · 2 revisions

From https://groups.google.com/d/msg/mathjax-users/Uaaht3cGJu8/NYRSFo4uxYAJ

I've reformatted my web site so that it works better for small screens, like those of mobile devices. Since this reformatting caused the right of long equations to disappear off the screen, I was happy to discover that MathJax has a line breaking option. In using this option, I came across a few problems and have some requests. I'm using the tex input jax.

  1. When using \left( .... \right), the parentheses disappear when the equation is wrapped. Of course, having these delimiters on separate lines doesn't work in Latex. But it is an unexpected consequence. I know a few workarounds, such as using \Biggl( ... \Biggr), but it is surprising to have parentheses disappear, and I doubt I will catch all the cases where this will happen.

  2. At least for FF 12 on Ubuntu, the wrapping doesn't take into account equation numbers, so the equation numbers sometimes overlap with the equation for certain width screens.

  3. Is it feasible to eventually have a way to suggest line breaks with the tex input jax? For example, I'd be nice to have it selectively break at the = signs and not break between sequential \int's. It seems my only option now is to learn how to write the equations in MathML.

  4. If it is eventually possible to suggest line breaks, a great feature would be to have an option in the "line break suggestion tag" that causes MathJax to insert a character when the line break occurs. In many cases, I'd want the equation to have a \times after the line break.

Thanks, Duane

30/05/2012

Just after writing this message, I noticed another problem. The left and right of the last equation of this page gets cut off on an ipad touch, or when I make the screen about that width using FF 12 on Ubuntu. Other equations on the page are also cut off at different screen widths. They all appear to be using the align* environment.

Duane

  1. When using \left( .... \right), the parentheses disappear when the equation is wrapped. Of course, having these delimiters on separate lines doesn't work in Latex. But it is an unexpected consequence. I know a few workarounds, such as using \Biggl( ... \Biggr), but it is surprising to have parentheses disappear, and I
    doubt I will catch all the cases where this will happen.

OK, thanks. This is a bug with the linebreaking of <mfenced> elements, and will have to be fixed. I have opened an issue tracker for it.

  1. At least for FF 12 on Ubuntu, the wrapping doesn't take into account equation numbers, so the equation numbers sometimes overlap with the equation for certain width screens.

There are still things to be added to the line breaking algorithm. One of them is that entries in tables aren't broken unless the entry is too wide all by itself (the other columns aren't taken into account). This is pertinent because labeled equations are handled as a table with one row, and that means the cell containing the main equation doesn't take the label into account at the moment.

On the other hand, if most of your equations are numbered, you could set the width for line wrapping to something smaller than 100%. For example

<script type="text/x-mathjax-config"> 
MathJax.Hub.Config({ 
  "HTML-CSS": { linebreaks: { automatic: true, width: "75% container" } }, 
  "SVG": { linebreaks: { automatic: true, width: "75% container" } } 
}); 
</script>

would cause the linebreaks to occur at 75% of the full width of the page, which should give you room for the equation numbers.

  1. Is it feasible to eventually have a way to suggest line breaks with the tex input jax? For example, I'd be nice to have it selectively break at the = signs and not break between sequential \int's. It seems my only option now is to learn how to write the equations in MathML.

Well, you could define some macros like the following

<script type="text/x-mathjax-config"> 
MathJax.Hub.Config({ 
  TeX: { 
    Macros: { 
      goodbreak: '\\mmlToken{mo}[linebreak="goodbreak"]{}', 
      badbreak: ['\\mmlToken{mo}[linebreak="nobreak"]{#1}',1], 
      nobreak: ['\\mmlToken{mo}[linebreak="nobreak"]{#1}',1], 
      invisibletimes: ['\\mmlToken{mo}{\u2062}'] 
    } 
  } 
}); 
</script>

Here you an use \goodbreak to indicate a position that is a good breakpoint. The \badbreak and \nobreak macros are a little different; they take an argument which is the operator where the break is to be discouraged or prevented. The parameter is treated as text (i.e., not further processed as TeX macros), so \badbreak{+} would make a plus sign where there should not be a break unless really needed, and \nobreak{+} would be one where a break should not be allowed.

The line-breaking algorithm takes nesting levels into account, so if you but braces around some terms, that will discourage MathJax from breaking within those braces. E.g.

a + b + c + { \int_0^1\!\!\!\int_0^1 x y\, dxdy } + d + e

would be unlikely to break between the integral signs.

  1. If it is eventually possible to suggest line breaks, a great feature would be to have an option in the "line break suggestion tag" that causes MathJax to insert a character when the line break occurs. In many cases, I'd want the equation to have a \times after the line break.

The MathML3 specification includes the ability to duplicate an operator at the linebreak, and to provide a visible character to use when a break occurs at an invisible times, so those are the only possible effects that MathJax could provide, since it must be able to represent everything it does in MathML somehow. Unfortunately, neither of these are currently implemented (as I said, there is still more work to be done with line breaking). I have provided an \invisibletimes macro above so that you can use that to provide appropriate locations for linebreaks at multiplication. Note that MathJax's TeX input jax doesn't insert them itself.

These don't completely solve your issues, but I hope it helps.

Davide

Thanks, Davide, those responses were helpful.

Regarding changing the width: "75% container" parameter: I don't know if it is the CSS I'm using, something having to do with Firefox, or a bug in Mathjax, but it seems that the container used for determining line breaks does not scale accurately as I decrease the window width. It turns out that, in the above referenced page, a major source of the problems with no line breaks had to do with Mathjax calculating the width as too wide for the narrow screen. What I did was bring the width down to "60% container" and then the equations would be wrapped at window width at the small widths. They are wrapped at a smaller percentage of the window width when the window is wider (I don't know when it approaches the 60% specified). I don't have access to an iPod now, but this behavior is consistent to what I remember seeing in Safari on an iPod. I bet that the math will be wrapped around the screen width in an iPod now that I put the 60% there. (I am reloading the page after changing window widths.)

For the macro you mentioned, I'm sure you meant to have badbreak lead to the MathML badbreak, as in:

<script type="text/x-mathjax-config"> 
MathJax.Hub.Config({ 
  TeX: { 
    Macros: { 
      goodbreak: '\\mmlToken{mo}[linebreak="goodbreak"]{}', 
      badbreak: ['\\mmlToken{mo}[linebreak="badbreak"]{#1}',1], 
      nobreak: ['\\mmlToken{mo}[linebreak="nobreak"]{#1}',1], 
      invisibletimes: ['\\mmlToken{mo}{\u2062}'] 
    } 
  } 
}); 
</script>

I assume that badbreak and nobreak discourage breaks on either side of the operator.

If I wanted to do a \badbreak{\cdot}, what would I replace the \cdot with to get the dot for multiplication, given that the tex input jax doesn't process the text?

The MathML3 specification includes the ability to duplicate an operator at the linebreak, and to provide a visible character to use when a break occurs at an invisible times, so those are the only possible effects that MathJax could provide.

Those effects would cover this situations I've thought of, so it would be a useful addition if and when Mathjax implements them.

These don't completely solve your issues, but I hope it helps.

It definitely helped. Thanks,

Duane

Regarding changing the width: "75% container" parameter: I don't know if it is the CSS I'm using, something having to do with Firefox, or a bug in Mathjax, but it seems that the container used for determining line breaks does not scale accurately as I decrease the window width. It turns out that, in the above referenced page, a major source of the problems with no line breaks had to do with Mathjax calculating the width as too wide for the narrow screen. What I did was bring the width down to "60% container" and then the equations would be wrapped at window width at the small widths. They are wrapped at a smaller percentage of the window width when the window is wider (I don't know when it approaches the 60% specified). I don't have access to an iPod now, but this behavior is consistent to what I remember seeing in Safari on an iPod. I bet that the math will be wrapped around the screen width in an iPod now that I put the 60% there. (I am reloading the page after changing window widths.)

It may be that the un-typeset mathematics in the page is making the width of the document wider than the screen (at least temporarily until the math is typeset). So the width of the container is extra wide in those cases. Depending on your layout, you might be able to specify just "75%" to get 75% of the window width (as opposed to the container width). If you aren't using sidebars or floating elements, that might work better for you. You can also specify a fixed width as "30em" or "800px" or whatever if that works for you.

For the macro you mentioned, I'm sure you meant to have badbreak
lead to the MathML badbreak, as in:

<script type="text/x-mathjax-config"> 
MathJax.Hub.Config({ 
  TeX: { 
    Macros: { 
      goodbreak: '\\mmlToken{mo}[linebreak="goodbreak"]{}', 
      badbreak: ['\\mmlToken{mo}[linebreak="badbreak"]{#1}',1], 
      nobreak: ['\\mmlToken{mo}[linebreak="nobreak"]{#1}',1], 
      invisibletimes: ['\\mmlToken{mo}{\u2062}'] 
    } 
  } 
}); 
</script>

Quite right. Sorry for the typo, but glad you corrected it.

I assume that badbreak and nobreak discourage breaks on either side of the operator.

Yes, but if there is another operator before or following it, that could allow a break. E.g., \nobreak{+}+ could still break between the pluses because the second one allows breaks.

If I wanted to do a \badbreak{\cdot}, what would I replace the \cdot with to get the dot for multiplication, given that the tex input jax doesn't process the text?

If you are creating your HTML files directly, then \badbreak{&#x22C5;} should work, but if you are using a CMS it might not allow you to enter entities in this way. You might need to enter the unicode character directly. Alternatively, you can add

CDOT: '\\badbreak{\u22C5}'

to the Macros list above to make \CDOT be a cdot with a bad break marker.

The MathML3 specification includes the ability to duplicate an operator at the linebreak, and to provide a visible character to use when a break occurs at an invisible times, so those are the only possible effects that MathJax could provide

Those effects would cover this situations I've thought of, so it would be a useful addition if and when Mathjax implements them.

They are on the list of improvements to implement when we can.

Davide

Add a custom sidebar
Clone this wiki locally