Re: [EXTERNAL] Notable mention of rich math applications, "details-on-demand"

Hi all,

I have been in touch with one of the article authors, Fred Hohman, on
Twitter, and they felt prompted to organize a fuller list of
references for "mathematical notation design" that he published today.
Hence, I am also forwarding here, for completeness of this email
thread:

https://github.com/fredhohman/awesome-mathematical-notation-design

The links contain largely a variety of visualizations for legends and
elaborations over math expressions and indeed include a reference to
Oliver Byrne's work that Patrick mentioned, among other more
modern/questionable experiments (such as differential equations with
emojis for variable names).

Enjoy,
Deyan

On Tue, Sep 15, 2020 at 8:10 PM Neil Soiffer <soiffer@alum.mit.edu> wrote:
>
> I heard back from Jonas and indeed it was hand drawn. He pointed me to a book he wrote about (I think) the importance of good illustrations in teaching science. It's in Lithuanian, but google can translate bits that you copy over pretty well. I think it would be a cool and useful tool to do this automatically or at least make it easy to do.
>
>     Neil
>
>
> On Tue, Sep 15, 2020 at 3:19 PM Neil Soiffer <soiffer@alum.mit.edu> wrote:
>>
>> Moritz,
>>
>> Thanks for the response. Drawing the math is (thankfully) easy to do these days. My question was focused on the annotations and how they got linked with the lines to each bit of math: was it hand drawn or was a program used. Given the state of things in 2013, I'd strongly suspect "hand drawn". I'll reach out to Jonas Liugaila via linkedin to verify my suspicion, but I don't see a contact for the second author (of the svg). If you know how to contact him, could you find out if he did it by hand or used a tool.
>>
>> Thanks,
>>
>>    Neil
>>
>>
>> On Tue, Sep 15, 2020 at 2:30 PM Moritz Schubotz <schubotz@ckurs.de> wrote:
>>>
>>> Hi Neil,
>>>
>>>
>>>
>>> from what was openly documented it appears that the image was
>>> originally a PNG generated by
>>> https://www.linkedin.com/in/jonasliugaila/ we could asked him which
>>> tool he did use?
>>>
>>>
>>>
>>> The PNG was then redrawn as SVG by this guy
>>>
>>> https://commons.wikimedia.org/wiki/User_talk:JTBarnabas
>>>
>>>  in 2013 and the exact value of c^2 was changed on August 21 this year.
>>>
>>>
>>>
>>> I am not sure, if I understand the data- annotations, comment. So I
>>> hope the rest of the email makes sense to you:
>>>
>>>
>>> The complete MathML expression of the example reads.
>>>
>>>
>>>
>>> '<math xmlns="http://www.w3.org/1998/Math/MathML" alttext="E=mc^{2}"
>>> display="inline">  <semantics id="e1">    <mrow id="e2" xref="e12">
>>>   <mi id="e3" xref="e14">E</mi>      <mo id="e4" xref="e13">=</mo>
>>>  <mrow id="e5" xref="e15">        <mi id="e6" xref="e17">m</mi>
>>> <mo id="e7" xref="e16">⁢</mo>        <msup id="e8" xref="e18">
>>>  <mi id="e9" xref="e20">c</mi>          <mn id="e10" xref="e21">2</mn>
>>>        </msup>      </mrow>    </mrow>    <annotation-xml
>>> encoding="MathML-Content" id="e11">      <apply id="e12" xref="e2">
>>>     <eq id="e13" xref="e4"/>        <csymbol cd="wikidata" id="e14"
>>> xref="e3">Q11379</csymbol>        <apply id="e15" xref="e5">
>>> <times id="e16" xref="e7"/>          <csymbol cd="wikidata" id="e17"
>>> xref="e6">Q11423</csymbol>          <apply id="e18" xref="e8">
>>>    <power id="e19" xref="e8"/>            <csymbol cd="wikidata"
>>> id="e20" xref="e9">Q2111</csymbol>            <cs id="e21"
>>> xref="e10">the integer number two</cs>          </apply>
>>> </apply>      </apply>    </annotation-xml>    <annotation
>>> encoding="application/x-tex" id="e22">E=mc^{2}</annotation>
>>> </semantics></math>'
>>>
>>>
>>>
>>> This was generated by LaTeXML and simplified by the node library
>>> mathml following this idea
>>>
>>>
>>>
>>>   const m = require('./MathML/MathMLReader);
>>>
>>>   const mml = m(xmlinput);
>>>
>>>   mml. simplifyIds('e'); (prefix to avoid name clashes for multiple
>>> formula on one page).
>>>
>>>
>>>
>>> In javascript your write element.xref to get the xref and you can use
>>> doc.getElementById(element.xref) to get from presentation to content
>>> and the other way round. How simple ist that?
>>>
>>>
>>>
>>> While I can see that element.data-annotation would be somehow less
>>> complex, I see additional complexity introduced by the proposals that
>>> try to reassemble the semantic tree in a data attribute that needs a
>>> special parser. While I can imagine cases where this third tree
>>> simplifies the applications we are targeting in some cases, I have the
>>> feeling that gathering information from three trees will be even more
>>> complicated than from two trees. So as long content-mathml is not
>>> entirely dead and removed from any future specs I don't see a real
>>> benefit in making things more complicated.
>>>
>>>
>>>
>>> Eventually to fetch to localized meanings of the expression, you need
>>> to query the Wikidata api with your target language. While this can
>>> not localize canonical MathML there is an open editable mapping
>>> between the canonical MathML and Wikidata ids exists here
>>> https://w.wiki/cGQ.
>>>
>>> Moritz
>>>
>>>
>>>
>>>
>>>
>>>
>>> > -----Original Message-----
>>> > From: Neil Soiffer <soiffer@alum.mit.edu>
>>> > Sent: Tuesday, September 15, 2020 1:54 AM
>>> > To: Physikerwelt <wiki@physikerwelt.de>
>>> > Cc: Patrick Ion <pion@umich.edu>; Murray Sargent
>>> > <murrays@exchange.microsoft.com>; Deyan Ginev <deyan.ginev@gmail.com>;
>>> > public-mathml4@w3.org
>>> > Subject: Re: [EXTERNAL] Notable mention of rich math applications,
>>> > "details-
>>> > on-demand"
>>> >
>>> > Moritz,
>>> >
>>> > I'm interested in how an image in the linked article
>>> > <https://upload.wikimedia.org/wikipedia/commons/thumb/c/c9/E%3Dmc%C2
>>> > %B2-explication.svg/236px-E%3Dmc%C2%B2-explication.svg.png>  was
>>> > generated. Based on the link name, it seems to have come from svg and
>>> > converted to png, but how was the SVG generated? Is there a program that
>>> > links the text to the displayed math? E.g, I can imagine something like
>>> >    <mi data-annotation="mass">m</mi>
>>> > or
>>> >    <mi data-annotation-id="someID">m</mi>
>>> >
>>> > or something equivalent involving wrapping <semantics> around each mi and
>>> > having some JS or other code connect the pieces. On the other hand, I can
>>> > more easily imagine that someone used a drawing tool to add the
>>> > annotations and lines to an image of the math.
>>> >
>>> > If the former exists, I'd appreciate a pointer to the tool. If it doesn't
>>> > exist, it
>>> > would be a really cool tool to develop.
>>> >
>>> >     Neil
>>> >
>>> >
>>> > On Sun, Sep 13, 2020 at 11:12 PM Physikerwelt <wiki@physikerwelt.de
>>> > <mailto:wiki@physikerwelt.de> > wrote:
>>> >
>>> >
>>> >       Hi Deyan,
>>> >
>>> >       a nice example. However, can't we represent that with the current
>>> >       MathML standard.
>>> >
>>> >       For Wikipedia, we have the semantic annotations, e.g., by clicking on
>>> >       the first formula in Mass Energy Equivalence you will be redirected to
>>> >
>>> >       https://en.wikipedia.org/wiki/Mass%E2%80%93energy_equivalence
>>> >
>>> >       or
>>> >
>>> >       https://de.wikipedia.org/w/index.php?title=Special:MathWikibase&qi
>>> > d=Q35875
>>> >
>>> >       or
>>> >
>>> >       https://ru.wikipedia.org/w/index.php?title=Special:MathWikibase&qi
>>> > d=Q35875
>>> >
>>> >       and so on depending on your language preferences. Of course, this is
>>> >       supposed to become a popup, but the code review did not go
>>> > through
>>> >       since the js code was a few bytes too heavy.
>>> >
>>> >       Eventually, we can translate this into content MathML.
>>> >
>>> >
>>> >           <annotation-xml encoding="MathML-Content" id="e11">
>>> >             <apply id="e12" xref="e2">
>>> >               <eq id="e13" xref="e4"/>
>>> >               <csymbol cd="wikidata" id="e14" xref="e3">Q11379</csymbol>
>>> >               <apply id="e15" xref="e5">
>>> >                 <times id="e16" xref="e7"/>
>>> >                 <csymbol cd="wikidata" id="e17" xref="e6">Q11423</csymbol>
>>> >                 <apply id="e18" xref="e8">
>>> >                   <power id="e19" xref="e8"/>
>>> >                   <csymbol cd="wikidata" id="e20" xref="e9">Q2111</csymbol>
>>> >                   <cs id="e21" xref="e10">the integer number two</cs><!--
>>> >       this was somehow a standard violation to demo clear text in the
>>> > popup
>>> >       -->
>>> >                 </apply>
>>> >               </apply>
>>> >             </apply>
>>> >           </annotation-xml>
>>> >
>>> >       However, not in production since we rely on LaTeXML, and we can not
>>> >       run PERL in production WMF sites. We, therefore, use the 'has part'
>>> >       property of the related Wikidata item
>>> >       https://www.wikidata.org/wiki/Q35875.
>>> >
>>> >       For more complex formulae like
>>> >
>>> >       https://en.wikipedia.org/w/index.php?title=Special:MathWikibase&qi
>>> > d=Q1899432
>>> >
>>> >       , the problem is that there were missing symbols, thus we had to
>>> >       create new symbols
>>> >       https://www.wikidata.org/wiki/Q85397895 with unfortunately very
>>> > few
>>> >       semantic connections to more general symbols, and no translations
>>> > yet.
>>> >       Thus these annotations are almost dead ends in the knowledge
>>> > graph.
>>> >
>>> >
>>> >       Greetings
>>> >       Moritz
>>> >
>>> >       http://moritzschubotz.de | +49 1578 047 1397
>>> >
>>> >       On Mon, Sep 14, 2020 at 6:13 AM Neil Soiffer <soiffer@alum.mit.edu
>>> > <mailto:soiffer@alum.mit.edu> > wrote:
>>> >       >
>>> >       > Deyan,
>>> >       >
>>> >       > I really like the toggle notation/variable feature. I think it is
>>> > better
>>> > than pop ups for this purpose because you can see the context better. It
>>> > is
>>> > something that widespread support of MathML will enable because then
>>> > people can count on where something is and could do text layout around the
>>> > math and have the other end of the arrow actually point to somewhere near
>>> > the math symbol/term and know it will work in all the browsers. When the
>>> > math input gets converted to something else such as spans, you can't do
>>> > that.
>>> >       >
>>> >       > I'm not a fan of the colorized-math-equations, but maybe people
>>> > who see colors better than I do would like it. I find it way too busy,
>>> > distracting, and hard to read.
>>> >       >
>>> >       > To follow up on Patrick's link for Euclid's Elements. A friend of mine
>>> > did something for a "live" (colored) version of Euclid's elements where
>>> > you
>>> > can play around with the diagrams. He published in the Apple App Store.
>>> > It's
>>> > not free though (it's $6). I've played with it some during development and
>>> > found it quite interesting.
>>> >       >
>>> >       >     Neil
>>> >       >
>>> >       >
>>> >       > On Sun, Sep 13, 2020 at 12:28 PM Patrick Ion <pion@umich.edu
>>> > <mailto:pion@umich.edu> > wrote:
>>> >       >>
>>> >       >> Thanks, Deyan, for bringing a modern document form to
>>> >       >> our attention, and not just for the math relevance.
>>> >       >>
>>> >       >> I can't resist bringing up a bit of history in regard to
>>> >       >> colored math.  A significant earlier work was
>>> >       >> Oliver Byrne's version of Euclid (which I saw
>>> >       >> in Cork), written while he was Surveyor of the
>>> >       >> Falkland Islands,
>>> >       >>
>>> >       >> https://www.c82.net/euclid/
>>> >       >> see also
>>> >       >>
>>> > https://www.princeton.edu/~graphicarts/2008/05/euclid_in_color.html
>>> >       >>
>>> >       >> Note: it really gets going with Book II in using
>>> >       >> colored symbols.  You can buy a copy these days:
>>> >       >>
>>> >       >> https://www.amazon.com/Oliver-Byrne-First-Elements-
>>> > Euclid/dp/3836544717
>>> >       >>
>>> >       >> David Joyce (https://mathcs.clarku.edu/~djoyce/)
>>> >       >> did his early Java applet-based Euclid with colors in the diagrams
>>> >       >> https://mathcs.clarku.edu/~djoyce/java/elements/elements.html
>>> >       >>
>>> >       >> Then there was the idea discussed years ago at a Paris TeX
>>> >       >> meeting of using color to indicate, say, for a Lie group $G$,
>>> >       >> its Lie algebra as $\color{green}G$, its enveloping algebra
>>> >       >> by $\color{red}G$, its representation ring by $\color{orange}G$
>>> >       >> and so on.  I may have seen this style actually used in practice,
>>> >       >> but cannot recall a definite reference at present.
>>> >       >>
>>> >       >> All the best,
>>> >       >>
>>> >       >>    Patrick
>>> >       >>
>>> >       >>
>>> >       >>
>>> >       >> On Sat, Sep 12, 2020 at 9:44 PM Murray Sargent
>>> > <murrays@exchange.microsoft.com
>>> > <mailto:murrays@exchange.microsoft.com> > wrote:
>>> >       >>>
>>> >       >>> Very cool stuff. A less difficult way of achieving the pop-up
>>> > annotations of the first link is to put href’s on the variables. Perhaps
>>> > that’s
>>> > what Bruce and David are doing…
>>> >       >>>
>>> >       >>>
>>> >       >>>
>>> >       >>> Thanks,
>>> >       >>>
>>> >       >>> Murray
>>> >       >>>
>>> >       >>>
>>> >       >>>
>>> >       >>> From: Deyan Ginev
>>> >       >>> Sent: Friday, September 11, 2020 9:25 AM
>>> >       >>> To: public-mathml4@w3.org <mailto:public-mathml4@w3.org>
>>> >       >>> Subject: [EXTERNAL] Notable mention of rich math applications,
>>> > "details-on-demand"
>>> >       >>>
>>> >       >>>
>>> >       >>>
>>> >       >>> Dear MathML Refresh enthusiasts,
>>> >       >>>
>>> >       >>> A very pleasing review article was published at DistillPub today,
>>> >       >>> examining the various communication aspects of "interactive
>>> > articles".
>>> >       >>>
>>> >       >>> In Figure 8 they have a small SVG showcase of a feature some of
>>> > us
>>> >       >>> here have experimented with in the past via MathML, providing a
>>> > short
>>> >       >>> "legend" of each constituent of a math expression.
>>> >       >>>
>>> >       >>> Pieces of their example directly overlap with our main scope
>>> > (names
>>> >       >>> for dot product, integral over closed surface), and pieces are in
>>> > the
>>> >       >>> gray zone we are currently discussing (q is "the amount of charge
>>> > in
>>> >       >>> coulombs")
>>> >       >>>
>>> >       >>>
>>> > https://nam06.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdistill.
>>> > pub%2F2020%2Fcommunicating-with-interactive-articles%2F%23details-
>>> > math&amp;data=02%7C01%7Cmurrays%40exchange.microsoft.com%7C416ae
>>> > 94ca77c4468495908d8566f4e0a%7C72f988bf86f141af91ab2d7cd011db47%7C0
>>> > %7C0%7C637354383352852160&amp;sdata=RlIcBzOkmBNSBBrfnQkMNL9xn19t
>>> > JmnhdVCRBXMCcKc%3D&amp;reserved=0
>>> >       >>>
>>> >       >>> They also linked to a nice older resource I remember, which
>>> > seemingly
>>> >       >>> introduced the didactic technique of coloring math in web
>>> > documents
>>> >       >>> with colored text in parallel:
>>> >       >>>
>>> >       >>>
>>> > https://nam06.safelinks.protection.outlook.com/?url=https%3A%2F%2Fbetter
>>> > explained.com%2Farticles%2Fcolorized-math-
>>> > equations%2F&amp;data=02%7C01%7Cmurrays%40exchange.microsoft.com%
>>> > 7C416ae94ca77c4468495908d8566f4e0a%7C72f988bf86f141af91ab2d7cd011d
>>> > b47%7C0%7C0%7C637354383352852160&amp;sdata=DPD2kOpiBDb6VGEuhjo
>>> > pZUKevR9U1vBGnPG3%2FcqLnIs%3D&amp;reserved=0
>>> >       >>>
>>> >       >>> One thing to remark is that this "details-on-demand" application
>>> > is
>>> >       >>> out-of-scope for our "a11y semantics" charter. At the same time,
>>> > the
>>> >       >>> application is - at least in my mind - requiring the same "degree
>>> > of
>>> >       >>> annotation" to be enabled, as the minimal requirements are 1)
>>> > knowing
>>> >       >>> the operator structure/content tree and 2) knowing the
>>> >       >>> names/properties of the constituent objects. So this may be a
>>> >       >>> "sibling" or "cousin" application to the a11y/information retrieval
>>> >       >>> applications we've been discussing.
>>> >       >>>
>>> >       >>> Something to chew on, and wishing everyone a great weekend!
>>> >       >>>
>>> >       >>> Greetings,
>>> >       >>> Deyan
>>> >       >>>
>>> >       >>>
>>> >

Received on Monday, 28 September 2020 19:10:28 UTC