I was looking for a way to do dynamic 3D text and found @TheLeftover’s excellent work on MeshWriter. After understanding how he built that class, I expanded on it and ended up with this.
It supports any TrueType font that opentype.js supports (in theory).
Hopefully the playground does a good job explaining how to use it:
- Add the dependencies opentype.js and earcut.js to your project
- Add the code to your project
- Remove the hacked load of the dependencies – the section marked:
// This is a hack to make this work inside a playground
- Create a
TextMeshFontobject with your TrueType font (TTF) file
TextMeshobjects with your text
- Update the text by calling
- Experiment with the constants at the top (
BEZIER_STEP_SIZE) if you want more/fewer triangles
- If your font isn’t working, try using a two-sided material (disable backface culling) because some fonts have weird “winding orders” that cause all the triangles to be backwards
This is my first shot at creating something useful for BabylonJS so I expect issues. Feedback welcome!