How do I make a TextGeometry multiline? How do I put it inside a square so it wraps like html text does inside a div?

Question

I\'m making some 3D text using WebGL, three.js, and THREE.TextGeometry. It\'s working fine so far. I\'m able to create a single line o

Answer 1

Adding this as an updated workaround that can be used to render multiline text using TextGeometry.

If you use a template literal string and split the text you want to use for the TextGeometry string onto multiple lines (even including spaces between lines), the TextGeometry will respect these spaces. This can be used to manually achive the multiline effect, however this will not "put it inside a square" and cause it to automatically wrap.

Example

let text = `
    first line.
    second line.

    third line.
`;

objectGeometry = new THREE.TextGeometry(text, {
    font: font,
    size: 10,
    height: 0,
    curveSegments: 10
}).center();