basti Posted March 12, 2018 Share Posted March 12, 2018 Hi Guys, I recently started to work with Babylon and I was wondering if the behavior for the arcRotate Camera is expected or not or I'm just doing something wrong :). Maybe you can help me out with that. I would like to pan in the scene like this example here(https://www.mapbox.com/help/studio-manual-tutorials/). Unfortunately if I try to do the same in Babylon the panning for X and Y axis is different(Given that alpha and beta are zero). Panning along the Z-axis(left and right) is easy while panning along the X-axis(up and down) is almost impossible. See https://playground.babylonjs.com/#K9MWF6#1 I hope this explanation was not too bad. So my question is if it is wanted like this how can I change it to have a similar experience to the panning behavior in the Mapbox example. Thanks in advance. Basti Quote Link to comment Share on other sites More sharing options...
aWeirdo Posted March 12, 2018 Share Posted March 12, 2018 Hi @basti Welcome to the forums. Works fine if you use the right angles & panningAxis X(Left/right), Y(up/down), Z(depth) https://playground.babylonjs.com/#K9MWF6#3 GameMonetize 1 Quote Link to comment Share on other sites More sharing options...
basti Posted March 13, 2018 Author Share Posted March 13, 2018 Hi aWeirdo, thanks for your answer. If I take your example and try to flip the map like here https://www.mapbox.com/help/studio-manual-tutorials/ I have the problem that the map moves up/down and not back and forward on panning. Like https://playground.babylonjs.com/#K9MWF6#4 Somehow it looks as if I need to update the panningAxis Vector in depending of the change of beta?! But I think that wont be so easy... Quote Link to comment Share on other sites More sharing options...
aWeirdo Posted March 13, 2018 Share Posted March 13, 2018 Hi @basti I believe this is due to how the camera panning works internally.. I tried updating some old panning code i once made, but i'm having a bit of a hard time smoothing the movement out. https://playground.babylonjs.com/#K9MWF6#5 Quote Link to comment Share on other sites More sharing options...
aWeirdo Posted March 13, 2018 Share Posted March 13, 2018 @basti I got tired of messing around with it, so here's a slightly hacky solution that works properly. I have updated the ArcRotateCamera._checkInputs and removed _transformedDirection code, it now ignores the camera's angles and always pan directly on the panningAxis. https://playground.babylonjs.com/#K9MWF6#6 Quote Link to comment Share on other sites More sharing options...
basti Posted March 15, 2018 Author Share Posted March 15, 2018 Hi @aWeirdo, I tried your example and modified it a little bit(https://www.babylonjs-playground.com/#K9MWF6#7). I changed the Axis to use the rotation feature for Alpha on the right mouse button. Now it works very well. Thank you very much for that. Unfortunately I noticed when I try to rotate the map around the center point at about 90 degrees(right mouse button) and use panning after this, x and y axis are interchanged for panning. Could it be because there is some kind of transformation missing? Thanks again Quote Link to comment Share on other sites More sharing options...
aWeirdo Posted March 15, 2018 Share Posted March 15, 2018 Hi @basti If you mean this odd panning when changing the Alpha rotation; https://www.babylonjs-playground.com/#K9MWF6#9 Then yes, that is indeed because of the missing transformation. However, I thought you wanted a top-down view, (in which Z panning isn't working properly) https://www.babylonjs-playground.com/#K9MWF6#10 ( @ deltakosh Is this a bug?) I believe the issue may be related to the camera transform matrix, when Beta is "top-down" or close to it, (value of 0), and used for multiplying it nulls the direction.. // In ArcRotateCamera checkInputs.. BABYLON.Vector3.TransformNormalToRef(this._localDirection, this._cameraTransformMatrix, this._transformedDirection); // Vector3.. Vector3.TransformNormalToRef = function (vector, transformation, result) { var x = (vector.x * transformation.m[0]) + (vector.y * transformation.m[4]) + (vector.z * transformation.m[8]); var y = (vector.x * transformation.m[1]) + (vector.y * transformation.m[5]) + (vector.z * transformation.m[9]); var z = (vector.x * transformation.m[2]) + (vector.y * transformation.m[6]) + (vector.z * transformation.m[10]); result.x = x; result.y = y; result.z = z; }; Sorry, i confused lower and upper limits for a minute there.. but if you are planning on having upperBetaLimit = Math.PI / 3; You can keep the transformation; https://www.babylonjs-playground.com/#K9MWF6#11 Quote Link to comment Share on other sites More sharing options...
basti Posted March 15, 2018 Author Share Posted March 15, 2018 Hi @aWeirdo, 1 hour ago, aWeirdo said: If you mean this odd panning when changing the Alpha rotation; https://www.babylonjs-playground.com/#K9MWF6#9 yes thats what I meant. 1 hour ago, aWeirdo said: However, I thought you wanted a top-down view, (in which Z panning isn't working properly) https://www.babylonjs-playground.com/#K9MWF6#10 ( @Deltakosh Is this a bug?) I noticed I need to flip your example to make it possible to change alpha in order to rotate the map around the center point. Thats why I changed the panning axis from your examples. I would like the top-down view and be able to change beta from 0 to Pi/2(maybe not that much but in this direction). Sorry for not making that point clear. I would like to be as close as possible to this map view. ( https://www.mapbox.com/help/studio-manual-tutorials/) where I have panning on the left button and on the right button rotation around a center point. This one https://www.babylonjs-playground.com/#K9MWF6#10 looks actually quite good except for the panning problem. Hopefully @Deltakosh can say something about the panning behavior. Quote Link to comment Share on other sites More sharing options...
aWeirdo Posted March 15, 2018 Share Posted March 15, 2018 @basti Fix here; https://www.babylonjs-playground.com/#K9MWF6#12 you'll need the TransformNormalToRef_forMapPanning function aswell as the updated _checkInputs function. the bugged happend when the transformMatrix was being applied as if we were panning axis 1, 1, 0 (default) and not axis 1,0,1 (map panning) @Deltakosh Want me to PR this? Please check it over, it seems to work but i don't know if it was the root of the issue or just a post-root correction..( Apologies for the many pings ) Quote Link to comment Share on other sites More sharing options...
basti Posted March 15, 2018 Author Share Posted March 15, 2018 3 minutes ago, aWeirdo said: Fix here; https://www.babylonjs-playground.com/#K9MWF6#12 Awesome this is perfect. Thanks a lot. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.