GUI Text rendering problem in WebGL

Questions & Answers
1

I’m having an issue when exporting to WebGL in which it appears certain letters of certain text fields are being clipped out and not rendering. I haven’t found anyone else to have encountered this and have done a great many WebGL builds with GUI Text and this is the first time I’ve faced this problem myself.

The text renders fine in Editor (and Standalone):

79571-good.png
79571-good.png860×586 141 KB

But I get this in WebGL:

79572-bad.png
79572-bad.png1030×619 125 KB

A few troubleshooting steps I’ve already tried:

  • Ensured that Vertical and Horizontal Overflow are set to “Overflow”
  • Used “Best Fit” setting, with a minimum font size of 0
  • Switched out for other fonts; the problem persists with all of the custom fonts I have as well as the standard Arial

Extra things I should note:

  • This problem arose after the project was already well underway, though I haven’t yet been able to pinpoint exactly when (Sorry!)
  • I’m using version 5.4.1f1, but the problem arose in 5.4.0f3
  • I’m locked into a non-standard resolution for the WebGL build (1150x692)

Has anyone seen anything like this or have an idea what might be causing it?

2

Just got the same problem with my webGL build in Unity 5.4.2p4. Did you find a fix? It’s not consistent for me, broken on some screens, not on others.

I did notice that if you add an arbitrary amount, say 10, to the Z position of the text components the problem appears to go away. Not sure if this just moved or “fixed” the issue.

3

Same problem here. Does someone know how to fix it?

4

Did you managed to solve this issue. I am experiencing the same issue in Unity 2018.3.0f2. As you can see in the following picture (highlighted in red) only some letters in the text are shown the rest of the letters dissapear in WebGL:

[166222-questionunity-webgl.png|166222]

Thank you for any suggestions guys.