Triangle symbol padding

[st...@acm.org]

I'm having trouble displaying "△ABC" using MathJax. I'm using AsciiMath input for simplicity, with back-tick delimiters, and it's working very well for the rest of the math I want to display, except for the triangle symbol.

When I use `triangleABC`, the input jax seems to get it right, but my output looks like this: △ ABC, with extra spacing between the triangle symbol and the ABC. When I look at the MathJax output that appears on my web page, I see the triangle symbol is being rendered as follows:

<span id="MJXc-Node-46" class="mjx-mo" style="padding-left: 0.333em; padding-right: 0.333em;">
  <span class="mjx-char MJXc-TeX-main-R" style="padding-top: 0.415em; padding-bottom: 0.364em;">△</span>
</span>

I was able to change the style of mjx-mo nodes by adding a style sheet to my web page (thanks to this stackexchange page: https://stackoverflow.com/questions/19413989/css-for-mathjax )

<style type="text/css">
      .mjx-mo {
      padding-right: 0px !important;
      }
</style>

But this is no good, because it eliminates the right padding on a lot of other symbols. For instance, in y =3x +4 the spacing after the equal and plus signs is gone.

I spent quite a bit of time trying to find an easy way to post-process the MathJax output, figuring that I could use jQuery to find nodes that contain the triangle symbol and change their padding-right style. I couldn't find a simple example of how to do the post-processing, and I'm not expert enough in MathJax to figure it out without a lot of gnashing of teeth and pulling of hair. Besides, doing an entire post-processing step after MathJax runs seems like overkill.

My best strategy at the moment is to use a class (e.g., "rPad0") and specify this style:

<style type="text/css">
      .rPad0 .mjx-mo {
      padding-right: 0px !important;
      }
</style>

and then to enclose every MathJax element that contains a triangle symbol in an element with class="rPad0". For instance, <span class="rPad0">`triangleABC`</span>

This seems rather cumbersome, and will cause problems if I ever need to use △ABC in a MathJax expression that includes other operators.

Can anyone suggest a simpler solution?

PS. I know that I could use Delta: `DeltaABC`. But an upper-case Delta isn't really the same as a triangle symbol, and I'm too much of a stickler for good math notation to do this, except as a last resort.

[Davide Cervone]

I can see that you have worked hard to try to work around this, but modifying the CSS is the wrong approach.  MathJax is inserting that space for a reason, and you first need to understand why, then can solve it through appropriate configuration of MathJax.

AsciiMath turns your input into a MathML tree internally.  This is an XML format for mathematics that marks the different symbols as numbers, identifiers (e.g., variables or function names), operators (plus, minus, etc.), and so on.  AsciiMath marks the letters as identifiers, but most other symbols as operators (<mo> tags).  The spacing in a MathML expression is controlled by the operators, and MathML uses an operator dictionary to look up the spacing for each specific operator.  The operator dictionary has different values for when an operator is used as a prefix operator, an infix operator, or a postfix operator, but if the specific operator doesn't appear in the list for the proper position, the MathML specification says to look in the other forms for the operator.

It turns out that the triangle you are using (unicode U+25B3) only has an infix entry, and that has 1/3 em of spacing around it, so that is the spacing that is used for any position of the operator.  This is why MathJax is inserting the padding that you are seeing, and this is correct spacing according to the MathML specification.  Ideally, it would have different spacing for a prefix form, as you are using it here, but that is not included in the dictionary.

There are two possible solutions:  one would be to modify the dictionary to include a prefix form for U+25B3 with no spacing.  The other is to add a new command to AsciiMath that makes a triangle that is not an operator at all, but is an identifier, so that it doesn't get any spacing by default.

To do the second of these, add

<script type="text/x-mathjax-config">

MathJax.Hub.Register.StartupHook("AsciiMath Jax Ready",function () {

  var AM = MathJax.InputJax.AsciiMath.AM;

  AM.symbols.push({input:"tri",  tag:"mi", output:"\u25B3", tex:"triangle", ttype:AM.TOKEN.CONST});

  AM.refreshSymbols();

});

</script>

to your page just BEFORE the script that loads MathJax.js itself.  This sets up "tri" as an alternative to "triangle", but uses an identifier (<mi>) rather than an operator (<mo>) for the symbol.  That will avoid the spacing entirely.  This may be the best approach, since the MathML will render properly even if it is copied to a situation where MathJax isn't used to render it.  With this solution, use `tri ABC` to get your triangle.

On the other hand, you can use

<script type="text/x-mathjax-config">

MathJax.Hub.Register.StartupHook("mml Jax Ready",function () {

  var MML = MathJax.ElementJax.mml;

  MML.mo.Augment({OPTABLE: {

    prefix: {"\u25B3": MML.mo.OPTYPES.BIN01}

  }});

});

</script>

instead, which adds a prefix form of the triangle with no left spacing, and a small amount of right spacing (the spacing of a normal prefix operator).  Then you can use `triangle ABC` as you currently are.  But note that this solution only works within MathJax, so if the MathML is copied to another renderer, it will likely be displayed as MathJax currently does it.

Use whichever suits your needs.

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.
For more options, visit https://groups.google.com/d/optout.

[Scott Steketee]

Davide,

Thank you so very much for your clear explanation and two alternative approaches. I shall use the second approach (the one you recommend).

I am curious, however, about the first approach. As I understand your explanation, the standard MathML operator dictionary does not have an entry for the triangle symbol as a prefix operator. This seems to me a curious omission, as I can hardly be the first person wanting to use MathML to refer to a triangle by its three vertices. Certainly MathML has no problem interpreting ∠ABC correctly, which led me to wonder whether I should report the triangle-as-prefix issue to the appropriate working group — but then I read Peter Krautzberger’s post on why MathML is a failed web standard, and I realize that there’s little value in trying to do so.

So I’ll end by expressing once more my gratitude to you for your help in describing the two work-arounds, and my appreciation to the entire MathJax team for doing such a terrific job making it possible to render math properly on the web.

—Scott

[Davide Cervone]

As I understand your explanation, the standard MathML operator dictionary does not have an entry for the triangle symbol as a prefix operator.

That is correct.  The operator dictionary is described in Appendix C of the MathML3 spec

https://www.w3.org/TR/MathML3/appendixc.html

Note, however, this is non-normative, so it's not that you HAVE to use this version of the dictionary.  But for compatibility, most MathML renderers will.

This seems to me a curious omission, as I can hardly be the first person wanting to use MathML to refer to a triangle by its three vertices. Certainly MathML has no problem interpreting ∠ABC correctly,

Most of the symbols appear in only one form (except the most commonly used ones, and a quick check by eye suggests it is just, +, -, plus-minus, and minus-plus).  I have always thought the table was a bit slim in that sense, and was missing a lot of the prefix and postfix forms that would be useful.

One reason that I suspect there wasn't more care in constructing the table is that you can specify explicit spacing on the <mo> element via attributes, as in  <mo lspace="..." rspace="...">, so that you could use <mo lspace="0" rspace=".111em">&#x23B5;</mo> to get the prefix spacing, so the authors of the table didn't think it was a big deal to not have all the possible uses explicit in the table.  But when the MathML is being generated programmatically from some other format, as in AsciiMath, there may be no way to make such adjustments, and that makes things harder in practice.

As for the angle symbol, that appears in the table with only the prefix form, because that symbol really only has a prefix usage, whereas the triangle symbol, like the other geometric symbols such as square and circle, are used as infix operators, and so have the infix form (partly for consistency with the others, I'm sure).

Changes to the dictionary are certainly allowed, but do make your MathML somewhat less portable.

which led me to wonder whether I should report the triangle-as-prefix issue to the appropriate working group — but then I read Peter Krautzberger’s post on why MathML is a failed web standard, and I realize that there’s little value in trying to do so.

I don't think there is going to be much chance of changing the specification of the dictionary, especially since it is non-normative anyway.

So I’ll end by expressing once more my gratitude to you for your help in describing the two work-arounds, and my appreciation to the entire MathJax team for doing such a terrific job making it possible to render math properly on the web.

Thank you for your kind words; they are much appreciated.  We are glad that you have been able to make good use of it.

Davide