• Advertisement
Sign in to follow this  

How does 3d snapping work?

This topic is 1243 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

I am working on my own WebGL 3d game with Three.js framework. I've built quite a few "tools" of my own and started from scratch without any knowledge of 3d graphics.

I am thinking about making a new tool, which will be used to help user position cubes in the room. For example: I have two cubes, one is at Z coordinate 100 and another one is at 0. What i would like is that when I move one of the cubes and position them "parallel" one to another, to draw a line indicating that they are at the "same position", even if X or Y are different, and snap it to that coordinate. Like AutoCAD and most of the 3d modeling applications have. Snapping even if they are far away from each other.

What is the base for that? What are the approaches to do that ? Any standard and good performance solution ? I am also interseted in "general topic" how snapping works in 3d graphics ?

Share this post


Link to post
Share on other sites
Advertisement

This is simple. You can use something like this to snap cube1 against cube2's position on the (world) z axis (snap distance is 10):

if (cube1.z >= cube2.z - 10 && cube1.z <= cube2.z + 10 )
{
  cube2.z = cube1.z;
  //and draw a line at cube1.z
}
Edited by tonemgub

Share this post


Link to post
Share on other sites

Are you talking about axis aligned or non-axis aligned snapping? Axis aligned is basically what tonemgub said. You'll want to keep track of two positions though, one for where your mouse actually is pointing at and one for where you're displaying the object. This way you can snap the position where you're displaying the object, but still move it around once already snapped, upon finishing the move action you can then set the objects actual position to the position you were last displaying the object.

Share this post


Link to post
Share on other sites
Sign in to follow this  

  • Advertisement