Dynamically create 2D text in three.js

Question

I have 3D model which I have created in three.js. Based on some data, I want to create a set of arrows which is decorated by a small text label. These labels should be in 2D

Answer 1

I've published a module on NPM that does that for you: https://github.com/gamestdio/three-text2d

It allows you to have an Sprite or Mesh with the rendered text without dealing with canvas manually.

Example:

var Text2D = require('three-text2d').Text2D

var text = new Text2D("Hello world!", { font: '30px Arial', fillStyle: '#000000', antialias: true })
scene.add(text)