Search the Community

I'm totally stumped here. Why is one mesh spinning like crazy but the other standing still? Playground: https://playground.babylonjs.com/#6FB40P

Hello everybody! Hope everyone is going well in the Babylon community ! My issue is simple : I use the mesh.rotate() function in order to rotate a mesh in the BABYLON.Space.WORLD. The function works great and my mesh rotate exactly how I want. The mesh.rotate() function use quaternion and so the rotation attribute is set to Vector0. But when the rotation is hover I would like to have the euler rotation back! To do so I use the mesh.rotationQuaternion.toEulerAngles() function But if I set the mesh.rotation = mesh.rotationQuaternion.toEulerAngles(); Then the mesh is rotating again on my screen like if the euler angles I get from the quaternion wasn't right. There is a lot of topics in this forum concerning this toEulerAngles function but after hours of reading and testing (even changing ZYX, YXZ orders), nothing is working! Is there an other way to get the euler rotation vector back from the quaternion? Or maybe a simplier way to rotate mesh around a world axis? Thanks for your help!

Hey all, I've been playing a bit with quaternions to rotate meshes but I also need to use Euler angles. The quaternions are great for my internal cooking because (imo) they are easier to use and more versatile than Euler angles, but Euler angles are good for UI, it speaks to people (especially if we convert everything into degrees (the audience of the app is neuroscience researchers, so they would probably think quaternions are black magic). The BJS doc says "once you have used a quaternion, the rotation property of a mesh become null and basically no longer usable". Fortunately, we can have user think they set the rotation with a Euler angle but internally convert in into a quaternion. Unfortunately, I think I went into a bug. Here is what I have: // this._planeSystem is a mesh composed of 3 orthogonal planes let currentQuaternion = BABYLON.Quaternion.FromRotationMatrix( this._planeSystem.computeWorldMatrix(true) ) let eulerAngle = currentQuaternion.toEulerAngles() let someQuaternion = eulerAngle.toQuaternion() /* I expected currentQuaternion to be the same as someQuaternion (with possibly some epsylon) but instead, here is what I have: */ currentQuaternion { w: 0.9987502633525326, x: 0.04997916777685541, y: 0, z: -1.1097604563493715e-17 } eulerAngle { x: 0.09999999729822372, y: -1.1148677691588498e-18, z: -2.2278771887960178e-17 } someQuaternion { w: 0.9987502604624825, x: -5.56737237414314e-19, y: -2.786008172251712e-20, z: 0.04997916792147843 } /* I am not sure if it's toEulerAngles() or toEulerAngles() which is in fault but it looks like someQuaternion.z should have been someQuaternion.x */ I'm not sure, but looking at the source, it looks like you plan on giving the choice of the order. Do you confirm it's a bug? Cheers, Jonathan.

Like the title says, there is a function in Quaternion which ignores one of its arguments. I guess my question is, if the default is "YZX", this is the vector3 equivalent of rotating in Y axis, then Z, then X? Also, If yes I am assuming that this is how rotation is applied in frame, right?

Hello everyone!I plan to use the Kinect v2 (that for xboxOne) to move an avatar in my scene.My idea was to gain the quaternions of jointOrientations and then change the appropriate bone matrix. Nevertheless, the jointOrientations are expressed in global rotations (each jointOrientation indicates the direction of the joint in absolute coordinates) while, if I understand it, I can only modify the local matrix of skeleton bone. So I am trying to convert local jointOrientation in local rotation:var joint; //the joint of kinectvar parent = joint.Parent();var localOrientation = BABYLON.Quaternion.Inverse(parent.Orientation).Multiply(joint.Orientation);But I'm having trouble in the transformation of the reference coordinate between kinect joints and avatar bones int the babylon scene... I tried to change the axes by swapping values (x, y, z), but I'm probably wrong var kinectOrientation; //orientation of the joint expressed in quaternionreturn new BABYLON.Quaternion(kinectOrientation.y, kinectOrientation.x, kinectOrientation.z, kinectOrientation.w); //this is just one example, I have tried in different casesDo you have any advice? Thanks in advance

Hi, We have a project where there's a need to get absoluteRotation and / or absoluteRotationQuaternion. Is there a need somewhere so a pull request about this is possible ? If so, is it wise to compute it here https://github.com/BabylonJS/Babylon.js/blob/88145e1d19e13c88afd09c63a474d0af15e0d7a1/src/Mesh/babylon.abstractMesh.ts#L1312 By adding _absoluteRotation and _absoluteRotationQuaternion private properties and this._worldMatrix.getRotationMatrixToRef(Tmp.Matrix[0]); BABYLON.Quaternion.FromRotationMatrixToRef(Tmp.Matrix[0], this._absoluteRotationQuaternion); if (!this.rotationQuaternion) { this._absoluteRotationQuaternion.toEulerAnglesToRef(this._absoluteRotation); } Or should it be only done in a getAbsoluteRotation method to avoid the overhead of computing it every time computeWorldMatrix is invoked ? (note : what's the usage for this kind of question ? using the forum, GitHub issues or directly submitting a PR on GitHub ?) Thanks a lot and have a nice day !

Hello, This may be a simple answer. A cube is rotating around the x axis with .addRotation(). GOAL: detect when cube is flat on top, with z axis, to stop animation. So what are best ways to measure Quaternion rotation progress? And then stop the animation? Thanks much,

I'm doing a label system, you can see the original post here. I don't think it's relevant but you get the background. To make it work, I created various faces on a mesh. Each faces generate a label. To know which one has to be displayed, I would like to compare their angle to the camera to know if it's facing the camera enough to be visible. After some research I came with this : http://www.babylonjs-playground.com/#QNJ03P#1 I'm pretty bad in 3D math but I already found some usefull posts and PG on the forums and the doc. - I think I'm pretty close but I don't know why my camera Quaternion doesn't seems to be refreshed when I rotate the camera (except for the Y axis which switch btw 0 and -0). - Also I'm not sure how to compare both quat so that I can say if the difference is less than 40° I can display it - And finally when I apply the function toQuaternion() on the ground it rotates it. I have the same issues with my faces and I don't know if it will changes something or not. Could someone give some insight to finish this ?

Hi @all again, I have a huge problem with rotation. I hang about one week on this problem. I perpared a playground: http://playground.babylonjs.com/#7CPXT I have a player with a front side. You can see the front side with the aid of the nose mesh. It is the player view direction. The player rotates with the camera rotation. The player stand on a platform. It is possible to rotate the platform with the keys V, B and N. My achived behavior is: The player stand ALWAYS orthogonal on the platform indifferent the platform is rotating AND the player can rotate normal by himself in his own Y-axis direction by rotating the mouse. In the playgound you can see my try with the nearest similar behavior. It seems to work, but how you see in the picture it dont work correct. I realy dispair I am open to all suggestions

Hi! I am new to Babylon.js. Love it so far. I am trying to write a simple game. I want the game character to "float" over the playing field. Right now, I'm just trying to get a simple box to hover. I'm doing it in a somewhat funny way because I want some wobbling to occur as part of the hover. I am trying to use physics. So I have gravity enabled in the scene and collisions enabled for the meshes. Further, I want to apply impulses to the box to get it to hover. I wrote some code to figure out which vertex is the "lowest" of all the verticies of the box. I then apply an impulse to that vertex. Because the vertex is extended from the centroid of the box, a torque is generated by the impulse. I am having difficulty keeping the impulses in range. Typically, without squelching the angular velocity, the box eventually starts rotating out of control. So, I was looking into just manually leveling the rotation using addRotation. First I get the Euler angles from the rotation quaternion. Then I reverse a little bit back onto the box each frame. Oddly, this seems to work very well for about 1 minute. Then suddenly, it fails. I fails slowly, which is even odder to me. It seems like I have to reset some internal state or something.... Can someone point out my missteps? Thanks. Wingnut was kind enough to build a playground example that works (but without the wobble): http://playground.babylonjs.com/#1GWEVG#0 (see his post below). I also have a running version on my website, at: http://165.225.132.154/graphics/BabylonHover/ When I fix the issue, that site will be updated. This snippet shows the original issue. Notice the difference between the working demo Wingnut wrote and this one which doesn't (specifically: the impulses are applied at the verticies here, whereas in the working example, the impulses are applied to the centroid): let dHoverHorizon = 50; let dImpulseForceDivisor = 10; let dRotationAdjustmentFactor = 20; meshBox.registerBeforeRender(() => { try { // Get all the verticies of the mesh, given as an array of 72 floats. // 3 floats for each vertex * // 4 verticies per face * // 6 faces. // // Question #1: Why all 6 faces, which produces 3 times as many verticies as necessary? // Question #2: Is there a way to combine these to remove redundant geometry? let arrayMeshVertexFloats = meshBox.getVertexBuffer(BABYLON.VertexBuffer.PositionKind)._buffer._data; // Extract the 4 verticies for the // face in which we are interested. // This happens to be the 6th face. let arrayMeshVerticies = []; for (let i = 3 * 4 * 5; i < arrayMeshVertexFloats.length; i += 3) { arrayMeshVerticies.push(BABYLON.Vector3.FromArray(arrayMeshVertexFloats, i)); } // Convert these 4 verticies to world coordinates. let arrayWorldVerticies = arrayMeshVerticies.map((vertex) => { let vertexWorld = BABYLON.Vector3.TransformCoordinates(vertex, meshBox.getWorldMatrix()); // Attach original mesh-vertext to the world-vertex. vertexWorld.localVertex = vertex; // Return the new vertex. return vertexWorld; }); // Just for fun, only allow impulse on the lowest of all verticies. let v3Lowest = null; arrayWorldVerticies.forEach((v3) => { if (!v3Lowest || v3Lowest.y > v3.y) { v3Lowest = v3; } }); // Drop out now, if lowest vertex is above hover-horizon. if (v3Lowest.y > dHoverHorizon) { return; } // Generate an impulse proportional to a square- // root of the drop down from the hover-horizon. let dImpulseForce = Math.sqrt(dHoverHorizon - v3Lowest.y) / dImpulseForceDivisor; // Get the linear velocity. let v3LinearVelocity = meshBox.physicsImpostor.getLinearVelocity(); // Only care about the y-axis. let dLinearVelocityAlongYAxis = v3LinearVelocity.y; // If the velocity is negative, then increase the impulse. // Eventually, this will need to take mass into consideration.... if (dLinearVelocityAlongYAxis < 0) { dImpulseForce *= (1 - dLinearVelocityAlongYAxis); } // This doesn't seem to work in a madening way: // Actually, it works for about 1 minute, then // just slowly and seemingly-deliberately fails. let v3Rotation = meshBox.rotationQuaternion.toEulerAngles("XYZ"); meshBox.addRotation(-v3Rotation.x / dRotationAdjustmentFactor, -v3Rotation.y / dRotationAdjustmentFactor, -v3Rotation.z / dRotationAdjustmentFactor); // Apply an "up" impulse to the physics // imposter at the local location of the // lowest vertex found during this pass. meshBox.physicsImpostor.applyImpulse(new BABYLON.Vector3(0, dImpulseForce, 0), v3Lowest.localVertex); } catch (e) { console.log("Error in meshBox.registerBeforeRender: " + e.message); } });

I want to make my camera follow an object, but I also need the ability to look around, the only thing I need at the moment is the camera rotation quaterion or matrix. Is it possible to calculate it somehow? If I had Z vector of camera I could just move camera back by Z vector times n from player and it would work well. If there is a topic about it leave a link below.

This might be due to a lack of general understanding - however I would like to know if there is a way (within bablyonjs) to convert a rotation (e.g. rotation.x = a, rotation.y = b, rotation.z = c) to a quaternion (axis of rotation, and an angle for rotation around that axis; e.g. x,y,z,w). According to the babylonjs docs; they seem to be exclusive of each other; e.g. if you set the AbstractMesh.rotate property (quaternion) then the .rotation property is automatically set to the Zero vector & vice versa. Basic rotation around each of the three axes (e.g. .rotation) is easier for most people (e.g. users of my code) to understand (compared to quaternions) but some other software that I'm trying to integrate with works better with quaternions. Rotation matrix seems to have the same problem (e.g. setting the .rotation property doesn't affect it). I converted some C++ code from cocos2dx into JS to convert a rotation matrix to a quaternion: http://www.babylonjs-playground.com/#1H0QGF#2 However this also doesn't give me a the desired result (because BJS is returning an identity matrix I think). Any Thoughts?

Hi people, I'm about to implement a new useful feature to the core. For now, it's called addRotation(). What is it for ? Well, usually the BJS users aren't big fans of quaternions to manage their mesh rotations, although the quaternions are the best tools to achieve it. Quaternion aren't intuitive, so people prefer the Euler angles, right ? Moreover BJS imposes the rotation order, what is, if I'm not wrong, YXZ. This means that, when you set a mesh rotation (x, y, z), it is rotated first around Y, then around X and finally around Z in its local space. This is important because the rotation is not commutative : if you rotate a mesh for, say, 30° around Y and then for 20° around X, you won't get the same final orientation than if you rotate it first for 20° around X and then only for 30° around Y. In brief, the rotation order really matters ! So, you want to use only the Euler angles and you are constrained by the engine rotation order : no surprise you can hardly achieve the rotation you really want. Here's comes addRotation(x, y, z) to the rescue ! addRotation() will do 3 things for you : - to let you use only Euler angles, whatever the internal mesh rotation is Euler or quaternion based (note : under the hood, addRotation() works with quaternions, but it's hidden for your convenience) - to allow you to decompose your rotation by steps in your custom order to achieve your final orientation : you can rotate a mesh first around X, then around Y, then around X again, then around Z, etc. - to update the initial mesh rotation values for you : if the rotation is Euler based, it's updated as Euler angles (mesh.rotation), if it's a quaternionRotation (mesh.rotationQuaternion), the quaternion is updated. How does it work ? Just give the mesh an initial rotation, or none, (this rotation can be Euler angles or a quaternion, as you want), then add your rotation steps to achieve the wanted final orientation : mesh.rotation.x = Math.PI / 4.0; // initial rotation around x mesh.addRotation(0, Math.PI / 3.0, 0); // the mesh is fisrt rotated around X, then only around Y for PI/3 // you can even link all the rotation steps // here X first, then Z, finally Y mesh.addRotation(x1, 0, 0).addRotation(0, 0, z2).addRotation(0, y3, 0); // the mesh rotation property is computed for you console.log(mesh.rotation); First demo :http://www.babylonjs-playground.com/#1PON40 The left box is the model box. The central box is rotated as usual for PI/3 around X and PI/2 around Y. The BJS rotation order makes it rotate first around Y, then around X. The right box is given an initial rotation for PI/3 around X, then a rotation step is added for PI/2 around Y. You can see that the final orientation differs. If you have a look at the console where the box2 rotation is displayed : http://www.babylonjs-playground.com/#1PON40#1 you will notice that the Euler angles needed to achieve this final orientation have a z value, although you didn't specify anything about Z. Simply because this is the Euler rotation to be done in the required BJS rotation order to achieve this final orientation. Something you wouldn't probably have found by yourself just playing with Euler angles ... Let's go further with the torus wheel challenge. Remember the number of times that, in this forum, people tried out to use the BJS provided shape called torus and to use it as a car wheel. It's damned complex because the torus is designed horizontally in its local space and we need to make rotate either around its central axis (rolling), either around a vertical axis (wheel direction). So some head hache with quaternions or mesh.rotate() once in the local space, once in the world space. Let's try an easier way. Here's the just born torus : http://www.babylonjs-playground.com/#1PON40#2 Let's set it vertical as an initial rotation around Z : http://www.babylonjs-playground.com/#1PON40#3 Too bad the method debugLayer.shouldDisplayAxis() doesn't currently display anything, just keep in mind the torus local axis at this step : Y is the torus central axis (so now horizontal after this first rotation around Z) X is, now the torus is vertical, the vertical axis, Z keeps unchanged along the world Z axis. So in order to make the wheel roll, we will give each frame, from this initial rotation, an extra rotation around X first (wheel direction) and then a rotation around the torus central axis Y http://www.babylonjs-playground.com/#1PON40#4 As you can see, the code is quite short and intuitive : I don't know the BJS required rotation, but I know how to set my torus orientation step by step using only Euler angles. No need for quaternion or space switching here. I just "build" each frame the way to achieve the final rotation with my own rotation steps and my own order. Then it's quite easy to animate car wheels : http://www.babylonjs-playground.com/#1PON40#5 Have fun

Hi, Another head scratcher for me: I'm trying to cast rays to detect if an a object (A) is in "view" of another object (B). B has got lookAt(A) attached to it, so this is how I'm constructing the ray: var ray = new BABYLON.Ray(this.mesh.position, this.mesh.rotationQuaternion.toEulerAngles().normalize()); It's not working, so what am I doing wrong?

Hi everyone ! I am making a game with a friend (mazelpomme): The player controls an airplane. It rotates around a sphere and missiles try to touch it, so missiles align themself with the player. To align missiles on player, we worked with Cross product, Dot product with the down missile's vector and the vector "missile to sphere's center" (@see uploaded images) currently, our code is: missile.lookAt(Player.getInstance().getAbsolutePosition()); var missiletoCenter : BABYLON.Vector3 = missile.getAbsolutePosition().negate(); var missileDown : BABYLON.Vector3 = missile.down.getAbsolutePosition().subtract(missile.getAbsolutePosition()); var angle : number = Math.acos(BABYLON.Vector3.Dot(missiletoCenter.normalize(), missileDown.normalize())); var axis : BABYLON.Vector3 = BABYLON.Vector3.Cross(missiletoCenter, missileDown); missile.rotate(axis, angle); sphere center position is x0, y0, z0 We didn't undestand why that didn't work because we reproduced the same in unity and that worked. (missile.down is a missile's child placed on down missile's axis) Has someone an idea? Can you help us? Thanks Théo & mazelpomme

Maybe realy stupid question. So each object have Can anybody explanin why happend transform.position = (0,0,0) transform.rotationQuaternion = undefined

Hello again I'm trying to animate between two rotations (from 0 to 45 degrees). If I use euler angles, it works fine. If I use quaternions however, it doesn't (it goes to about 20 degrees). See PG below, comment/uncomment lines 44/45. http://www.babylonjs-playground.com/#RSEYY#1 Any thoughts? EDIT: Just found out about .rotationQuaternion, seems to work now Thanks!

changing rotation from quaternion to euler resets the mesh rotation consider this http://www.babylonjs-playground.com/#ZTNIZ Here I am just rotating the cube by 45 degree around y axis. This works as expected. Now just convert the rotation to euler http://www.babylonjs-playground.com/#ZTNIZ#1 And the cube goes back to its previous rotation !!

Hi, I am working on decomposing the world matrix of a mesh, I need it in order to keep rotation, scale and position of a mesh in world space (because these parameters are relative to the parent) if you import it without importing its parents. By testing different codes to decompose the matrix and to transform it into a quaternion, I notice that when you create a BABYLON.quaternion.RotationYawPitchRoll(yaw, pitch, roll) and you call the toEulerAngles() method on this quaternion, it does not return the passed yaw, pitch and roll. I wonder if this behavior is normal ? if yes can you explain me why ? I made a JsFiddle to explain my question. http://jsfiddle.net/Gc7n8/1/ Please look at the console line to see the log.