How to position the text on the surface of mesh at the desired angle?

Questions
1

Hello!
Perhaps there is such a function to glue a textGeometry or any other object to the desired mesh surface? Another words, how to position the text on a flat surface. If not, how can this be done more efficiently?

2

If you add a text mesh to another mesh, it will always keep its position relative to its parent. Meaning if you have properly positioned the text, you can move the surface around and the text will keep its position on the surface.

1 Like
3

Thank you! But I meant something else. Is it possible to automatically position the text, as if gluing it to a given mesh surface? So that the text itself is aligned under the corner perpendicular to the surface.
If there is no such function in Three.js, then other questions arise:

  1. How to calculate the normal (perpendicular) to the desired surface of mesh.
  2. How to place the text close to the mesh surface, aligning it to the found perpendicular (normal)
4

No, this is not possible.

You normally do this for a single face. Use Triangle.getNormal(). Assuming you have a plane, the normal of an arbitrary face is valid for the entire surface.

There is not API that does this automatically for you. But you can try to compute a bounding volumes (e.g. Box3) for your text and mesh and use the resulting bounds to compute a position for your text.

1 Like
5

I add textMesh with:
object.add (textMesh)

where:
const object = objectFromServer.children [0];

But I don’t get the behavior that you are talking about. After adding, I rotate the object, but the added textMesh does not rotate with it. Moreover, I cannot change the position property of the added textMesh:
addedText.position.set(0,0,0);
the set and copy properties do not change the position of the textMesh.
Maybe it because I try to change position of one mesh from array of children meshes of object?

6

@AlexGoryushkin
Hi!
How do you know where to put your text on the model?

7

Hello!
I have a mesh object on which I need to apply the text object.
So far I’ve simplified the task and need to add a text object (textMesh) to the place where one of the meshes in the object was. I added textMesh to the object using the add method, then removed the unnecessary mesh from object, having previously saved its coordinates. But after adding a textMesh to object, I cannot change its coordinates. Position.set and position.copy methods do not work

8

I think, it would be great to provide an editable working code example that demonstrates the issue (jsfiddle, codepen etc.).

9

Thank you all for your help!
I still have such a question. How to place one mesh in place of another, both are in the same object. That is, I need:

  1. Find the position of mesh1. Position returns (0,0,0)
  2. put mesh2 in the returned place of mesh1.
    How to do it correctly? Now mesh2 stands in a completely unexpected place relative to the object