How to get the uv coordinate of a mesh

[FBplus]

I don’t know if this description is accurate,actually I want to implement a function like:RaycastHit.textureCoord in Unity or Raycaster.intersectObject in Three.js which returns the uv coordinate of the hitten mesh.
After some googling, I found a nice solution on github which implement a part of this function:
https://github.com/playcanvas/engine/pull/989

But that is not enough
Does anyone know how to accomplish this or any better solution?

[Leonidas]

Hi @FBplus,

I haven’t seen any similar method or project in Playcanvas. Agreed it would be a good feature to have.

Here is the Three.js implementation, if anybody would like to give it a try:

mrdoob/three.js/blob/0950e5b6e8bceb520c154f45b5c240af45f0ed11/src/objects/Mesh.js#L130

[FBplus]

@Leonidas Hi Leonidas,Thanks for your reply
I’ve read that code and found this function:
https://github.com/mrdoob/three.js/blob/0950e5b6e8bceb520c154f45b5c240af45f0ed11/src/objects/Mesh.js#L438
I think the only thing I have to figure out may be the uv coordinates of each vertex
If I know the index of a triangle based on IndexBuffer,Is there anyway to get the uv coordinates of three vertices of that triangle?

[Leonidas]

There isn’t a Playcanvas built in method for that, but study the Three.js Triangle class to see the math behind it:

mrdoob/three.js/blob/0950e5b6e8bceb520c154f45b5c240af45f0ed11/src/math/Triangle.js#L104

[FBplus]

@Leonidas I made it
I’ve created a test project base on this function and it works fine
https://playcanvas.com/project/704805/overview/paint-3d-test

[Leonidas]

Wow @FBplus, that is working beautifully!! Many thanks for sharing.

I am going to definitely take a look at your implementation, this is quite useful for many things.

Nice work

[yaustar]

We also have released a similar demo if both of you are interested: https://playcanvas.com/project/702588/overview/character-damage-demo

[FBplus]

@Leonidas I am so glad if you found this project useful
To be honest, I just copy and paste the code from threeJS with minor adjustments without considering the performance and there is still a lot to improve.

[Thomas_Due_Nielsen]

Hello @FBplus and @Leonidas - I want to paint the back of a woman: https://playcanvas.com/editor/scene/1031376

• unfortunately, and no matter what I do, the brush only works on the top left area of my cutout back model?
  
  

As you can see; one of my workaround has been to alter this line in raycast.js:
this.cameraEntity.camera.screenToWorld(screenPosition.x*3.6, screenPosition.y, this.cameraEntity.camera.farClip, this.ray.direction);

(screenPosition.x multiplied by 3.6 in order to center the painted)

But otherwise, the problem of not being able to; paint blue on the whole area, still stands.

[Thomas_Due_Nielsen]

ok, got it working with a similar adjustment … don’t bother (nice example anyway @FBplus)

[defektu]

This example does not work anymore? Any updated on this subject?
Edit: Raycast does not return uv0 positions anymore I guess

[mvaligursky]

There’s also this older and bit out of date PR that could be cleaned up and used I suspect

Support ray intersects mesh instances

[mrkarate]

Hello @yaustar . I forked your original Character damage demo but it isn’t working anymore in the latest version of playcanvas editor. Any ideas?

https://playcanvas.com/project/702588/overview/character-damage-demo

Thanks!

[yaustar]

Unfortunately, we’ve removed that project from the tutorials as the developer who made it is on longer on our team and the project is no longer maintained.

[mrkarate]

Thanks for the update @yaustar

[yaustar]

@mrkarate Found out someone has fixed the demo in a fork here: [SOLVED] Character damage demo broken in Engine v1.55 - #5 by devinhell

[mrkarate]

That’s awesome!! thanks yaustar!!