javascript - How to insert a newline in a babylon JS dynamic texture using drawtext?

Question

So I have something like this demo:

http://jeromeetienne.github.io/threex.dynamictexture/examples/basic.html

Source: https://github.com/jeromeetienne/threex.dynamictexture/blob/master/examples/basic.html

A box with the time printed on each surface. It was Build with THREEX using the dynamictexture drawtext sub from Babylon JS (if I'm correct).

I want to extent this text with additional lines, e.g.:

---

Time: (newline)

12 o'clock.

---

Does anyone know how to extent an input string with a newline? (Also because my string could be up to 30 characters or more in length).

I tried:

text = text.replace(/(?:\r\n|\r|\n)|\s/g, '<br>');

But html like <br> tag does not do the job, same counts for other newline metacharacters.

Below we can see the string is not completely on the surface, just broken down and discontinues to nothing.

i.stack.imgur.com/aXnGp.png

Any suggestions? Thanks.

Answer 1

これは、canvas 2d の作業方法に関連しています。文字列を分割し、2 行のテキストをレンダリングする必要がある場合があります (drawText を 2 回呼び出すことを意味します)。