# Project on 3d interactive application

**URL:** <https://discourse.threejs.org/t/project-on-3d-interactive-application/7782>\
**Category:** Questions\
**Tags:** loaders, geometry, shaders\
**Created:** [May 28, 2019, 12:21pm UTC](https://discourse.threejs.org/t/project-on-3d-interactive-application/7782 "2019-05-28T12:21:12Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Deevannagari\_Ajith](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/deevannagari_ajith/32/56162_2.png) [@Deevannagari\_Ajith](https://discourse.threejs.org/u/Deevannagari_Ajith)\
**Post date:** [May 28, 2019, 12:21pm UTC](https://discourse.threejs.org/t/project-on-3d-interactive-application/7782/1 "2019-05-28T12:21:12Z")

</div>

_ **Project help** _  
I want some help on my project at college.  
I’ve made that model in Blender-3d freeware software exported to gltf extension.

This is a basic model of my project.  
[https://deeajith.github.io/](https://deeajith.github.io/)  
 ![](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/d/d39ff6bd5a69f19a43ab552e62e9e2ec11ab8272.png)

> [@♦ Problem](#):
>
> I want to display information of 3d products with onclick listener using some basic annotation or label for every part i click on, and use gltf martrials on it can i use make change size of canvas one other thing how to lock orbit controls to floor not to go underneath🔒

I want it like this [i]reference:[https://codepen.io/Lorti/full/Vbppap[/i]](https://codepen.io/Lorti/full/Vbppap%5B/i%5D), I want that in basic code easily understandable.  
Please help me out with this.

---

<div class="post-metadata">

**Author:** ![marquizzo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/marquizzo/32/25192_2.png) [@marquizzo](https://discourse.threejs.org/u/marquizzo)\
**Post date:** [May 29, 2019, 12:15am UTC](https://discourse.threejs.org/t/project-on-3d-interactive-application/7782/2 "2019-05-29T00:15:40Z")

</div>

Why don’t you just post the problem you’re dealing with here? That way anyone who reads it can try to help you out. It’s not necessary to ask for volunteers beforehand.

---

<div class="post-metadata">

**Author:** ![marquizzo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/marquizzo/32/25192_2.png) [@marquizzo](https://discourse.threejs.org/u/marquizzo)\
**Post date:** [May 29, 2019, 10:04pm UTC](https://discourse.threejs.org/t/project-on-3d-interactive-application/7782/3 "2019-05-29T22:04:22Z")

</div>

You can see the code of your reference here: [https://codepen.io/Lorti/pen/Vbppap](https://codepen.io/Lorti/pen/Vbppap) so, you can try reading through it.

Three.js has a built-in tool to help with labels and annotations like the one you want: [https://threejs.org/examples/?q=css#css2d\_label](https://threejs.org/examples/?q=css#css2d_label) If you click on the bottom-right button that says “View Source”, you can see how that behavior was accomplished.

---

<div class="post-metadata">

**Author:** ![Deevannagari\_Ajith](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/deevannagari_ajith/32/56162_2.png) [@Deevannagari\_Ajith](https://discourse.threejs.org/u/Deevannagari_Ajith)\
**Post date:** [May 31, 2019, 11:06am UTC](https://discourse.threejs.org/t/project-on-3d-interactive-application/7782/4 "2019-05-31T11:06:49Z")

</div>

@marquizzo  
😀  
Thank you! for that but,  
It doesn’t work with gltf objects exported from blender what to do please.

---

<div class="post-metadata">

**Author:** ![marquizzo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/marquizzo/32/25192_2.png) [@marquizzo](https://discourse.threejs.org/u/marquizzo)\
**Post date:** [May 31, 2019, 7:17pm UTC](https://discourse.threejs.org/t/project-on-3d-interactive-application/7782/5 "2019-05-31T19:17:06Z")

</div>

What exactly doesn’t work? You need to be more specific. Are you getting console errors? What did you try, and can you show us the code that you’ve tried?