Using MathJax font in an inline SVG image

105 views
Skip to first unread message

Mr. Kenny

unread,
Jul 6, 2022, 6:50:57 AM7/6/22
to MathJax Users

Hi!

I’m trying to use the bundled MathJax fonts with an inline SVG. I’ve added the font using @font-face and the image displays correctly on most devices, as shown here.

temp_img.png

However, the text gets partially cut off only on iOS devices as follows.

temp_img2.png

I believe this issue was fixed in equations by adding “will-change:opacity” as discussed here and as committed here

However, as mjx-container is used in the above code, it evidently will have no effect on my SVG image.

I’ve tried both of the following to try to get it to work but neither changes anything.

svg{will-change:opacity;}

text{will-change:opacity;}

It’s also mentioned on the Github discussion page above that “transform: translateZ(0);” can also fix the equations. However, applying that to my SVG text simply makes the text disappear.

temp_img3.png

Any help would therefore be greatly appreciated, thanks!

Ciarán

Davide Cervone

unread,
Jul 11, 2022, 8:29:19 AM7/11/22
to mathja...@googlegroups.com
See my comment on your post at


Davide


On Jul 6, 2022, at 6:50 AM, Mr. Kenny <ciaran...@gmail.com> wrote:

Hi!

I’m trying to use the bundled MathJax fonts with an inline SVG. I’ve added the font using @font-face and the image displays correctly on most devices, as shown here.

<temp_img.png>

However, the text gets partially cut off only on iOS devices as follows.

<temp_img2.png>

I believe this issue was fixed in equations by adding “will-change:opacity” as discussed here and as committed here

However, as mjx-container is used in the above code, it evidently will have no effect on my SVG image.

I’ve tried both of the following to try to get it to work but neither changes anything.

svg{will-change:opacity;}

text{will-change:opacity;}

It’s also mentioned on the Github discussion page above that “transform: translateZ(0);” can also fix the equations. However, applying that to my SVG text simply makes the text disappear.

<temp_img3.png>

Any help would therefore be greatly appreciated, thanks!

Ciarán


--
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/786e8036-8311-41ff-b9f0-6365bd72424an%40googlegroups.com.
<temp_img2.png><temp_img.png><temp_img3.png>

Reply all
Reply to author
Forward
0 new messages