Camera question

[Kilombo]

Good afternoon,

 

I'm new to Babylon.js, I just started working on it, and I'm having some dificulties working with the cameras. I need to configure a camera to work with a limited zomm and unzoom, and with no rotation at all, it must only move with the cursors or by "click and drag" (something like one isometric camera, but with a bit of zoom possibility).

 

It looks like freecamera is the best choice, although i'm not used to the camera methods and specifications. The tutorial number 5 (in GitHub) is to generic to be helpfull.

 

Thanks in advance.

 

Kilombo

[GameMonetize]

Hello the touchCamera code can be a good sample for creating your own camera:

https://github.com/BabylonJS/Babylon.js/blob/master/Babylon/Cameras/babylon.touchCamera.js

[Kilombo]

Thanks for your help. That's a good idea. You mean that I can use one of the existing cameras classes, and adapt some of the methods for my needs.

Lol. I Didn't even noticed that i could change and adapt the classes (not used to opensource) 

 

Best Regards,

 

Kilombo

[GameMonetize]

My pleasure

[Wingnut]

I love your spirit, Kilombo!  Yes, taking functions, or entire classes from the babylon.js source code and putting it into your code as standard functions... is very enjoyable and addictive.  (And you can learn much, quick, that way.)  Don't forget to eat, because you will start having too much fun and forget to do that. 

 

camera.fov is a fun way to simulate zoom.  You can also .position your free camera in and out.  (use .radius on an arcRotateCamera)    I always 'base' my cameras looking +z.  (.alpha = Math.PI/2 for arcRotateCamera to look +z, if I remember right.  .beta is for up and down.)  ArcRotateCam alpha and beta...  work with radians/circles.  .707 for 45 degrees, 1.57 for 90 degrees, 3.14 (Math.PI) for 180 degrees, 6.28 (2*Math.PI) for 360 degrees.

 

I did some fov (field of view) experiments.  See this post as wanted. 

 

Deltakosh wrote an excellent framework (with other contributors) and he's a super nice guy, and a genius.  Kilombo, by the way you speak, I think you are going to be an excellent experimenter and innovator with babylon.js.  Be sure to show us your experiments, even simple ones, and tell us about them and about your ideas.  We love it.

 

I was supposed to write a more-detailed camera tutorial... 3 weeks ago, but I started playing with my own version of BABYLON.Mesh.CreatePlane and I got lost in fun.  "The Wingnut Chronicles" is full of me having too much fun.  My recent arrow demo started as a borrowed-from-source CreatePlane.  My useful lighting test box... started as a borrowed-from-source CreateBox.  I once borrowed a ParticleSystem and Particle code... and I lost two weeks of my life drowning in fun.  Mad scientist experimenting, ya know? 

 

One thing you will notice in babylon.js... is no reports like "that number is too big" or "that value is the wrong datatype" because... Deltakosh did not put those limits on things.  For example, a Color3() is supposed to have numbers each from 0-1, but numbers up to 5 work fine.  And you would think light.intensity is a float 0-1, but have fun going to 50 or more, if you feel like it.  Deltakosh pointed out to gryff recently... that negative numbers in mesh.scaling was allowed.  They are also allowed in texture wrap, offset, and scaling.  Forum member gryff was doing it on skybox texture scaling (if I remember correctly), and got fun unexpected results.  It makes you wonder what negative values on light.intensity and mesh.visibility.... would do.  Black hole?  Dark matter? 

 

And wait until you use cannon.js and setPhysicsState on a mesh, and applyImpulse to send a mesh flying and bouncing, and then hook a smoke-spraying particleSystem emitter to it.  Goofy crazy fun, with a delicious frosting of learning.  Use lots of alerts, console.log, and even put html divs before your canvas... and send numbers to them with htmlelement.textContent = some_numbers... so you can easily watch what your cameras and animations are doing.  (I use a round-to-hundredths function on the numbers, so the numbers don't get too long.)

 

Make html buttons the same way...  onclick="do something crazy to my scene" and CSS style the button divs with outset borders, background-colors, and cursor: pointer;.   Use CSS on the divs... so they look like buttons and/or computer readouts of cool numbers. Rounded numbers from camera.position and camera.rotation at the top of your canvas... are very handy... and help learning.  Send values from arcRotateCamera .alpha and .beta to html div readouts up there, too.  Easy to learn things, quick.

 

Are you inside a function and getting 'scene is not defined' error?  Try...

var scene = engine.scenes[0];  // handy first line of a function.

'engine' is a global variable but sometimes 'scene' is not global, so a look-up is needed sometimes.

After that, you can use things like scene.getMeshByName() or scene.activeCamera or scene.getLightByID().

 

Download any or all zipped demos from The Wingnut Chronicles... its a HUGE pile of experiments and learning.  Steal ANYTHING from there... my code is everyone's code.  I always have TONS of fun with babylon.js, and the members of this forum have become my friends and family.

 

I can't wait to see some of your experiments and projects, Kilombo.  I bet they will be fun and crazy.  Welcome to our club, K!  Good to have you here. (and all other new arrivals)

[Kilombo]

Thanks mate. I'll do that.