Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

line breaking in MathML (V4) #3188

Open
leberman opened this issue Feb 20, 2024 · 2 comments
Open

line breaking in MathML (V4) #3188

leberman opened this issue Feb 20, 2024 · 2 comments
Labels
Expected Behavior This is how MathJax works v4

Comments

@leberman
Copy link

I am using the latest version of MathJax But line breaking is not working.

2024-02-20_10-23

<math id="mml4814">
   <mstyle displaystyle="true">
      <mrow>
         <mrow>
            <munderover>
               <mo stretchy="false">&sum;</mo>
               <mrow>
                  <mi>i</mi>
                  <mo>=</mo>
                  <mn>1</mn>
               </mrow>
               <mrow>
                  <mi>N</mi>
               </mrow>
            </munderover>
            <mrow>
               <msubsup>
                  <mrow>
                     <mi>d</mi>
                  </mrow>
                  <mrow>
                     <mi>i</mi>
                  </mrow>
                  <mrow>
                     <mi>Y</mi>
                     <mi>N</mi>
                  </mrow>
               </msubsup>
               <mrow>
                  <mrow>
                     <mi mathvariant="normal">ln</mi>
                  </mrow>
                  <mo>&#8289;</mo>
                  <mrow>
                     <mfenced separators="|">
                        <mrow>
                           <mi>&Phi;</mi>
                           <mfenced separators="|">
                              <mrow>
                                 <msub>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>Z</mi>
                                          </mrow>
                                          <mrow>
                                             <mi>'</mi>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>i</mi>
                                    </mrow>
                                 </msub>
                                 <mfrac>
                                    <mrow>
                                       <mi>&beta;</mi>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                                 <mo>-</mo>
                                 <mfrac>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>t</mi>
                                          </mrow>
                                          <mrow>
                                             <mn>1</mn>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                              </mrow>
                           </mfenced>
                           <mo>-</mo>
                           <mi>&Phi;</mi>
                           <mfenced separators="|">
                              <mrow>
                                 <msub>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>Z</mi>
                                          </mrow>
                                          <mrow>
                                             <mi>'</mi>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>i</mi>
                                    </mrow>
                                 </msub>
                                 <mfrac>
                                    <mrow>
                                       <mi>&beta;</mi>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                                 <mo>-</mo>
                                 <mfrac>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>t</mi>
                                          </mrow>
                                          <mrow>
                                             <mn>2</mn>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                              </mrow>
                           </mfenced>
                        </mrow>
                     </mfenced>
                  </mrow>
               </mrow>
               <mo>+</mo>
               <msubsup>
                  <mrow>
                     <mi>d</mi>
                  </mrow>
                  <mrow>
                     <mi>i</mi>
                  </mrow>
                  <mrow>
                     <mi>Y</mi>
                     <mi>Y</mi>
                  </mrow>
               </msubsup>
               <mrow>
                  <mrow>
                     <mi mathvariant="normal">ln</mi>
                  </mrow>
                  <mo>&#8289;</mo>
                  <mrow>
                     <mfenced separators="|">
                        <mrow>
                           <mi>&Phi;</mi>
                           <mfenced separators="|">
                              <mrow>
                                 <msub>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>Z</mi>
                                          </mrow>
                                          <mrow>
                                             <mi>'</mi>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>i</mi>
                                    </mrow>
                                 </msub>
                                 <mfrac>
                                    <mrow>
                                       <mi>&beta;</mi>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                                 <mo>-</mo>
                                 <mfrac>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>t</mi>
                                          </mrow>
                                          <mrow>
                                             <mn>2</mn>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                              </mrow>
                           </mfenced>
                        </mrow>
                     </mfenced>
                  </mrow>
               </mrow>
               <mo>+</mo>
               <msubsup>
                  <mrow>
                     <mi>d</mi>
                  </mrow>
                  <mrow>
                     <mi>i</mi>
                  </mrow>
                  <mrow>
                     <mi>N</mi>
                     <mi>Y</mi>
                  </mrow>
               </msubsup>
               <mrow>
                  <mrow>
                     <mi mathvariant="normal">ln</mi>
                  </mrow>
                  <mo>&#8289;</mo>
                  <mrow>
                     <mfenced separators="|">
                        <mrow>
                           <mi>&Phi;</mi>
                           <mfenced separators="|">
                              <mrow>
                                 <msub>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>Z</mi>
                                          </mrow>
                                          <mrow>
                                             <mi>'</mi>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>i</mi>
                                    </mrow>
                                 </msub>
                                 <mfrac>
                                    <mrow>
                                       <mi>&beta;</mi>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                                 <mo>-</mo>
                                 <mfrac>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>t</mi>
                                          </mrow>
                                          <mrow>
                                             <mn>2</mn>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                              </mrow>
                           </mfenced>
                           <mo>-</mo>
                           <mi>&Phi;</mi>
                           <mfenced separators="|">
                              <mrow>
                                 <msub>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>Z</mi>
                                          </mrow>
                                          <mrow>
                                             <mi>'</mi>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>i</mi>
                                    </mrow>
                                 </msub>
                                 <mfrac>
                                    <mrow>
                                       <mi>&beta;</mi>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                                 <mo>-</mo>
                                 <mfrac>
                                    <mrow>
                                       <msup>
                                          <mrow>
                                             <mi>t</mi>
                                          </mrow>
                                          <mrow>
                                             <mn>2</mn>
                                          </mrow>
                                       </msup>
                                    </mrow>
                                    <mrow>
                                       <mi>&sigma;</mi>
                                    </mrow>
                                 </mfrac>
                              </mrow>
                           </mfenced>
                        </mrow>
                     </mfenced>
                  </mrow>
               </mrow>
               <mo>+</mo>
               <msubsup>
                  <mrow>
                     <mi>d</mi>
                  </mrow>
                  <mrow>
                     <mi>i</mi>
                  </mrow>
                  <mrow>
                     <mi>N</mi>
                     <mi>N</mi>
                  </mrow>
               </msubsup>
               <mi>l</mi>
               <mi>n</mi>
               <mfenced separators="|">
                  <mrow>
                     <mn>1</mn>
                     <mo>-</mo>
                     <mi>&Phi;</mi>
                     <mfenced separators="|">
                        <mrow>
                           <msub>
                              <mrow>
                                 <msup>
                                    <mrow>
                                       <mi>Z</mi>
                                    </mrow>
                                    <mrow>
                                       <mi>'</mi>
                                    </mrow>
                                 </msup>
                              </mrow>
                              <mrow>
                                 <mi>i</mi>
                              </mrow>
                           </msub>
                           <mfrac>
                              <mrow>
                                 <mi>&beta;</mi>
                              </mrow>
                              <mrow>
                                 <mi>&sigma;</mi>
                              </mrow>
                           </mfrac>
                           <mo>-</mo>
                           <mfrac>
                              <mrow>
                                 <msup>
                                    <mrow>
                                       <mi>t</mi>
                                    </mrow>
                                    <mrow>
                                       <mn>2</mn>
                                    </mrow>
                                 </msup>
                              </mrow>
                              <mrow>
                                 <mi>&sigma;</mi>
                              </mrow>
                           </mfrac>
                        </mrow>
                     </mfenced>
                  </mrow>
               </mfenced>
            </mrow>
         </mrow>
      </mrow>
   </mstyle>
</math>
  • MathJax Version: 4.0.0-beta.4
  • Client OS: (Ubuntu 22.04.3)
  • Browser: (Chrome 121.0.6167.160)

I am using the following MathJax configuration:

window.MathJax = {
        chtml: {
            displayOverflow: 'linebreak'
        },
        linebreaks: {                  // options for when overflow is linebreak
            inline: true,                   
            width: '100%',                 
            lineleading: 2,               
            LinebreakVisitor: null,         
        }
    }

and loading MathJax via

<script src="https://cdn.jsdelivr.net/npm/mathjax@4.0.0-beta.4/tex-mml-chtml.js"></script>

Implemented sample:

https://codepen.io/Mohammad-Shahbazi-the-styleful/pen/OJqGXmx

@leberman leberman changed the title line break in v4 not working line breaking in MathML (V4) Feb 20, 2024
@leberman
Copy link
Author

Update: this worked with version 2.7.8

Screenshot from 2024-02-22 21-06-00

<script type="text/x-mathjax-config">
    MathJax.Hub.Config({
        "auto-collapse": {
            disabled: false,
         },
         collapsible: {
            disabled: false,
          },
        showMathMenu: false,
        zoom: "None",
        zscale: "100%",
        texHints: true,
        jax: ["input/MathML", "output/HTML-CSS"],
        CommonHTML: {
            scale: 90,
            minScaleAdjust: 55,
            mtextFontInherit: false,
            linebreaks: {automatic: true}
        },
        Safe: {
            sizeMin: .4,
            sizeMax: 1.44
        }
    });
</script>

@dpvc
Copy link
Member

dpvc commented Feb 23, 2024

Note that your math items are in-line math items because the math node does not have the display="block" attribute, so display defaults to inline. The mstyle with displaystyle="true" means that the display style rules will be used in the rendering, but it is still considered an in-line expression.

MathJax v2 did not perform in-line breaking except in limited situations, so the line-breaking you show from v2 would likely have to have been for displayed equations, not in-line ones (the equation numbers also suggest that that is the case, as in-line expressions don't get equation numbers). So I suspect the examples you have used are not actually the same in both cases.

MathJax v4 does implement in-line breaking, but note that the rules for in-line breaking are based on the TeX in-line breaking rules, which only break an expression at a top-level operator that is of class BIN or REL (a binary operator or a relational operator). Such operators must be children of the top-level math element (or of top-level mstyle or semantics elements) in order for a breakpoint to be allowed. In particular, content inside an explicit mrow element will not have in-line breaks, just as TeX will not break at operators within braces. That is, in x + {y + z} the only in-line breakpoint that can be made is at the first plus sign (the second is not valid as it is inside braces). Similarly,

<math>
  <mi>x</mi>
  <mo>+</mo>
  <mrow>
    <mi>y</mi>
    <mo>+</mo>
    <mi>z</mi>
  </mrow>
</math>

has only one valid in-line breakpoint at the first plus sign, and the second plus is not a breakpoint as it is inside an explicit mrow tag.

The expressions you point to in your screen shot all have explicit mrow elements around the complete expression, and so that prevents any inline breaks in those expressions. For example, the first one is

        <math id="mml367">
          <mstyle displaystyle="true">
            <mrow>
              <mi>A</mi>
              <mo>=</mo>
              <mi>&pi;</mi>
              <msqrt>
                <mn>1</mn>
                <mi>a</mi>
              </msqrt>
              <mo>&larr;</mo>
              <mo>&uarr;</mo>
              <mo>&rarr;</mo>
              <mo>&darr;</mo>
              <mi>&infin;</mi>
              <mo>&ne;</mo>
              <mo>&prop;</mo>
              <mo>&cong;</mo>
              <mo>&asymp;</mo>
              <mo>&equiv;</mo>
              <mo>&forall;</mo>
              <mo>&exist;</mo>
              <mi>&empty;</mi>
              <mo>&cap;</mo>
              <mo>&cup;</mo>
              <mo>&part;</mo>
              <mi>&rho;</mi>
              <mi>&phi;</mi>
              <mi>&gamma;</mi>
              <mi>&sigmaf;</mi>
              <mo>&sub;</mo>
              <mo>&sup;</mo>
              <mo>&oplus;</mo>
              <mo>&#8861;</mo>
              <mo>&otimes;</mo>
              <mi>&sigma;</mi>
              <mi>&omega;</mi>
              <mo>&ni;</mo>
              <mo>&isin;</mo>
              <mo>&#8710;</mo>
              <mi>&gamma;</mi>
              <mi>&epsilon;</mi>
              <mi>&theta;</mi>
              <mi>&tau;</mi>
            </mrow>
          </mstyle>
        </math>

which won't break, but if you remove the outer mrow, as in

        <math id="mml367">
           <mstyle displaystyle="true">
              <mi>A</mi>
              <mo>=</mo>
              <mi>&pi;</mi>
              <msqrt>
                <mn>1</mn>
                <mi>a</mi>
              </msqrt>
              <mo>&larr;</mo>
              <mo>&uarr;</mo>
              <mo>&rarr;</mo>
              <mo>&darr;</mo>
              <mi>&infin;</mi>
              <mo>&ne;</mo>
              <mo>&prop;</mo>
              <mo>&cong;</mo>
              <mo>&asymp;</mo>
              <mo>&equiv;</mo>
              <mo>&forall;</mo>
              <mo>&exist;</mo>
              <mi>&empty;</mi>
              <mo>&cap;</mo>
              <mo>&cup;</mo>
              <mo>&part;</mo>
              <mi>&rho;</mi>
              <mi>&phi;</mi>
              <mi>&gamma;</mi>
              <mi>&sigmaf;</mi>
              <mo>&sub;</mo>
              <mo>&sup;</mo>
              <mo>&oplus;</mo>
              <mo>&#8861;</mo>
              <mo>&otimes;</mo>
              <mi>&sigma;</mi>
              <mi>&omega;</mi>
              <mo>&ni;</mo>
              <mo>&isin;</mo>
              <mo>&#8710;</mo>
              <mi>&gamma;</mi>
              <mi>&epsilon;</mi>
              <mi>&theta;</mi>
              <mi>&tau;</mi>
           </mstyle>
        </math>

then line breaks are possible (try it in your codepen example).

The other expression also has mrow elements that are preventing inline breaks, but you have to remove several of them in order to get the line breaks. I will leave that to you.

Note that line breaking of displayed equations is more general, and can break inside mrow and other nested nodes. If you add display="block" indentalign="left" to the long expression you provide in your first message, then you will get line breaking within that expression without having to remove the mrow elements.

So the upshot is, this is the expected behavior for MathJax's line breaking.

@dpvc dpvc added Expected Behavior This is how MathJax works v4 labels Feb 23, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Expected Behavior This is how MathJax works v4
Projects
None yet
Development

No branches or pull requests

2 participants