Mathml to Alt text

146 views
Skip to first unread message

Sri Krishnan

unread,
Aug 3, 2024, 8:41:38 AM8/3/24
to MathJax Users
Hi All,

When I try to create mml to svg. svg created successfully. But Alt text is not generated. there is an "Undefined" error appearing at the start. Is there any possibility to generate "alt text" from Mathml using MathJax?

My syntax and output in "CMD" is as follows:

C:\MathJax-demos-node\speech>node -r esm mml2svg "<math><mml:msup><mml:mi>a</mml:mi><mml:mn>2</mml:mn></mml:msup><mml:mo>+</mml:mo><mml:msup><mml:mi>b</mml:mi><mml:mn>2</mml:mn></mml:msup></math>"
undefined
<svg style="vertical-align: -0.186ex;" xmlns="http://www.w3.org/2000/svg" width="6.908ex" height="2.072ex" focusable="false" viewBox="0 -833.9 3053.6 915.9" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style>svg a{fill:blue;stroke:blue}[data-mml-node="merror"]>g{fill:red;stroke:red}[data-mml-node="merror"]>rect[data-background]{fill:yellow;stroke:none}[data-frame],[data-line]{stroke-width:70px;fill:none}.mjx-dashed{stroke-dasharray:140}.mjx-dotted{stroke-linecap:round;stroke-dasharray:0,140}use[data-c]{stroke-width:3px}</style><path id="MJX-1-TEX-I-1D44E" d="M33 157Q33 258 109 349T280 441Q331 441 370 392Q386 422 416 422Q429 422 439 414T449 394Q449 381 412 234T374 68Q374 43 381 35T402 26Q411 27 422 35Q443 55 463 131Q469 151 473 152Q475 153 483 153H487Q506 153 506 144Q506 138 501 117T481 63T449 13Q436 0 417 -8Q409 -10 393 -10Q359 -10 336 5T306 36L300 51Q299 52 296 50Q294 48 292 46Q233 -10 172 -10Q117 -10 75 30T33 157ZM351 328Q351 334 346 350T323 385T277 405Q242 405 210 374T160 293Q131 214 119 129Q119 126 119 118T118 106Q118 61 136 44T179 26Q217 26 254 59T298 110Q300 114 325 217T351 328Z"></path><path id="MJX-1-TEX-N-32" d="M109 429Q82 429 66 447T50 491Q50 562 103 614T235 666Q326 666 387 610T449 465Q449 422 429 383T381 315T301 241Q265 210 201 149L142 93L218 92Q375 92 385 97Q392 99 409 186V189H449V186Q448 183 436 95T421 3V0H50V19V31Q50 38 56 46T86 81Q115 113 136 137Q145 147 170 174T204 211T233 244T261 278T284 308T305 340T320 369T333 401T340 431T343 464Q343 527 309 573T212 619Q179 619 154 602T119 569T109 550Q109 549 114 549Q132 549 151 535T170 489Q170 464 154 447T109 429Z"></path><path id="MJX-1-TEX-N-2B" d="M56 237T56 250T70 270H369V420L370 570Q380 583 389 583Q402 583 409 568V270H707Q722 262 722 250T707 230H409V-68Q401 -82 391 -82H389H387Q375 -82 369 -68V230H70Q56 237 56 250Z"></path><path id="MJX-1-TEX-I-1D44F" d="M73 647Q73 657 77 670T89 683Q90 683 161 688T234 694Q246 694 246 685T212 542Q204 508 195 472T180 418L176 399Q176 396 182 402Q231 442 283 442Q345 442 383 396T422 280Q422 169 343 79T173 -11Q123 -11 82 27T40 150V159Q40 180 48 217T97 414Q147 611 147 623T109 637Q104 637 101 637H96Q86 637 83 637T76 640T73 647ZM336 325V331Q336 405 275 405Q258 405 240 397T207 376T181 352T163 330L157 322L136 236Q114 150 114 114Q114 66 138 42Q154 26 178 26Q211 26 245 58Q270 81 285 114T318 219Q336 291 336 325Z"></path></defs><g stroke="currentColor" fill="currentColor" stroke-width="0" transform="scale(1,-1)"><g data-mml-node="math" aria-label="a squared plus b squared" role="img"><g data-mml-node="msup"><g data-mml-node="mi"><use data-c="1D44E" xlink:href="#MJX-1-TEX-I-1D44E"></use></g><g data-mml-node="mn" transform="translate(562,363) scale(0.707)"><use data-c="32" xlink:href="#MJX-1-TEX-N-32"></use></g></g><g data-mml-node="mo" transform="translate(1187.8,0)"><use data-c="2B" xlink:href="#MJX-1-TEX-N-2B"></use></g><g data-mml-node="msup" transform="translate(2188,0)"><g data-mml-node="mi"><use data-c="1D44F" xlink:href="#MJX-1-TEX-I-1D44F"></use></g><g data-mml-node="mn" transform="translate(462,363) scale(0.707)"><use data-c="32" xlink:href="#MJX-1-TEX-N-32"></use></g></g></g></g></svg>

image.png

regards,
Srikrishnan

Davide Cervone

unread,
Aug 6, 2024, 8:55:39 AM8/6/24
to mathja...@googlegroups.com
It looks like someone left a debugging console.log call in mml2svg that is causing the "undefined" message.  Remove the line

console.log(argv.container);

near the bottom of the file to get rid of that.

As for the speech text, it is not added to an ALTTEXT attribute, but to an ARIA-LABEL, and that is on the SVG node that corresponds to the <math> tag in the SVG output.  You can see it on the <g> tag with data-mml-node="math" in the output that you have presented.  I show it in red below.  You can, of course, get the aria-label text and move it to an alttext attribute if you want.

Davide

Sri Krishnan

unread,
Aug 7, 2024, 10:13:29 AM8/7/24
to mathja...@googlegroups.com
Hi Davide,

Thanks for your valuable response. it would be really very helpful. 
regards,
Srikrishnan

--
You received this message because you are subscribed to the Google Groups "MathJax Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mathjax-user...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/mathjax-users/E49FFB9A-774A-49AE-BE89-F6519FEA4E2B%40gmail.com.

Sri Krishnan

unread,
Aug 8, 2024, 11:02:17 PM8/8/24
to MathJax Users
Hi Davide,

it works in the previous sample case, but not for all cases. for e.g. in the below case "aria-label" attribute is empty in the svg output:

C:\MathJax-demos-node\speech>node -r esm mml2svg "<math><mml:msup><mml:mrow><mml:mo stretchy="false">(</mml:mo><mml:mrow><mml:mi>a</mml:mi><mml:mo>+</mml:mo><mml:mi>b</mml:mi></mml:mrow><mml:mo stretchy="false">)</mml:mo></mml:mrow><mml:mn>2</mml:mn></mml:msup><mml:mo>=</mml:mo><mml:mrow><mml:msup><mml:mi>A</mml:mi><mml:mn>2</mml:mn></mml:msup><mml:mo>+</mml:mo><mml:msup><mml:mi>b</mml:mi><mml:mn>2</mml:mn></mml:msup><mml:mo>+</mml:mo><mml:mrow><mml:mn>2</mml:mn><mml:mo>&#x2062;</mml:mo><mml:mi>a</mml:mi><mml:mo>&#x2062;</mml:mo><mml:mi>b</mml:mi></mml:mrow></mml:mrow></math>"
<svg style="vertical-align: -0.452ex;" xmlns="http://www.w3.org/2000/svg" width="5.43ex" height="2.149ex" focusable="false" viewBox="0 -750 2400 950" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style>svg a{fill:blue;stroke:blue}[data-mml-node="merror"]>g{fill:red;stroke:red}[data-mml-node="merror"]>rect[data-background]{fill:yellow;stroke:none}[data-frame],[data-line]{stroke-width:70px;fill:none}.mjx-dashed{stroke-dasharray:140}.mjx-dotted{stroke-linecap:round;stroke-dasharray:0,140}use[data-c]{stroke-width:3px}</style></defs><g stroke="currentColor" fill="currentColor" stroke-width="0" transform="scale(1,-1)"><g data-mml-node="math" aria-label="" role="img"><g data-mml-node="merror"><rect data-background="true" width="2400" height="950" y="-200"></rect><g data-mml-node="mtext" style="font-family: serif;"><text data-variant="-explicitFont" transform="scale(1,-1)" font-size="884px">msup</text></g></g></g></g></svg>

regards,
Srikrishnan

Davide Cervone

unread,
Aug 9, 2024, 7:59:52 AM8/9/24
to mathja...@googlegroups.com
From the SVG generated, it looks like the MathML has produced an error (referring to an msup), so the output is being generated from <math><merror><mtext>msup</mtex></merror></math>.  It looks like the speech-rule-engine doesn't produce speech for <merror> nodes, which is why the aria-label is blank.

The reason you are getting in error is because the MathML includes quotation marks (e.g., stretchy="false"), and you are using quotation marks to delimit the MathML for your command line argument,.  So your first argument probably is being germinated at the end of stretchy= giving you effectively just <math><msup><mo stretchy, which is not valid MathML.  So try using stretchy=\"false\" in the two places it occurs and see if that helps.

I haven't actually tried it on Windows, but that's my guess as to what is happening.

Davide



--
You received this message because you are subscribed to the Google Groups "MathJax Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mathjax-user...@googlegroups.com.

Sri Krishnan

unread,
Aug 12, 2024, 9:11:03 AM8/12/24
to mathja...@googlegroups.com
Hi Davide,

it works in the previous sample case, but not for all cases. for e.g. in the below case "aria-label" attribute is empty in the svg output:

C:\MathJax-demos-node\speech>node -r esm mml2svg "<math><mml:msup><mml:mrow><mml:mo stretchy="false">(</mml:mo><mml:mrow><mml:mi>a</mml:mi><mml:mo>+</mml:mo><mml:mi>b</mml:mi></mml:mrow><mml:mo stretchy="false">)</mml:mo></mml:mrow><mml:mn>2</mml:mn></mml:msup><mml:mo>=</mml:mo><mml:mrow><mml:msup><mml:mi>A</mml:mi><mml:mn>2</mml:mn></mml:msup><mml:mo>+</mml:mo><mml:msup><mml:mi>b</mml:mi><mml:mn>2</mml:mn></mml:msup><mml:mo>+</mml:mo><mml:mrow><mml:mn>2</mml:mn><mml:mo>&#x2062;</mml:mo><mml:mi>a</mml:mi><mml:mo>&#x2062;</mml:mo><mml:mi>b</mml:mi></mml:mrow></mml:mrow></math>"
<svg style="vertical-align: -0.452ex;" xmlns="http://www.w3.org/2000/svg" width="5.43ex" height="2.149ex" focusable="false" viewBox="0 -750 2400 950" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style>svg a{fill:blue;stroke:blue}[data-mml-node="merror"]>g{fill:red;stroke:red}[data-mml-node="merror"]>rect[data-background]{fill:yellow;stroke:none}[data-frame],[data-line]{stroke-width:70px;fill:none}.mjx-dashed{stroke-dasharray:140}.mjx-dotted{stroke-linecap:round;stroke-dasharray:0,140}use[data-c]{stroke-width:3px}</style></defs><g stroke="currentColor" fill="currentColor" stroke-width="0" transform="scale(1,-1)"><g data-mml-node="math" aria-label="" role="img"><g data-mml-node="merror"><rect data-background="true" width="2400" height="950" y="-200"></rect><g data-mml-node="mtext" style="font-family: serif;"><text data-variant="-explicitFont" transform="scale(1,-1)" font-size="884px">msup</text></g></g></g></g></svg>

regards,
Srikrishnan

--
You received this message because you are subscribed to the Google Groups "MathJax Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mathjax-user...@googlegroups.com.

Sri Krishnan

unread,
Aug 12, 2024, 9:11:03 AM8/12/24
to mathja...@googlegroups.com
Hi Davide Cervone,

Thanks for your reply. 

sorry. for my ignorance. It works.

Just for your information: I noticed two issues in TeX to MML conversion and MML to SVG conversion in MathJaX. Actually, that mathml I generated using mathjax. From TeX to Mathml conversion I found extra multiplication symbols between "2ab" "<mo>&#x2062;</mo>". Also when i converted from MML to SVG. in SVG output a square and b square appears in caps.
image.png
C:\MathJax-demos-node\speech>node -r esm tex2mml "(a+b)^2=a^2+b^2+2ab"
<math xmlns="http://www.w3.org/1998/Math/MathML" display="block" data-semantic-speech="left parenthesis a plus b right parenthesis squared equals a squared plus b squared plus 2 a b">
  <msup>
    <mrow>
      <mo stretchy="false">(</mo>
      <mrow>
        <mi>a</mi>
        <mo>+</mo>
        <mi>b</mi>
      </mrow>
      <mo stretchy="false">)</mo>
    </mrow>
    <mn>2</mn>
  </msup>
  <mo>=</mo>
  <mrow>
    <msup>
      <mi>a</mi>
      <mn>2</mn>
    </msup>
    <mo>+</mo>
    <msup>
      <mi>b</mi>
      <mn>2</mn>
    </msup>
    <mo>+</mo>
    <mrow>
      <mn>2</mn>
      <mo>&#x2062;</mo>
      <mi>a</mi>
      <mo>&#x2062;</mo>
      <mi>b</mi>
    </mrow>
  </mrow>
</math>

Davide Cervone

unread,
Aug 16, 2024, 7:08:36 PM8/16/24
to mathja...@googlegroups.com
The <mo>&#x2062</mo> are correct and are part of the semantic enrichment that the speech-rule-engine that underlies MathJax's conversion to speech provides.  These are semantically correct, and improves the meaning of the generated MathML.  But you can certainly filter them out if you wish.

I am not able to reproduce your issue with A^2.  Can you provide a link to a page that exhibits the issue?

Davide


On Aug 9, 2024, at 9:28 AM, Sri Krishnan <rsk....@gmail.com> wrote:

Hi Davide Cervone,

Thanks for your reply. 

sorry. for my ignorance. It works.

Just for your information: I noticed two issues in TeX to MML conversion and MML to SVG conversion in MathJaX. Actually, that mathml I generated using mathjax. From TeX to Mathml conversion I found extra multiplication symbols between "2ab" "<mo>&#x2062;</mo>". Also when i converted from MML to SVG. in SVG output a square and b square appears in caps.
Reply all
Reply to author
Forward
0 new messages