Can anybody explain or have any idea how sketchup achieved this behavior with its measure line or dimensions and how to reproduce the same using babylon.js?

Hey guys, I am trying to figure out the behavior of the dimensions in sketchup and have successfully implemented along perpendicular surfaces on xy, xz and yz planes. The solution was I added planes on the perpendicular surfaces and then was first detecting or checking the planes after clicking on 2 points(which needs to be measured) and then when moved my cursor the measure line will move along with it by doing mathematical operations to generate points along the cursor on the plane. It took me a lot of time, but here I am stuck again while creating the same thing but on the angular surface because I don’t know what plane is that. Can any one suggest me what would be more generic solution ? I just need new solution since I am going to scrap out the previous one since it will not work because I will not be knowing how the plane will form or what plane it would be.
I have uploaded a picture of how it looks in sketchup and the blue ticks represents the perpendicular planes along xy, xz and yz.

NOTE: I just need to implement the same behavior of dimensions as in sketchup at my end.

You could generate a plane for the angled surface by finding its normal :smiley:

@carolhmj I have tried that but how to make the measure line move along with cursor ? Refer here https://app.sketchup.com

You’re have to work with pointer events :slight_smile:

I know the pointer events and JS but I am not able to figure out the mathematics or the different levels of stuffs that might be going on in that.Please provide with some playground if possible @carolhmj . Which will help me in the dimensions.

We can help you with specific questions about the framework but for app construction it’s better to use #service-offers-and-requests :slight_smile:

I don’t know what that is. Still let it be, I will spend some more time to figure it out.

This is something I wrote a while back that has some of the goodies you need, such as drawing the arrows and keeping the numbers facing the camera. Looks like it has a bug with placing the origin side of the arrow.

Hope that helps!

1 Like

FYI- Determining the slope, plane and normal of a clicked point or drag on a tilted face is straight forward- pickingInfo gives you the normal and the clicked point coordinates, and the bounding box can be used to fill in the other info. All the math stuff you need is in the plane and vector3 classes.

If you put something in the playground with a mesh and a description I can help you with the math.

Its a link to another forum category