# Detecting objects which can camera see

**URL:** <https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382>\
**Category:** Questions\
**Tags:** camera\
**Created:** [June 20, 2021, 5:32pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382 "2021-06-20T17:32:11Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![webIka](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/webika/32/15056_2.png) [@webIka](https://discourse.threejs.org/u/webIka)\
**Post date:** [June 20, 2021, 5:32pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/1 "2021-06-20T17:32:11Z")

</div>

hello everyone, i have an issue here i want to detect which geometries camera can see

 ![Screenshot_1](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/1/6/1643f6ebe29cd0c8063ee2802f09e4e4958fcf6f.png)

for example

 ![Screenshot_2](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/d/2/d22d2f7140acefb23b70cdb69019ea75f2041006.png)

i want to detect all this geometries which can be seen by camera and make behind part visible = false

how can i achieve that? thank you.

---

<div class="post-metadata">

**Author:** ![drcmda](https://avatars.discourse-cdn.com/v4/letter/d/91b2a8/32.png) [@drcmda](https://discourse.threejs.org/u/drcmda)\
**Post date:** [June 20, 2021, 6:08pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/2 "2021-06-20T18:08:18Z")

</div>

isn’t this done automatically for you by threejs? that’s why materials have the side prop which defaults to frontside. backside (the behind-side) is invisble/not rendered.

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [June 20, 2021, 6:56pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/3 "2021-06-20T18:56:08Z")

</div>

@webIka  
Does it really need to consist of such big amount of elements?

---

<div class="post-metadata">

**Author:** ![webIka](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/webika/32/15056_2.png) [@webIka](https://discourse.threejs.org/u/webIka)\
**Post date:** [June 20, 2021, 7:20pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/4 "2021-06-20T19:20:06Z")

</div>

I am aware of that BUT if i manually make half of it visible false it has better performance so i am looking something new.

---

<div class="post-metadata">

**Author:** ![webIka](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/webika/32/15056_2.png) [@webIka](https://discourse.threejs.org/u/webIka)\
**Post date:** [June 20, 2021, 7:23pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/5 "2021-06-20T19:23:12Z")

</div>

Unfortunately yes, its a project they are demanding To do like this, but there is huge performance drop because If i load alL geometry there are like 5400 geometry + 5400 edge geometry so i am looking solutions, i use bufferGeometry basic materials no lights i am making scene as light possible but nothing comes out.

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [June 20, 2021, 7:26pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/6 "2021-06-20T19:26:35Z")

</div>

Instancing, as an option? [Using Instancing for EdgeGeometry / LineSegments - #7 by prisoner849](https://discourse.threejs.org/t/using-instancing-for-edgegeometry-linesegments/20182/7)

---

<div class="post-metadata">

**Author:** ![webIka](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/webika/32/15056_2.png) [@webIka](https://discourse.threejs.org/u/webIka)\
**Post date:** [June 20, 2021, 7:40pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/7 "2021-06-20T19:40:06Z")

</div>

All objects in my scene have different size color depth and etc… will indtancedMesh still work? Also is there any other approach for edge geometry? Cuz it makes scene very heavy

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [June 20, 2021, 8:14pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/8 "2021-06-20T20:14:58Z")

</div>

Basically, all your objects are distorted boxes, so you can distort them individually, passing desired parameters via instanced buffer attributes.  
And instead of edge lines, you can try to use this approach: [How to update color values when using a shader? - #5 by prisoner849](https://discourse.threejs.org/t/how-to-update-color-values-when-using-a-shader/25686/5)

---

<div class="post-metadata">

**Author:** ![webIka](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/webika/32/15056_2.png) [@webIka](https://discourse.threejs.org/u/webIka)\
**Post date:** [June 21, 2021, 8:20am UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/9 "2021-06-21T08:20:01Z")

</div>

Thank you very much!

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [June 21, 2021, 6:23pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/10 "2021-06-21T18:23:33Z")

</div>

To tell what to do is always easier, than to tell and to show.  
Here is an option with all the things I mentioned in my previous post.  
Example:  
https://codepen.io/prisoner849/embed/preview/yLMrjQW?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=yLMrjQW  
Picture

 ![изображение](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/9/9/99d19fe6478b80f0d05e1594308f2617f808a48a.png)

---

<div class="post-metadata">

**Author:** ![webIka](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/webika/32/15056_2.png) [@webIka](https://discourse.threejs.org/u/webIka)\
**Post date:** [June 22, 2021, 12:10pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/11 "2021-06-22T12:10:22Z")

</div>

Again thank you very much! I tried it and it works amazing!

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [June 22, 2021, 12:16pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/12 "2021-06-22T12:16:22Z")

</div>

@webIka You’re welcome 🙂 🍻

---

<div class="post-metadata">

**Author:** ![Nemines](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nemines/32/16023_2.png) [@Nemines](https://discourse.threejs.org/u/Nemines)\
**Post date:** [June 22, 2021, 3:55pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/13 "2021-06-22T15:55:06Z")

</div>

Question about this thread : could each of these elements have UserData attribute values ?

Say for example two attributes : M-index and N-index. Could we assign to each element of the instancedBuffer Geometry different values to M-index and N-index (at the user discretion) ? If so, how to achieve this. If not, what are other alternatives ?

Great Example !!

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [June 22, 2021, 4:32pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/14 "2021-06-22T16:32:03Z")

</div>

@Nemines do you want to process those indices in shaders somehow?

---

<div class="post-metadata">

**Author:** ![Nemines](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nemines/32/16023_2.png) [@Nemines](https://discourse.threejs.org/u/Nemines)\
**Post date:** [June 22, 2021, 4:48pm UTC](https://discourse.threejs.org/t/detecting-objects-which-can-camera-see/27382/15 "2021-06-22T16:48:19Z")

</div>

I’m not sure I understand what do you mean by that. One application of what I mean by that is to be able to filter out all these elements by UserData attributes (N-index and M-index for example).

The user can also color code these elements according to the UserData attributes values (for example low values would be blue and high values would be red) as per turbo color scheme for example…

I don’t know if you understand what I mean ?