Smooth lines with Mesh Builder

Hi all! I am learning mesh builder. And I’m really new to this. I also don’t have much skill in JS. I put together a project like this example, but I’m having trouble getting it to be smooth lines and not random triangles. At the bottom of this post there is an explanation of how to make lines smooth. This is a list of changes. Can you help me? i need the full code so i can copy this into scripts. I also need the thickness of these lines to change smoothly. I really hope for your help. Thanks in advance.

Well, here’s the basic version attached to a hand tracker. It’s not super smooth though.

I did try working in that smoothing function, but I couldn’t get it to behave with a continuous stream of points. It does work with the 4 point example they included, so maybe it’s just a matter of tweaking some parameters. You can see the basic one by default. Comment out the doBasic function and comment in the doCurved function to see the current state of that.

snap-curved-mesh-builder.zip (992.3 KB)

3 Likes

Wow thank you so much for taking the time to do this. I have a small question. In your example, the position of the cursor depends on the position of the hand, is it possible to make the cursor be associated with the position of the device? Now if I bring the cursor from the hand tracking to the camera, the lines stop being drawn.

Yeah the cursor’s position is in world space, so it will work if you place the cursor object in the camera. I thought about how to make it smoother last night and came up with this lerp method instead of what the snap admin proposed. It’s pretty smooth!

The only thing that bugs me right now is how the ribbon thickness is handled. It always offsets in the x direction, when it really should be determined by the motion vector. I’ll come back to it when I have more time, but for now, here’s the project.

snap-ribbon-generator.zip (990.7 KB)

2 Likes

OMG!!! this looks very cool!!! it really is much better. Thank you very much :grinning: I hope this isn’t too much, but I have a question. I add the activation of the drawing mode by tap and if I tap again, then the drawing starts again and the drawing is deleted. Is there a way to make drawing start on a tap, and the next tap stops drawing without deleting the drawing, and the next tap continues drawing? And is it possible to have pbr material applied to the lines? a thousand thanks))) you are super cool!

I ran out of time for today, but at least I got the tap toggle behavior working. The tricky part is that we need to dynamically create a new scene object with a mesh + material every time we want to start a new ribbon.

snap-ribbon-generator.zip (996.6 KB)

I’m not sure how flexible the material will be in this state, since I am cloning an existing material for each new instance. Hopefully it will take all of the parameters…

3 Likes

Hi!!! Thank you so much now it’s great! If it was possible to add pbr material it would be the maximum goal!))

It looks like I probably won’t have time to look until thursday, but I spotted this component in the library that might be worth checking out.

Screen Shot 2022-07-11 at 11.43.56 AM

1 Like

Thanks a lot, looking forward to Thursday :smiley:

I added variable width, corrected the mesh alignment so it is perpendicular to the camera, and added the PBR material.


snap-ribbon-generator.zip (7.0 MB)

3 Likes

OMG!!! You are the best!!! thanks a lot!!!

2 Likes

Hey)) I have a small question, is there a way to make the lines even smoother? and now sometimes it looks angular. :smiley:

Well, the idea is to connect the mesh over time, so if it moves fast, the points will be farther apart. That’s probably where you are noticing the angular bits. I’m not sure if there’s an easy way to apply some kind of subdivision algorithm…

The simplest solution is to just increase the amount of smoothing on the script. I don’t remember what I named it, but if you play around with the sliders you should be able to get a feel for what they do.

1 Like

thanks for the answer)