I am working with a THREE.js TextGeometry in my scene:
const loader = new THREE.FontLoader();
const linkToFont ='link-to-font';
let textGeo;
const self = this;
loader.load(linkToFont, function (font) {
textGeo = new THREE.TextGeometry('Hello three.js!', {
font,
size: 0.3,
height: 0.01,
});
textGeo.computeBoundingBox();
const textMaterial = new THREE.MeshBasicMaterial({ color: 0xff0000 });
const textMesh = new THREE.Mesh(textGeo, textMaterial);
textMesh.position.set(-100, 0, 0);
textMesh.updateMatrixWorld();
self.addToScene(textMesh);
});
This code displays the text in red on the scene. I am interested in adding a solid "background color" to the area behind the text. Is there a way to accomplish this?