cameraHelper type of thing?

[babbleon]

Hello,

Do we have anything off the shelf like three.js cameraHelper which shows a wire outline of a camera itself?

I can't find anything but shouldn't be difficult to put something together if nothing currently exists.

Thank you.

[Sebavan]

Not that I am aware, would be cool real though.

Do you feel starting on it and I can help with the integration ?

 

[babbleon]

Thank you @Sebavan, I shall get a PG together soonish and post back here.

[brianzinn]

createDefaultCamera creates a camera helper - (http://doc.babylonjs.com/how_to/fast_build#accessing-the-camera )

Lots of room for new features with that part.
 

[babbleon]

thank you @brianzinn This sort of thing is what I'm intending to show: https://threejs.org/examples/#webgl_camera

 

[babbleon]

Here's a bare bones WIP and is probably not right - I think it may be upside down, but when I''m at my desktop during the week I will make it neater.

http://www.babylonjs-playground.com/#AZLEWZ

Please feel free to add suggestions, criticisms etc

[babbleon]

Better, but still not right: http://www.babylonjs-playground.com/#AZLEWZ#3 the purple rectangle (camera.minZ) should not be visible in right hand viewport.

better still: http://www.babylonjs-playground.com/#AZLEWZ#4

http://www.babylonjs-playground.com/#AZLEWZ#6

http://www.babylonjs-playground.com/#AZLEWZ#7

[Sebavan]

This looks good, do you feel able to create it as the boundingBoxRenderer and other helpers in typescript ? 

We could then easily integrate it in the framework, it is a really cool addition.

[babbleon]

Cheers, @Sebavan... I could certainly have a go but I make no promises. Once this is done, I will also look at doing similar helpers for lights.

[Sebavan]

Sweet, I ll be able to help with the integration nw ?

[brianzinn]

That's a great idea @babbleon! - I really cannot count know how many times I've had z-fighting issues where something is out of frustum near plane, so that near plane is really helpful (ie: move near/far plane or z-position/fov).  This is linked from the page that I used to learn all the math, but would be a cool documentation PG with GUI sliders to demonstrate the utility of the camera helper:
https://webglfundamentals.org/webgl/frustum-diagram.html main page(https://webglfundamentals.org/webgl/lessons/webgl-3d-perspective.html)

[babbleon]

Cheers @brianzinn.. and I'm sure we have all had lights pointing the wrong way too, so that will help out too when I get onto light helpers.

[babbleon]

this shows camera.radius now, too: http://www.babylonjs-playground.com/#AZLEWZ#8

[babbleon]

Hi @Sebavan, would you be able to point me in the right direction for the boundingBoxRenderer thing please? I haven't used TS before, so this may be a way to learn it a bit. Thank you.

[Sebavan]

Here is the code of the bounding box renderer: https://github.com/BabylonJS/Babylon.js/blob/master/src/Rendering/babylon.boundingBoxRenderer.ts

I was wondering if we should create a CameraFrustrumRenderer and a LightFrustrumRenderer looks like it would be consistent and pretty helpfull, we could also add them to the inspector like we do for the mesh and @Luaacro could do good use of it in the editor.

[julien-moreau]

100% agree with you @Sebavan