Getting better performance in simple vertex painting scenario

Questions
1

Hi,
I’ve started to learn BabylonJS for some webgl small projects and I’m a bit of stuck trying to build a simple vertex paint tool. Here’s a babylon playground with my progress:
https://playground.babylonjs.com/#W79M6C

But I’m really concerned here about performance, as with that level of detail the vertex painting is very laggy with quick mouse lines and I can’t get continuous lines if I don’t move the mouse really slow.

Where should I look into for get a faster painting experience? Is it possible to only update the color of the 3 vertices that conform the touched face instead of uptating the whole vertex buffer? Or maybe there’s another way to set up the painting event?

Thanks in advance!

4

Mouse events are send based on timer so you can not really have continuous except if you move slow enough for each mouse event to map to continuous faces.

I guess here you should instead paint all faces below the projected path created between 2 mouse events. Also, you might need to consider smoothing out the created path to handle changes of direction without strong angles everywhere.

5

I would try something with less vertices to start as the sphere has a lot.

You could also draw a dynamic texture mapping the points back from picking so you are updating a texture each frame rather than updating vertices.

Hope this helps

6

Thanks for your suggestion. I also tried with dynamic texture but I think it needs proper UV mapping of the object and in this case the real use will be for non uv mapped high poly models.

7

Thanks @sebavan, I think this may be the way to go. Are there any tools inside of Babylon to accomplish this task of checking the faces below a projected path?

As a reference I’ve found this: SculptGL - A WebGL sculpting app which has a very performant vertex paint tool.