Has any one got a 2D camera?

[arcanine]

Hello,

 

I'm looking for a camera that on mouse drag changes the cameras' position smoothly along the x and y axis, and on mouse scroll zooms in and out 

 

Is this something that already exists (or is close) or do I need to start looking into extending one of the existing cameras? 

[arcanine]

The closest camera I've seen is the one implemented here by one of our members: 

http://area51.lypster.net:8888/

Though I'm still not 100% sure how it is implemented, the problem is that it requires mouse hover at the side of the screen like a traditional rts but I'm not sure this approach works on mobile, mouse drag for x and y would be ideal I think 

[arcanine]

http://www.html5gamedevs.com/topic/6557-babylon-projects/?p=43485

 

Here is a link to what I'm after camera wise, the problem is I cannot reverse engine it easily because it is minified (though not obfuscated) 

[arcanine]

I've reverse engineered enough to get zoom in and out on the z axis on mouse scroll

(though I've yet to make a mobile equivalent I'll tackle that when my app is slightly more fleshed out) 

basically use this polyfill to catch the event: http://snipplr.com/view/68762/ then modify the z position of your active camera 

 

still not sure on how to get x and y position movement on drag yet

[arcanine]

Attempted to rewrite the attachControl method through the prototype chain when I realised I'm using a minified version

of babylon those function names aren't going to what I expect them to be, bleh, I tried building a version of babylon the other day using the build tool provided and the build of babylon it gave me was over a megabyte 

 

I'm assuming that build tool is only concatenating? and I'll have to extend one of the camera before the minification process? 

 

I feel like I'm going the long way around with this approach is moving cameras via drag really not a common requirement? 

 

I guess the other approach is using hand.js's events and nullifying any events in the original camera though not sure how to calculate a offset to move by passed on a drag's start and end event..

[GameMonetize]

Hello you already did a good job:)

 

We are using the tool to concatenate and then grunt-uglify to produce the minified version.

 

I like your idea of changing the attachControl. You should just inherit from freeCamera to create your ownCamera (like what we did for touchCamera)

[arcanine]

okay I've extended the free camera: 

https://github.com/slifin/Flourish-babylon/blob/cafe4792da4ff03a9f3575bb1d3bd46e2a33dae7/js/camera2D.js

 

I'm not sure why the mouse events are private members of the method this code could have been a lot shorter if I didn't have to override all of the methods the only real change is in mousemove

As a result the method is quite brittle so I wouldn't recommend this for anything important 

 

but basically initialise your free camera, pass it into this method and you should get a 2D camera which you can then call attachControl() on,

change the camera's angularSensibility prior to passing it and you can control the scroll speed, a lower value is a faster speed, though wouldn't take much code to inverse that if need be

 

 

example call:

var camera = Camera2D(new BABYLON.FreeCamera("camera", new BABYLON.Vector3(0, 0, -20), scene))

[arcanine]

seems like I'm having some problems with prospective, things closer to the edge of the screen are getting viewed from an angle 

 

looking at the code it seems like I need a ORTHOGRAPHIC_CAMERA, so I've enabled that with camera.mode = 1 but now my z controls don't seem to be working

 

and my scene is tiny, like it's now in the distance, here's the pseudo code  

var camera = new BABYLON.FreeCamera("camera", new BABYLON.Vector3(0, 0, 0), scene),camera.mode = 1;

why isn't my camera close to my scene any more? and how come controlling the z axis appears to make no difference? 

[Temechon]

The answer is here : http://www.html5gamedevs.com/topic/10780-orthographic-camera/