I just learned that ThreeJS supports TrueType fonts. Normally if you want to do full 3D text inside of ThreeJS (rather than drawing 2d text to a canvas and using it as a texture) then you must load fonts in this special JSON format, which you can generate from existing font files. It’s kind of a pain, though, and JSON is obviously not the ideal format for font information.
However, I just learned that ThreeJS has a TrueType font loader in the examples repo. It looks like it has been there for a year or so, but I didn’t see any examples that show how to use it. So here is mine:
Normally you would so something like this:
const fontLoader = new THREE.FontLoader() loader.load('./myfont.json',fnt => font = fnt)
Now you can do an extra parsing step with the TTFLoader like this:
const loader = new THREE.TTFLoader() const fontLoader = new THREE.FontLoader() loader.load('./hobby-of-night.ttf',fnt => font = fontLoader.parse(fnt))
Underneath TTFLoader uses the excellent opentype.js library to parse the ttf file into an object that the regular font system can understand.