[text] Emoji Support?

[n1ru4l]

Hey, I recently ported some SVG view to react-three-fiber and did not realize some people were relying on (Apple) Emoji text, which are no longer rendered with troika-three-text.

I wanted to ask whether there would be a possibility to make emoji text work with troika-three-text, or if anyone already has some kind of workaround.

[lojjic]

Good question, I'll give this some thought and research. It sounds like there are multiple encoding schemes for emoji so this could be a big lift.

Could you perhaps point me to an example including a font that contains the emoji glyphs?

[n1ru4l]

Well, that's probably one of the biggest pain points.

Did some research and found https://github.com/eosrei/twemoji-color-font

Dunno how it would be possible to do it for all the emojis that are shipped with osx by default? Since you would have to somehow extract them as a font, and that would probably not be legal...

[lojjic]

Ah, I guess it makes sense that emoji might not be included in the webfont and it would fall back to some base emoji glyphs provided by the OS...? Local font access isn't yet possible so we'd need some other approach.

Maybe when encountering an emoji character we could do something like render it to a texture using 2D canvas and then display that texture directly instead of SDF rendering. Could be tricky getting it to be sized/positioned correctly though if the glyph dimensions aren't supplied in the webfont. 🤔

[n1ru4l]

Three.js is able to load SVG graphics into paths, all the twemojiis are available as svg: https://github.com/twitter/twemoji/blob/master/assets/svg/1f3c4.svg?short_path=53b4ec6

So technically we could insert those instead of using a font 🤔

[lojjic]

As of version 0.48.0, emojis are now supported out of the box, but only as monochrome, using Noto Emoji.

[arpu]

wau this is awesome! The color Variants are more difficult? https://fonts.google.com/noto/specimen/Noto+Color+Emoji

[arpu]

any plans for colors?

[lojjic]

Color will require a new rendering path for individual glyphs to use rasterized textures instead of SDFs. Possible, but a large effort, so it's not likely I'll get to it any time soon.