Escape to HTML
Blackheart
that is, something like \mathrm{foo} or \text{foo}, except that "foo"
will be styled as it would normally be in that position in the HTML.
In my case, "foo" is always ordinary inline text -- no elements and no
CSS boxes. Is there a way to do this?
Here is my motivation. I am writing a document about programming
language theory, and so I have many mathematical formulae which denote
propositions about programs. So I am treating programs as
mathematical objects. Therefore, I have some source text fragments
which occur (logically) as subexpressions of mathematical expressions.
The way I want to do this is basically:
<code>$t = (\HTML{fn x => x})$</code>
so that the bit inside \HTML{...} is formatted as code. (I have
already configured MathJax to process inside code elements and to
process $ as delimiters.) If use, say, \text instead here, though, the
font will not match styling used in
<code>fn x => x</code>
Ideally, actually, I would like to be able to write
$t = (\HTML{<code>fn x => x</code>})$
or even something like quasiquotation, where I can nest math inside
HTML inside math inside HTML:
blah \(t = (\HTML{<code>fn x => \(t'\)</code>})\) blah
At the moment, my workaround is to break it up:
blah <code>$t = ($fn x => x$)$</code> blah
but this, of course, causes problems with spacing, doesn't really
extend to displays, and is moreover tedious to write.
Jan
> I'm looking for a way to escape to HTML from within a TeX expression,
> that is, something like \mathrm{foo} or \text{foo}, except that "foo"
> will be styled as it would normally be in that position in the HTML.
> In my case, "foo" is always ordinary inline text -- no elements and no
> CSS boxes. Is there a way to do this?
insert SVG images (i.e. DOM nodes) into mathematical formulas. My
workaround (for the MathML renderer, though) is as follows:
* insert <mspace>s with the appropriate dimensions (trivial for
images, but you could easily figure it out for text as well using some
JavaScript), and
* after rendering by MathJax, inject the desired code into the <span>
elements generated from the <mspace>s.
There are two main restrictions so far: It only works with MathML
input (but there might be an equivalent to <mspace> in TeX as well)
and it needs the HTML renderer of Mathics (to be able to "tweak" the
result).
Of course, native support for HTML/DOM element injection would be much
better...
Davide P. Cervone
HTML can not be embedded in MathML (except in something like a
<semantics> tag), you will not be able to include HTML within a
MathJax expression. Furthermore, because of the nesting of elements,
and the styling in effect on outer ones, you can not get back to the
style of the surrounding text within a MathJax expression. There is,
however, another approach that should do what you need. You can style
the inner expression so as to provide a font that matches the
surrounding text.
One approach would be to set up a style like the following as part of
your configuration:
MathJax.Hub.Config({
...
"HTML-CSS": {
styles: {
".MathJax .code": {
"font-family": "Courier ! important"
}
}
}
});
and then use
\class{code}{\text{...}}
to typeset the material that should be in the courier font. You could
make a macro that does this, as in:
MathJax.Hub.Config({
TeX: {
Macros: {
CODE: ["\\class{code}{\\text{#1}}",1]
}
}
});
so that \CODE{...} would typeset its contents in the courier font.
Note that you can use $...$ or \(...\) within the \CODE{...} to switch
back to mathematics:
$ t = (\CODE{fn x => \(t'\)}) $
so I think this covers the situations you need. The only issue is
that you need to know the font used by default for <code> blocks.
That may mean you need to use CSS to set this explicitly for the code
blocks so that you are sure to match it within the mathematics.
Because MathJax scales the mathematics to match the surrounding text,
you may also find that the size of the \CODE{...} text is not quite
the same as the surrounding text. In that case, you may need to add a
font-size style as well to compensate.
It would also be possible to use
\style{font-family:Courier!important}{\text{...}}
rather than setting a style, but styling may give you more flexibility
in the long run.
Hope that does what you need.
Davide
Davide P. Cervone
> I had a related problem working on mathics.net, where I wanted to
> insert SVG images (i.e. DOM nodes) into mathematical formulas. My
> workaround (for the MathML renderer, though) is as follows:
>
> * insert <mspace>s with the appropriate dimensions (trivial for
> images, but you could easily figure it out for text as well using some
> JavaScript), and
> * after rendering by MathJax, inject the desired code into the <span>
> elements generated from the <mspace>s.
That is clever, and I wouldn't have thought of it.
I suppose the proper hook for this sort of thing is the <semantics>
element, but it has always been somewhat mysterious to me, and I
haven't taken time to really look into what the proper action should
be for non-MathML children. Certainly support for it could be
improved in the HTML-CSS output jax. One thing I worry about, though,
is compatibility with the NativeMML output. I don't like to extend
the HTML-CSS output too far beyond what is available in native MathML,
since many people are using that for speed purposes. If HTML-CSS
handles extra content in <semantics> that native MathML doesn't then
that will break sites for those using browsers with native MathML
support.
> There are two main restrictions so far: It only works with MathML
> input (but there might be an equivalent to <mspace> in TeX as well)
One could use \hskip to produce <mspace> in the output.
> and it needs the HTML renderer of Mathics (to be able to "tweak" the
> result).
Right.
> Of course, native support for HTML/DOM element injection would be much
> better...
Indeed.
Davide
Blackheart
Thanks for the hint. I think this does indeed cover all my needs.