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

MathML in SVG in MathML #896

Open
distler opened this issue Aug 21, 2014 · 32 comments
Open

MathML in SVG in MathML #896

distler opened this issue Aug 21, 2014 · 32 comments

Comments

@distler
Copy link

distler commented Aug 21, 2014

Background:

  • itex has an svg environment which allows the user to embed SVG figures in equations:

    $ ... \begin{svg} ... SVG goes here ... \end{svg} ... $

  • There is an extension for SVG-Edit, which allows the user to embed MathML in an SVG figure.

MathJax seems to work fine if you use one or the other of these mechanisms. That is, it seems to handle SVG-in-MathML and MathML-in-SVG (both inside an (X)HTML host document).

But if you try to use both mechanisms (creating, say, MathML-in-SVG-in-MathML), MathJax craps out, and renders the result poorly, if at all.

Is this an architectural limitation that we should just learn to live with, or is it a bug that could be fixed?

I can assure you that there are good use-cases for MathML-in-SVG-in-MathML. So it would be nice if MathJax supported it.

I can supply a test case, if needed.

@dpvc
Copy link
Member

dpvc commented Aug 21, 2014

It is most likely due to the fact that MathJax doesn't expect the <math> elements to be nested (as they are with MathML-in-SVG-in-MathML. MathJax looks up all the <math> elements all at once, and then processes them in order. To get it to work, it would need to do the inner math first, and then the outer math. That might be possible, but it would be a significant change to how it currently operates.

If you can supply an example XHTML file, I'll take a look and see if I can give you any work-arounds.

@distler
Copy link
Author

distler commented Aug 21, 2014

Here's a real-life example (produced by Maruku(+itex2MML)+SVG-Edit).

<math class='maruku-mathml' display='block' xmlns='http://www.w3.org/1998/Math/MathML'><semantics><mrow><mrow><mtable rowspacing='0.5ex'><mtr><mtd><semantics><annotation-xml encoding='SVG1.1'>
<svg height='193' se:nonce='39333' width='217' xmlns='http://www.w3.org/2000/svg' xmlns:se='http://svg-edit.googlecode.com'>
 <g>
  <title>Layer 1</title>
  <polygon fill='#000000' fill-opacity='0' id='svg_39333_2' points='161.71542358398438,97.5 134.3577117919922,144.88494873046875 79.64228820800781,144.88494873046875 52.284576416015625,97.5 79.64228820800781,50.11505126953125 134.3577117919922,50.11505126953125 161.71542358398438,97.5 ' stroke='#000000' stroke-width='2'></polygon>
  <line fill='none' fill-opacity='0' id='svg_39333_3' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='80' x2='45' y1='50.5' y2='5.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_4' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='134' x2='164' y1='48.5' y2='3.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='78' x2='43' y1='146.5' y2='191.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_6' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='135' x2='170' y1='147.5' y2='192.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_7' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='52' x2='1' y1='97.5' y2='98.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_8' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='163' x2='216' y1='97.5' y2='97.5'></line>
  <circle cx='80' cy='49.5' fill='#ff0000' id='svg_39333_9' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='134' cy='49.5' fill='#ff0000' id='svg_39333_10' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='162' cy='98.5' fill='#ff0000' id='svg_39333_11' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='135' cy='145.5' fill='#ff0000' id='svg_39333_12' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='79' cy='145.5' fill='#ff0000' id='svg_39333_13' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='54' cy='98.5' fill='#ff0000' id='svg_39333_14' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <foreignObject font-size='16' height='24' id='svg_39333_15' width='14' x='133' y='6.5'>
   <math display='inline' xmlns='http://www.w3.org/1998/Math/MathML'>
    <semantics>
     <mrow>
      <msub>
       <mi>v</mi>
       <mn>1</mn>
      </msub>
     </mrow>
     <annotation encoding='application/x-tex'>v_1</annotation>
    </semantics>
   </math>
  </foreignObject>
  <foreignObject font-size='16' height='24' id='svg_39333_16' width='14' x='180' y='72.5'>
   <math display='inline' xmlns='http://www.w3.org/1998/Math/MathML'>
    <semantics>
     <mrow>
      <msub>
       <mi>v</mi>
       <mn>2</mn>
      </msub>
     </mrow>
     <annotation encoding='application/x-tex'>v_2</annotation>
    </semantics>
   </math>
  </foreignObject>
  <foreignObject font-size='16' height='26' id='svg_39333_24' width='18' x='39' y='8.5'>
   <math display='inline' xmlns='http://www.w3.org/1998/Math/MathML'>
    <semantics>
     <mrow>
      <msub>
       <mi>v</mi>
       <mrow>
        <msub>
         <mi>n</mi>
         <mn>1</mn>
        </msub>
       </mrow>
      </msub>
     </mrow>
     <annotation encoding='application/x-tex'>v_{n_1}</annotation>
    </semantics>
   </math>
  </foreignObject>
 </g>
</svg>
</annotation-xml></semantics></mtd></mtr></mtable></mrow><mo>≡</mo><mrow><mo>(</mo><msup><mrow><mi>U</mi><mo stretchy='false'>(</mo><mi>k</mi><mo stretchy='false'>)</mo></mrow> <mrow><msub><mi>n</mi> <mn>1</mn></msub></mrow></msup><mo>,</mo><mo stretchy='false'>{</mo><msub><mi>v</mi> <mi>i</mi></msub><mo stretchy='false'>}</mo><mo>)</mo></mrow></mrow><annotation encoding='application/x-tex'>
\begin{matrix}
\begin{svg}
&lt;svg width=&quot;217&quot; height=&quot;193&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; xmlns:svg=&quot;http://www.w3.org/2000/svg&quot; xmlns:se=&quot;http://svg-edit.googlecode.com&quot; xmlns:math=&quot;http://www.w3.org/1998/Math/MathML&quot; se:nonce=&quot;39333&quot;&gt;
 &lt;g&gt;
  &lt;title&gt;Layer 1&lt;/title&gt;
  &lt;polygon id=&quot;svg_39333_2&quot; fill=&quot;#000000&quot; points=&quot;161.71542358398438,97.5 134.3577117919922,144.88494873046875 79.64228820800781,144.88494873046875 52.284576416015625,97.5 79.64228820800781,50.11505126953125 134.3577117919922,50.11505126953125 161.71542358398438,97.5 &quot; stroke-width=&quot;2&quot; fill-opacity=&quot;0&quot; stroke=&quot;#000000&quot;/&gt;
  &lt;line fill=&quot;none&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; fill-opacity=&quot;0&quot; x1=&quot;80&quot; y1=&quot;50.5&quot; x2=&quot;45&quot; y2=&quot;5.5&quot; id=&quot;svg_39333_3&quot;/&gt;
  &lt;line fill=&quot;none&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; fill-opacity=&quot;0&quot; x1=&quot;134&quot; y1=&quot;48.5&quot; x2=&quot;164&quot; y2=&quot;3.5&quot; id=&quot;svg_39333_4&quot;/&gt;
  &lt;line fill=&quot;none&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; fill-opacity=&quot;0&quot; x1=&quot;78&quot; y1=&quot;146.5&quot; x2=&quot;43&quot; y2=&quot;191.5&quot; id=&quot;svg_39333_5&quot;/&gt;
  &lt;line fill=&quot;none&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; fill-opacity=&quot;0&quot; x1=&quot;135&quot; y1=&quot;147.5&quot; x2=&quot;170&quot; y2=&quot;192.5&quot; id=&quot;svg_39333_6&quot;/&gt;
  &lt;line fill=&quot;none&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; fill-opacity=&quot;0&quot; x1=&quot;52&quot; y1=&quot;97.5&quot; x2=&quot;1&quot; y2=&quot;98.5&quot; id=&quot;svg_39333_7&quot;/&gt;
  &lt;line fill=&quot;none&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; fill-opacity=&quot;0&quot; x1=&quot;163&quot; y1=&quot;97.5&quot; x2=&quot;216&quot; y2=&quot;97.5&quot; id=&quot;svg_39333_8&quot;/&gt;
  &lt;circle fill=&quot;#ff0000&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; cx=&quot;80&quot; cy=&quot;49.5&quot; r=&quot;5&quot; id=&quot;svg_39333_9&quot; stroke-opacity=&quot;0&quot;/&gt;
  &lt;circle fill=&quot;#ff0000&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; cx=&quot;134&quot; cy=&quot;49.5&quot; r=&quot;5&quot; stroke-opacity=&quot;0&quot; id=&quot;svg_39333_10&quot;/&gt;
  &lt;circle fill=&quot;#ff0000&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; cx=&quot;162&quot; cy=&quot;98.5&quot; r=&quot;5&quot; stroke-opacity=&quot;0&quot; id=&quot;svg_39333_11&quot;/&gt;
  &lt;circle fill=&quot;#ff0000&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; cx=&quot;135&quot; cy=&quot;145.5&quot; r=&quot;5&quot; stroke-opacity=&quot;0&quot; id=&quot;svg_39333_12&quot;/&gt;
  &lt;circle fill=&quot;#ff0000&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; cx=&quot;79&quot; cy=&quot;145.5&quot; r=&quot;5&quot; stroke-opacity=&quot;0&quot; id=&quot;svg_39333_13&quot;/&gt;
  &lt;circle fill=&quot;#ff0000&quot; stroke=&quot;#000000&quot; stroke-width=&quot;2&quot; stroke-dasharray=&quot;2,2&quot; stroke-linejoin=&quot;null&quot; stroke-linecap=&quot;null&quot; cx=&quot;54&quot; cy=&quot;98.5&quot; r=&quot;5&quot; stroke-opacity=&quot;0&quot; id=&quot;svg_39333_14&quot;/&gt;
  &lt;foreignObject x=&quot;133&quot; y=&quot;6.5&quot; id=&quot;svg_39333_15&quot; font-size=&quot;16&quot; width=&quot;14&quot; height=&quot;24&quot;&gt;
   &lt;math xmlns=&quot;http://www.w3.org/1998/Math/MathML&quot; display=&quot;inline&quot;&gt;
    &lt;semantics&gt;
     &lt;mrow&gt;
      &lt;msub&gt;
       &lt;mi&gt;v&lt;/mi&gt;
       &lt;mn&gt;1&lt;/mn&gt;
      &lt;/msub&gt;
     &lt;/mrow&gt;
     &lt;annotation encoding=&quot;application/x-tex&quot;&gt;v_1&lt;/annotation&gt;
    &lt;/semantics&gt;
   &lt;/math&gt;
  &lt;/foreignObject&gt;
  &lt;foreignObject x=&quot;180&quot; y=&quot;72.5&quot; font-size=&quot;16&quot; width=&quot;14&quot; height=&quot;24&quot; id=&quot;svg_39333_16&quot;&gt;
   &lt;math xmlns=&quot;http://www.w3.org/1998/Math/MathML&quot; display=&quot;inline&quot;&gt;
    &lt;semantics&gt;
     &lt;mrow&gt;
      &lt;msub&gt;
       &lt;mi&gt;v&lt;/mi&gt;
       &lt;mn&gt;2&lt;/mn&gt;
      &lt;/msub&gt;
     &lt;/mrow&gt;
     &lt;annotation encoding=&quot;application/x-tex&quot;&gt;v_2&lt;/annotation&gt;
    &lt;/semantics&gt;
   &lt;/math&gt;
  &lt;/foreignObject&gt;
  &lt;foreignObject x=&quot;39&quot; y=&quot;8.5&quot; font-size=&quot;16&quot; width=&quot;18&quot; height=&quot;26&quot; id=&quot;svg_39333_24&quot;&gt;
   &lt;math xmlns=&quot;http://www.w3.org/1998/Math/MathML&quot; display=&quot;inline&quot;&gt;
    &lt;semantics&gt;
     &lt;mrow&gt;
      &lt;msub&gt;
       &lt;mi&gt;v&lt;/mi&gt;
       &lt;mrow&gt;
        &lt;msub&gt;
         &lt;mi&gt;n&lt;/mi&gt;
         &lt;mn&gt;1&lt;/mn&gt;
        &lt;/msub&gt;
       &lt;/mrow&gt;
      &lt;/msub&gt;
     &lt;/mrow&gt;
     &lt;annotation encoding=&quot;application/x-tex&quot;&gt;v_{n_1}&lt;/annotation&gt;
    &lt;/semantics&gt;
   &lt;/math&gt;
  &lt;/foreignObject&gt;
 &lt;/g&gt;
&lt;/svg&gt;
\end{svg}
\end{matrix}\equiv \left({U(k)}^{n_1},\{v_i\}\right)
</annotation></semantics></math>

@davidcarlisle
Copy link

{unrelated to mathjax's current implementation really but...)

Note the default rendering of a semantics with only annotations is
empty as it's annotating nothing.

It worked accidentally in native firefox due to the simplistic
implementation of semantics which just
used css to render the first element whatever, and the generaly
laxeness of the mathml2 dtd.

the mathml3 dtd/RNG clarifies that there should be an expression being annotated

The recommended way to embed svg in mathml in html5 is

....

metxt allowing arbitrary html+svg as content (which also isn't
currently supported in mathjax I think)

David

@distler
Copy link
Author

distler commented Aug 21, 2014

The recommended way to embed svg in mathml in html5 is ...

Well, the current method does work, in both Mozilla and MathJax, provided you don't nest <math> elements. The "bug" (if you will) occurs when one tries to nest <math> elements.

Let's solve one problem at a time.

metxt allowing arbitrary html+svg as content

Can <math> be a descendent of <mtext> ? 'Cuz if it can't, then this method doesn't address the use-case under discussion.

@distler
Copy link
Author

distler commented Aug 21, 2014

(Quite accidentally, the MathJax rendering of the above example actually isn't too bad -- despite the nested MathML. I can, however, certainly produce examples where the MathJax rendering is awful.)

@davidcarlisle
Copy link

On 21 August 2014 22:20, Jacques Distler notifications@github.com wrote:

The recommended way to embed svg in mathml in html5 is ...

Well, the current method does work, in both Mozilla and MathJax,
provided you don't nest elements.

yes but I think it's relying on non standard rendering which may get fixed.
The default behaviour of semantics should be
the behaviour of the base expression not the annotation.

The "bug" (if you will) occurs when one tries to nest elements.

Let's solve one problem at a time.

metxt allowing arbitrary html+svg as content

Can be a descendent of ? 'Cuz if it can't, then method
doesn't address the use-case under discussion.

Yes, if you have say a span or svg then you are in an html/svg context and
within that you can have nested math.
(by spec and I think in firefox native)

David

@distler
Copy link
Author

distler commented Aug 21, 2014

Changing itex2MML's output from

<semantics><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics>

to

<mtext>...</mtext>

is a trivial change which (as you suspect) works just fine in Firefox. But it makes the MathJax rendering even worse.

I'm reluctant to make itex2MML's output more spec-compliant if the only visible effect for the end-user is to (further) break MathJax.

@davidcarlisle
Copy link

On 21 August 2014 23:45, Jacques Distler notifications@github.com wrote:

I'm reluctant to make itex2MML's output more spec-compliant if the only
visible effect for the end-user is to (further) break MathJax.

Not an unreasonable position to take:-)

But if MathJax was going to change anyway, fixing the valid version rather
than the invalid version would be my preference,

David

@distler
Copy link
Author

distler commented Aug 22, 2014

I really think these are two separate issues

  1. What should MathJax do when it encounters a <semantics> element whose first (and only) child is an <annotation-xml> element?
  2. Can (or should) MathJax handle nested <math> elements?

For the record, the current status (as best as my testing can discern):

  1. <semantics><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics> with embedded SVG, containing no embedded MathML:
  • MathJax handles it fine.
  1. <mtext> with embedded SVG, containing no embedded MathML:
  • MathJax craps out.
  1. <semantics><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics> with embedded SVG, containing embedded MathML:
    • MathJax renders it poorly, but sometimes legibly.
  2. <mtext> with embedded SVG, containing embedded MathML:
    • MathJax craps out.

If you want to file a bug about SVG in <mtext>, that's OK. But I think it's logically (and practically) distinct from this bug (about nested <math> elements).

@distler
Copy link
Author

distler commented Aug 22, 2014

If you want to file a bug about SVG in <mtext>, that's OK.

Apropos of that, I'll point out that specifying that

  • A <semantics> element whose first (and only) child is an <annotation-xml> element

is invalid MathML is logically distinct from specifying what sort of error-handling a User-Agent should engage in, when it encounters such a snippet of invalid MathML.

The MathML3 Spec doesn't specify what the error-handling should be. And it is arguable that "attempt to render the first child, anyway" is a reasonable choice. Certainly, that's what Firefox and MathJax have done. If you were to go about specifying error-handling in a future version of the MathML Spec, it might not be an unreasonable idea to "pave the cowpaths" and codify that choice in the Spec.

@davidcarlisle
Copy link

On 22 August 2014 03:24, Jacques Distler notifications@github.com wrote:

If you want to file a bug about SVG in , that's OK.

Apropos of that, I'll point out that specifying that

  • A element whose first (and only) child is an
    element

is invalid MathML is logically distinct from specifying what sort of
error-handling a User-Agent should engage in, when it encounters such a
snippet of invalid MathML.

The MathML3 Spec doesn't specify what the error-handling should be. And it
is arguable that "attempt to render the first child, anyway" is a
reasonable choice. Certainly, that's what Firefox and MathJax have done. If
you were to go about specifying error-handling in a future version of
the MathML Spec, it might not be an unreasonable idea to "pave the
cowpaths" and codify that choice in the Spec.

I don't think it's likely we have a mathml revision any time soon, or that
we try to codify error handling in the xml view although of course
specifying error handling would fit better with the html approach to
parsing, so it's possible a more formalised mathml-in-the-browser note
might want to say something about error handling. If we did try to specify
this I'd strongly argue that rendering the first annotation by default is
simply wrong, the order of the annotations should not matter. The default
rendering of a semantics with empty base should be nothing: it should
always be possible to remove a semantics and its annotations and just get
the bare unannotated mathml.

That said, a specific renderer can use an annotation to affect (or
effectively replace) the rendering. Examples in the spec suggest using
presentation-MathML annotation to specify a rendering, and there an svg
capable renderer may specify that it does the same with svg annotations.
However it would still be better and more logically consistent if the
annotation was annotating something even if just an empty mrow. So it
would be good if generators such as itex generated that form, although as
noted earlier It's not reasonable to ask you to change the generator until
the renders support the valid form.

If you have
....2>

stripping the semantics produces the invalid 2
conversely doing that with

some
svg....2>

produces some svg2 which is valid
and has a default rendering,
and might give the reader a hint of where to find the real meaning, and
would match the rendering of the original
semantics element in a mathml renderer that was not svg capable.

So coming back to this mathjax github, what I'd like to see is a mathjax
extension that makes it prefer svg annotations over the base
(whatever position the annotation occurs).

David

@distler
Copy link
Author

distler commented Aug 22, 2014

So it would be good if generators such as itex generated that form, although as noted earlier It's not reasonable to ask you to change the generator until the renders support the valid form.

Needless to say,

  <semantics><mrow></mrow><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics>

renders nothing, in either Firefox or MathJax. So that's not going to happen.

<semantics><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics>

is a hack (valid MathML2, invalid MathML3). But it's a hack that works. Embellishing it, so as to make it valid MathML3 does not make it any less of a hack.

The MathML3 Spec does not specify how such a snippet of invalid MathML should be rendered. You have one interpretation; Firefox and MathJax have another (IMHO, equally-valid) interpretation. Changing how they render

<semantics><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics>

to match your interpretation would break existing documents. So I don't think that is ever going to happen (nor should it).

Changing how they render

  <semantics><mrow></mrow><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics>

seems pointless, as no one (or, at least, not itex2MML) is going to produce that, and the MathML3 Spec indicates that the default rendering is blank, which is what they currently do.

As I said, I will happily change itex2MML to output

 <mtext>...</mtext>

instead of

<semantics><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics>

if and when MathJax supports SVG-in-<mtext>. (Firefox and Webkit's MathML renderer, which we haven't discussed, already do.) But please file a separate bug for that; this one is about something else.

P.S.: If you want to discuss itex2MML's (mis)behaviour, then a better place to do that would be here, rather than on MathJax's bug tracker.

@dpvc
Copy link
Member

dpvc commented Aug 22, 2014

There is already an open issue tracker for handling HTML tags in <mtext>, so no need to open another one. We are certainly aware of the issue, and that the current <semantics> hack is outside the MathML3 spec. It was implemented because Firefox handled it, and there were documents that used it. It also provides the only method currently in MathJax of embedding HTML in MathML, so is useful if awkward. Certainly the HTML-in-<mtext> solution is better, and we have that in progress.

@distler
Copy link
Author

distler commented Aug 22, 2014

Getting back to MathML-in-SVG-in-MathML, would it be useful for me to post a testcase where the MathJax rendering is bad?

For the one I posted above, the MathJax rendering turns out (accidentally, I think) to be quite good.

@dpvc
Copy link
Member

dpvc commented Aug 22, 2014

I haven't had a chance to look at your current example yet. What would help is an actual complete XHTML page that contains the example (as sometimes the setup of the page is an issue). If you want to do one that renders poorly, that is fine as well.

@dpvc
Copy link
Member

dpvc commented Aug 22, 2014

I just took a quick look at the example, and agree that it looks pretty good. The MathML that is inside the SVG is not being handled by MathJax, however; it is the native MathML renderer of the browser that is handling that. That is probably why it sometimes looks good and sometimes doesn't (as the native MathML renderer might not be able to handle some of the MathML, at least not in the same way that MathJax itself would).

@distler
Copy link
Author

distler commented Aug 22, 2014

The MathML that is inside the SVG is not being handled by MathJax, however; it is the native MathML renderer of the browser that is handling that.

D'Oh! I should have thought of that.

Looking at the same example in Chrome (no native MathML support) reveals that the inner <math> element is being handled natively (which is to say, not well, at least in Chrome).

That is probably why it sometimes looks good and sometimes doesn't (as the native MathML renderer might not be able to handle some of the MathML, at least not in the same way that MathJax itself would).

So then this test-case is perfect, as-is. What I'm requesting is that MathJax take over rendering the inner <math> element as well.

@dpvc
Copy link
Member

dpvc commented Aug 22, 2014

So then this test-case is perfect, as-is. What I'm requesting is that MathJax take over rendering the inner <math> element as well.

Yes, I understand. This will probably have to wait until the HTML-in-<mtext> update, but I will keep in mind the nested MathML case.

In the meantime, I'm wondering if calling MathJax's Typeset function as second time would pick up the MathML within the SVG? I haven't tried it, but I think it should.

@dpvc
Copy link
Member

dpvc commented Aug 22, 2014

Just tried it, and yes, it does typeset the MathML in the SVG. But the width and height given in the <foreignObject> tags might not match the size of the MathJax output.

@distler
Copy link
Author

distler commented Aug 22, 2014

Just tried it, and yes, it does typeset the MathML in the SVG.

Forgive the stupid question, but how do you do that? I thought it would be

MathJax.Hub.Queue(["Typeset",MathJax.Hub, svg_element_to_be_processed]);

but that doesn't seem to have any effect.

But the width and height given in the tags might not match the size of the MathJax output.

(Correctly) setting the width and height of the <foreignObject> is always an annoyance.

@dpvc
Copy link
Member

dpvc commented Aug 22, 2014

I thought it would be

MathJax.Hub.Queue(["Typeset",MathJax.Hub, svg_element_to_be_processed]);

Yes, that should work, but leaving off the element should also work. That is, provided you have the mml2jax extension loaded (I initially didn't, and that did cause me some confusion).

On the other hand, I tried it in an HTML document, not an XHTML one, and there may be additional problems there. XHTML is more finicky about the namespaces, and it might be that MathJax's getElementsByTagNameNS() calls aren't finding the nested tags.

@davidcarlisle
Copy link

On 22 August 2014 14:53, Jacques Distler notifications@github.com wrote:

So it would be good if generators such as itex generated that form,
although as noted earlier It's not reasonable to ask you to change the
generator until the renders support the valid form.

Needless to say,

...

renders nothing, in either Firefox or MathJax. So that's not going to
happen.

Nothing is the expected default rendering for an empty mrow.
However it is perfect;y for a renderer 9eg a mathjax extension0 to specify
that it will prefer svg extensions.

...

is a hack (valid MathML2, invalid MathML3). But it's a hack that works.
Embellishing it, so as to make it valid MathML3 does not make it any less
of a hack.

Using the first annotation is a hack, choosing to prefer svg annotations as
the default rendering has always been part of the main design use of
annotation-xml

The MathML3 Spec does not specify how such a snippet of invalid MathML
should be rendered. You have one interpretation; Firefox and MathJax have
another (IMHO, equally-valid) interpretation. Changing how they render

...

to match your interpretation would break existing documents. So I don't
think that is ever going to happen (nor should it).

Compatibility concerns may force existing sytsems to support this use
outside the specified usage but certainly any new renderer should not
support this. It's invalid. I think the only plausible rendering (if not
generating an error) would be to treat it the same as the same as
annotating an empty mrow. This needn't be empty if the renderer (mathjax
and firefox in this case) can be configured to prefer svg annottaions as
rendering. Thus existing documents need not break.

Changing how they render

...

seems pointless, as no one (or, at least, not itex2MML) is going to
produce that, and the MathML3 Spec indicates that the default rendering is
blank, which is what they currently do.

As I say it is far clearer than annotating nothing . Of course if possible,
a better base than an empty mrow would be some mathml equivalent, if only
an mtext that says what should be there. Then the expression also works on
non svg systems, or if annotations are removed.
An empty mrow was only suggested as that is the nearest valid markup that
corresponds to annotating nothing.

As I said, I will happily change itex2MML to output

...

instead of

...

if and when MathJax supports SVG-in-. (Firefox and Webkit's MathML
renderer, which we haven't discussed, already do.) But please file a
separate bug for that; this one is about something else.

P.S.: If you want to discuss itex2MML's (mis)behaviour, then a better
place to do that would be here
https://golem.ph.utexas.edu/forum/forums/itex2mml, rather than on
MathJax's bug tracker.

Yes agreed, although the issue is more mathjax than itex as you could
easily generate any of these forms but not unreasonably don't want to move
ahead of mathjax capabilities.

David

@distler
Copy link
Author

distler commented Aug 22, 2014

Compatibility concerns may force existing sytsems to support this use outside the specified usage but certainly any new renderer should not support this.

That's not how the Web works.

New renderers need to support existing documents. Existing documents use

<semantics><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics>

so new renderers will support this.

New documents should (eventually) use

<mtext>...</mtext>

to embed SVG in MathML. I am quite confident that they will (at least, those generated by itex2MML).

As to how renderers should handle

<semantics><mrow></mrow><annotation-xml encoding='SVG1.1'>...</annotation-xml></semantics>

strikes me as an angels-dancing-on-the-head-of-a-pin kind of question. Existing documents don't use that particular construct, and I find it highly unlikely that future documents will either.

  • The Spec clearly states that the default rendering is blank.
  • If authors want to render a blank, they have easier ways to do so.
  • If they want to render some SVG, they have more effective ways to do that.

@davidcarlisle
Copy link

On 22 August 2014 18:58, Jacques Distler notifications@github.com wrote:

Compatibility concerns may force existing sytsems to support this use
outside the specified usage but certainly any new renderer should not
support this.

That's not how the Web works.

New renderers need to support existing documents. Existing documents use

...

so new renderers will support this.

many existing renderers will treat that as implied by the spec and render
it as empty: mathplayer, Word, maple, mathematica,
mathml to tex translators just to list a few off the top of my head. As I
mentioned earlier it is possible for svg capable renderers
to support that without giving special meaning to the first annotation by
specifying that they treat svg as the preferred rendering
which has always been conformant behaviour, then the only extra thing that
needs saying is that as an error recovery for
invalid semantics with no base, imply an empty mrow as base, which gets you
back to the behaviour you want, with defined behaviour in all browsers.

New documents should (eventually) use

...

to embed SVG in MathML. I am quite confident that they will (at least,
those generated by itex2MML).

That's more natural markup if you only target svg capable systems, using
semantics is more cumbersome but has better possibilities for giving
non-svg fallback, so probably both will have a place.

As to how renderers should handle

...

strikes me as an angels-dancing-on-the-head-of-a-pin kind of question.
Existing documents don't use that particular construct, and I find it
highly unlikely that future documents will either.

As I say above this is the most natural error recovery for the invalid use
with no base, infer an empty base.
If you were generating it it would be better to put a fallback for non svg
systems in rather than an empty mrow of course.

  • The Spec clearly states that the default rendering is blank.

  • If authors want to render a blank, they have easier ways to do so.

    That is the case with the also with the markup you currently generate,
    the spec states that by default annotation-xml has no effect.
    It worked by accident in firefox as originally semantics wasn't supported
    at all which meant that annotations added by various generators got
    rendered in various unfortunate ways. As a quick fix Roger added a couple
    of lines of css to just render the first child so that valid uses of
    semantics did the right thing. The fact that the css didn't distinguish the
    invalid case where the first child was an annotation is just accidental
    fall through. As you say history is history and perhaps and existing
    documents may need to have an effect on specifications, but as they may be
    supported with existing specification with the addition of saying that the
    error recovery for an empty base is to infer an empty mrow, I see no need
    to do anything other than that, the default rendering of that construct is
    then empty but some systems will prefer the svg annotation.
    That matches current behaviour of existing mathml systems.

  • If they want to render some SVG, they have more effective ways to
    do that.

David

@distler
Copy link
Author

distler commented Aug 22, 2014

On the other hand, I tried it in an HTML document, not an XHTML one, and there may be additional problems there. XHTML is more finicky about the namespaces, and it might be that MathJax's getElementsByTagNameNS() calls aren't finding the nested tags.

Here's what I did (which works in XHTML; I'll worry about HTML later):

    MathJax.Hub.Queue( function () {
       var fos = document.getElementsByTagName('foreignObject');
       for (var i = 0; i < fos.length; i++) {
         MathJax.Hub.Typeset(fos[i]);
       }
    });

The MathML-in-SVG-in-MathML does, indeed get rendered. But it also gets displaced relative to the parent <foreignObject>, and that displacement

  1. varies from <foreignObject> to <foreignObject> and
  2. varies wildly between browsers (I'm looking specifically at Chrome and Safari).

So, right now, this doesn't look like a very satisfactory solution.

@distler
Copy link
Author

distler commented Aug 23, 2014

But it also gets displaced relative to the parent <foreignObject>, and that displacement

  • varies from <foreignObject> to <foreignObject> and
  • varies wildly between browsers (I'm looking specifically at Chrome and Safari).

To see what I mean, it's helpful to add a border around the <math> elements, and compare the rendering in Chrome and Safari:

<math class='maruku-mathml' display='block' xmlns='http://www.w3.org/1998/Math/MathML'><semantics><mrow><mrow><mtable rowspacing='0.5ex'><mtr><mtd><semantics><annotation-xml encoding='SVG1.1'>
<svg height='193' se:nonce='39333' width='217' xmlns='http://www.w3.org/2000/svg' xmlns:se='http://svg-edit.googlecode.com'>
 <g>
  <title>Layer 1</title>
  <polygon fill='#000000' fill-opacity='0' id='svg_39333_2' points='161.71542358398438,97.5 134.3577117919922,144.88494873046875 79.64228820800781,144.88494873046875 52.284576416015625,97.5 79.64228820800781,50.11505126953125 134.3577117919922,50.11505126953125 161.71542358398438,97.5 ' stroke='#000000' stroke-width='2'></polygon>
  <line fill='none' fill-opacity='0' id='svg_39333_3' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='80' x2='45' y1='50.5' y2='5.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_4' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='134' x2='164' y1='48.5' y2='3.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='78' x2='43' y1='146.5' y2='191.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_6' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='135' x2='170' y1='147.5' y2='192.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_7' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='52' x2='1' y1='97.5' y2='98.5'></line>
  <line fill='none' fill-opacity='0' id='svg_39333_8' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-width='2' x1='163' x2='216' y1='97.5' y2='97.5'></line>
  <circle cx='80' cy='49.5' fill='#ff0000' id='svg_39333_9' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='134' cy='49.5' fill='#ff0000' id='svg_39333_10' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='162' cy='98.5' fill='#ff0000' id='svg_39333_11' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='135' cy='145.5' fill='#ff0000' id='svg_39333_12' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='79' cy='145.5' fill='#ff0000' id='svg_39333_13' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <circle cx='54' cy='98.5' fill='#ff0000' id='svg_39333_14' r='5' stroke='#000000' stroke-dasharray='2,2' stroke-linecap='null' stroke-linejoin='null' stroke-opacity='0' stroke-width='2'></circle>
  <foreignObject font-size='16' height='27' id='svg_39333_15' width='23' x='127' y='10.5'>
   <math display='inline' style='border: 2px solid red;' xmlns='http://www.w3.org/1998/Math/MathML'>
    <semantics>
     <mrow>
       <msub>
       <mi>v</mi>
       <mn>1</mn>
      </msub>
     </mrow>
     <annotation encoding='application/x-tex'>v_1</annotation>
    </semantics>
   </math>
  </foreignObject>
  <foreignObject font-size='16' height='27' id='svg_39333_16' width='23' x='177' y='70.5'>
   <math display='inline' style='border: 2px solid red;' xmlns='http://www.w3.org/1998/Math/MathML'>
    <semantics>
     <mrow>
      <msub>
       <mi>v</mi>
       <mn>2</mn>
      </msub>
     </mrow>
     <annotation encoding='application/x-tex'>v_2</annotation>
    </semantics>
   </math>
  </foreignObject>
  <foreignObject font-size='16' height='28' id='svg_39333_24' width='29' x='36' y='10.5'>
   <math display='inline' style='border: 2px solid red;' xmlns='http://www.w3.org/1998/Math/MathML'>
    <semantics>
     <mrow>
      <msub>
       <mi>v</mi>
       <mrow>
        <msub>
         <mi>n</mi>
         <mn>1</mn>
        </msub>
       </mrow>
      </msub>
     </mrow>
     <annotation encoding='application/x-tex'>v_{n_1}</annotation>
    </semantics>
   </math>
  </foreignObject>
 </g>
</svg>
</annotation-xml></semantics></mtd></mtr></mtable></mrow><mo>≡</mo><mrow><mo>(</mo><msup><mrow><mi>U</mi><mo stretchy='false'>(</mo><mi>k</mi><mo stretchy='false'>)</mo></mrow> <mrow><msub><mi>n</mi> <mn>1</mn></msub></mrow></msup><mo>,</mo><mo stretchy='false'>{</mo><msub><mi>v</mi> <mi>i</mi></msub><mo stretchy='false'>}</mo><mo>)</mo></mrow></mrow><annotation encoding='application/x-tex'>
\begin{matrix}
\begin{svg}
&lt;svg width=&quot;217&quot; height=&quot;193&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; xmlns:svg=&quot;http://www.w3.org/2000/svg&quot; xmlns:se=&quot;http://svg-edit.googlecode.com&quot; xmlns:math=&quot;http://www.w3.org/1998/Math/MathML&quot; se:nonce=&quot;39333&quot;&gt;
 &lt;g&gt;
  &lt;title&gt;Layer 1&lt;/title&gt;
  &lt;polygon stroke=&quot;#000000&quot; fill-opacity=&quot;0&quot; stroke-width=&quot;2&quot; points=&quot;161.71542358398438,97.5 134.3577117919922,144.88494873046875 79.64228820800781,144.88494873046875 52.284576416015625,97.5 79.64228820800781,50.11505126953125 134.3577117919922,50.11505126953125 161.71542358398438,97.5 &quot; fill=&quot;#000000&quot; id=&quot;svg_39333_2&quot;/&gt;
  &lt;line id=&quot;svg_39333_3&quot; y2=&quot;5.5&quot; x2=&quot;45&quot; y1=&quot;50.5&quot; x1=&quot;80&quot; fill-opacity=&quot;0&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;none&quot;/&gt;
  &lt;line id=&quot;svg_39333_4&quot; y2=&quot;3.5&quot; x2=&quot;164&quot; y1=&quot;48.5&quot; x1=&quot;134&quot; fill-opacity=&quot;0&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;none&quot;/&gt;
  &lt;line id=&quot;svg_39333_5&quot; y2=&quot;191.5&quot; x2=&quot;43&quot; y1=&quot;146.5&quot; x1=&quot;78&quot; fill-opacity=&quot;0&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;none&quot;/&gt;
  &lt;line id=&quot;svg_39333_6&quot; y2=&quot;192.5&quot; x2=&quot;170&quot; y1=&quot;147.5&quot; x1=&quot;135&quot; fill-opacity=&quot;0&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;none&quot;/&gt;
  &lt;line id=&quot;svg_39333_7&quot; y2=&quot;98.5&quot; x2=&quot;1&quot; y1=&quot;97.5&quot; x1=&quot;52&quot; fill-opacity=&quot;0&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;none&quot;/&gt;
  &lt;line id=&quot;svg_39333_8&quot; y2=&quot;97.5&quot; x2=&quot;216&quot; y1=&quot;97.5&quot; x1=&quot;163&quot; fill-opacity=&quot;0&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;none&quot;/&gt;
  &lt;circle stroke-opacity=&quot;0&quot; id=&quot;svg_39333_9&quot; r=&quot;5&quot; cy=&quot;49.5&quot; cx=&quot;80&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;#ff0000&quot;/&gt;
  &lt;circle id=&quot;svg_39333_10&quot; stroke-opacity=&quot;0&quot; r=&quot;5&quot; cy=&quot;49.5&quot; cx=&quot;134&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;#ff0000&quot;/&gt;
  &lt;circle id=&quot;svg_39333_11&quot; stroke-opacity=&quot;0&quot; r=&quot;5&quot; cy=&quot;98.5&quot; cx=&quot;162&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;#ff0000&quot;/&gt;
  &lt;circle id=&quot;svg_39333_12&quot; stroke-opacity=&quot;0&quot; r=&quot;5&quot; cy=&quot;145.5&quot; cx=&quot;135&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;#ff0000&quot;/&gt;
  &lt;circle id=&quot;svg_39333_13&quot; stroke-opacity=&quot;0&quot; r=&quot;5&quot; cy=&quot;145.5&quot; cx=&quot;79&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;#ff0000&quot;/&gt;
  &lt;circle id=&quot;svg_39333_14&quot; stroke-opacity=&quot;0&quot; r=&quot;5&quot; cy=&quot;98.5&quot; cx=&quot;54&quot; stroke-linecap=&quot;null&quot; stroke-linejoin=&quot;null&quot; stroke-dasharray=&quot;2,2&quot; stroke-width=&quot;2&quot; stroke=&quot;#000000&quot; fill=&quot;#ff0000&quot;/&gt;
  &lt;foreignObject height=&quot;27&quot; width=&quot;23&quot; font-size=&quot;16&quot; id=&quot;svg_39333_15&quot; y=&quot;10.5&quot; x=&quot;127&quot;&gt;
   &lt;math xmlns=&quot;http://www.w3.org/1998/Math/MathML&quot; display=&quot;inline&quot; style=&quot;border: 2px solid red&quot;&gt;
    &lt;semantics&gt;
     &lt;mrow&gt;
       &lt;msub&gt;
       &lt;mi&gt;v&lt;/mi&gt;
       &lt;mn&gt;1&lt;/mn&gt;
      &lt;/msub&gt;
     &lt;/mrow&gt;
     &lt;annotation encoding=&quot;application/x-tex&quot;&gt;v_1&lt;/annotation&gt;
    &lt;/semantics&gt;
   &lt;/math&gt;
  &lt;/foreignObject&gt;
  &lt;foreignObject id=&quot;svg_39333_16&quot; height=&quot;27&quot; width=&quot;23&quot; font-size=&quot;16&quot; y=&quot;70.5&quot; x=&quot;177&quot;&gt;
   &lt;math display=&quot;inline&quot; xmlns=&quot;http://www.w3.org/1998/Math/MathML&quot;style=&quot;border: 2px solid red&quot;&gt;
    &lt;semantics&gt;
     &lt;mrow&gt;
      &lt;msub&gt;
       &lt;mi&gt;v&lt;/mi&gt;
       &lt;mn&gt;2&lt;/mn&gt;
      &lt;/msub&gt;
     &lt;/mrow&gt;
     &lt;annotation encoding=&quot;application/x-tex&quot;&gt;v_2&lt;/annotation&gt;
    &lt;/semantics&gt;
   &lt;/math&gt;
  &lt;/foreignObject&gt;
  &lt;foreignObject id=&quot;svg_39333_24&quot; height=&quot;28&quot; width=&quot;29&quot; font-size=&quot;16&quot; y=&quot;10.5&quot; x=&quot;36&quot;&gt;
   &lt;math display=&quot;inline&quot; xmlns=&quot;http://www.w3.org/1998/Math/MathML&quot;  style=&quot;border: 2px solid red&quot;&gt;
    &lt;semantics&gt;
     &lt;mrow&gt;
      &lt;msub&gt;
       &lt;mi&gt;v&lt;/mi&gt;
       &lt;mrow&gt;
        &lt;msub&gt;
         &lt;mi&gt;n&lt;/mi&gt;
         &lt;mn&gt;1&lt;/mn&gt;
        &lt;/msub&gt;
       &lt;/mrow&gt;
      &lt;/msub&gt;
     &lt;/mrow&gt;
     &lt;annotation encoding=&quot;application/x-tex&quot;&gt;v_{n_1}&lt;/annotation&gt;
    &lt;/semantics&gt;
   &lt;/math&gt;
  &lt;/foreignObject&gt;
 &lt;/g&gt;
&lt;/svg&gt;
\end{svg}
\end{matrix}\equiv \left({U(k)}^{n_1},\{v_i\}\right)
</annotation></semantics></math>

distler added a commit to parasew/instiki that referenced this issue Aug 23, 2014
MathJax failed to parse the 'inner'
MathML, which led to bad rendering.
This fixes the problem in Safari and
ameliorates it in Chrome. See
mathjax/MathJax#896
for a discussion.
distler added a commit to distler/heterotic_beast that referenced this issue Aug 23, 2014
MathJax failed to parse the 'inner'
MathML, which led to bad rendering.
This fixes the problem in Safari and
ameliorates it in Chrome. See
mathjax/MathJax#896
for a discussion.
@distler
Copy link
Author

distler commented Mar 7, 2015

Wow. This has markedly regressed in MathJax 2.5.

@distler
Copy link
Author

distler commented Mar 7, 2015

FWIW, the SVG Renderer is much better than the others.

@distler
Copy link
Author

distler commented Apr 12, 2015

Is there any way to get this test-case to render under MathJax 2.5?

It rendered somewhere between acceptably and poorly (depending on the browser) under MathJax 2.4. But it doesn't render at all under 2.5, in any of the browsers I have tested.

@dpvc
Copy link
Member

dpvc commented Apr 12, 2015

The problem introduced in 2.5 is issue #1139, and it has been resolved by commit ed85cf6. This should be included in the next release.

@dpvc
Copy link
Member

dpvc commented Apr 12, 2015

PS, there is a way to get it to render with current v2.5.1: set the HTML-CSS noReflows parameter to false:

MathJax.Hub.Config({
  "HTML-CSS": {noReflows: false}
});

distler added a commit to parasew/instiki that referenced this issue Apr 12, 2015
Update to MathJax 2.5.1.
Implement fix per
  mathjax/MathJax#896 (comment)
@distler
Copy link
Author

distler commented Apr 12, 2015

Cool! Thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants