DecalGeometry stretching over right angle edge

I’m playing around with DecalGeometry and having a “sticker” follow my cursor.

Here is the JSfiddle, where you can hover over the cube and click to appy the decal.

Notice that on flat surfaces, it works as intended, but on the edges we get some stretching (see image below).

Screen Shot 2022-11-16 at 6.30.14 PM

My understanding is this is a limitation of the algorithm used within DecalGeometry, but I’m wondering if there may be a way to solve this if I can be certain my object has only right angle edges and is a cube.

I had one wild idea where I could maybe use CanvasTexture for each face and draw the decal based on the mouse position, and if it overlaps an edge, draw the respective portions on each face, but that seems like overkill…

Any thoughts / ideas appreciated!

1 Like

some like this question:

It is the same question, and you need to compute the decalOrientation to something that works.

For projecting onto a corner like that… the best you can do is like… a 45 degree rotation.

There’s not really a trivial way to compute it in the case of a single raycast.

You could use three-mesh-bvh spherecast to use a sphere to represent the “brush”, and based on where the sphere contacts the object, compute a normal from that point to the sphere center, and use that to construct the decalOrientation.