# Tag areas in 3D model with perfectly aligned planes(rectangles)

**URL:** <https://discourse.threejs.org/t/tag-areas-in-3d-model-with-perfectly-aligned-planes-rectangles/19600>\
**Category:** Questions\
**Tags:** annotations\
**Created:** [October 9, 2020, 9:41pm UTC](https://discourse.threejs.org/t/tag-areas-in-3d-model-with-perfectly-aligned-planes-rectangles/19600 "2020-10-09T21:41:40Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ujwaldeep\_Singh](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ujwaldeep_singh/32/13304_2.png) [@Ujwaldeep\_Singh](https://discourse.threejs.org/u/Ujwaldeep_Singh)\
**Post date:** [October 9, 2020, 9:41pm UTC](https://discourse.threejs.org/t/tag-areas-in-3d-model-with-perfectly-aligned-planes-rectangles/19600/1 "2020-10-09T21:41:40Z")

</div>

Hi  
I am facing an issue which has to do with drawing rectangles (planes) on certain objects in my 3D model. I would like to be able to draw rectangle perfectly aligned with objects.  
Please see the following  
This is our 3D model in glb format.

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/9/9f5e7b00c2ac026545cdd6909bbde3cd2ef2f9f1.jpeg)

I am trying to draw rectangles over certain objects that are not necessarily aligned with the **axes** of 3D space.

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/7/7c008648b589e267cba010107ab89f6045bf323c.jpeg)

The rectangle is never aligned with objects hence I have to rotate and resize every time which is a difficult thing to do.

I would like to be able to rotate the model and place it in a certain way and draw the rectangles perfectly aligned with the object without having to resize and rotate.

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [October 10, 2020, 7:58am UTC](https://discourse.threejs.org/t/tag-areas-in-3d-model-with-perfectly-aligned-planes-rectangles/19600/2 "2020-10-10T07:58:35Z")

</div>

But is there any certain property that defines around which objects the rectangle should appear?  
It seems to be placed over arbitrary buildings / cars / half of a parking lot (and not aligned perfectly to any of those.)

---

<div class="post-metadata">

**Author:** ![seanwasere](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/seanwasere/32/20864_2.png) [@seanwasere](https://discourse.threejs.org/u/seanwasere)\
**Post date:** [October 10, 2020, 8:21am UTC](https://discourse.threejs.org/t/tag-areas-in-3d-model-with-perfectly-aligned-planes-rectangles/19600/3 "2020-10-10T08:21:12Z")

</div>

If you want something like this,

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/e/ec77d1fe552c5aeb5dc1cd6cf96a2807b8809229.jpeg)  
Then you draw a plane with many segments and raycast from the current cameras position to update the positions for each vertices.  
But note that it no longer looks like a rectangle when you move the camera.

I found a better approach is to be able to draw any shape, but add vertices one at a time with each mouse click.

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/e/ef3ea1e4a2543f16590db4c2dc414a588768bc57.jpeg)  
 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/5/5272f971ff597e0b20d3eaa24a729f37a6283da1.jpeg)

---

<div class="post-metadata">

**Author:** ![Ujwaldeep\_Singh](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ujwaldeep_singh/32/13304_2.png) [@Ujwaldeep\_Singh](https://discourse.threejs.org/u/Ujwaldeep_Singh)\
**Post date:** [October 10, 2020, 11:58am UTC](https://discourse.threejs.org/t/tag-areas-in-3d-model-with-perfectly-aligned-planes-rectangles/19600/4 "2020-10-10T11:58:13Z")

</div>

@mjurczyk Actually I need to draw the rectangle on the model using mouse drag in real time. For example if I am watching the above building, I should be able to draw rectangle on the roof of the building as shown. But the building roof is not aligned with the Axes. So it creates a problem for me to calculate length and width of rectangle, Or if I want to scale then since its not aligned with the axes I am not able to calculate the number by which I need to scale.

---

<div class="post-metadata">

**Author:** ![Ujwaldeep\_Singh](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ujwaldeep_singh/32/13304_2.png) [@Ujwaldeep\_Singh](https://discourse.threejs.org/u/Ujwaldeep_Singh)\
**Post date:** [October 10, 2020, 12:01pm UTC](https://discourse.threejs.org/t/tag-areas-in-3d-model-with-perfectly-aligned-planes-rectangles/19600/5 "2020-10-10T12:01:58Z")

</div>

@seanwasere That’s a good idea to make a rectangle using its vertices but at the end lets say if we use four vertices (four mouse clicks) to draw that rectangle, It may or may not be a perfect rectangle (Opposite sides should be parallel.)

Is it possible to use mouse drag or may be just two clicks and somehow make it parallel to my camera position.
