BabylonJS - toEulerAngles BUG
http://www.html5gamedevs.com/topic/3159-quaternionrotationyawpitchroll-parameters-and-toeulerangles-result-should-be-the-same/
HTML
<script src="https://rawgithub.com/BabylonJS/Babylon.js/v1.8.0/babylon.1.8.0.js"></script>
<div id="rootDiv">
<canvas id="renderCanvas"></canvas>
<canvas id="canvas_2D"></canvas>
</div>
CSS
html, body, div, canvas {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
overflow: hidden;
}
#canvas_2D {
position: absolute;
top: 0;
pointer-events: none;
}
JavaScript
var rotation = new BABYLON.Vector3(0.78, 0.78, 0.78);
var q = BABYLON.Quaternion.RotationYawPitchRoll(0, 0, 1000);
var eulerAngles = q.toEulerAngles();
var drawAxisFor = [];
// Get the Canvas element from our HTML below
var canvas = document.getElementById("renderCanvas");
// Load BABYLON 3D engine
var engine = new BABYLON.Engine(canvas, true);
var scene = new BABYLON.Scene(engine);
// Create a camera
var camera = new BABYLON.ArcRotateCamera ("Camera", -1.6, 1.1, 140, BABYLON.Vector3.Zero(), scene);
// Attach the camera to the scene
scene.activeCamera.attachControl(canvas);
// Create meshes
var ground = new BABYLON.Mesh.CreatePlane("ground", 100, scene);
ground.rotation.x = Math.PI / 2;
var model1 = BABYLON.Mesh.CreateBox("model1", 7, scene);
model1.position.x = -30;
model1.rotation = rotation;
var model2 = BABYLON.Mesh.CreateBox("model2", 7, scene);
model2.position.x = 30;
model2.rotation = eulerAngles;
var material = new BABYLON.StandardMaterial("default", scene);
material.emissiveColor = new BABYLON.Color3(0.3, 0.3, 0.5);
material.wireframe = true;
ground.material = material;
model1.material = material;
model2.material = material;
drawAxisFor.push(model1);
drawAxisFor.push(model2);
var canvas2D = document.getElementById("canvas_2D");
var context2D = canvas2D.getContext("2d");
//Add a placeholder function for browsers that don't have setLineDash()
if (!context2D.setLineDash) {
context.setLineDash = function () {}
}
var clearCanvas2D = function(){
canvas2D.width = window.innerWidth;
canvas2D.height = window.innerHeight;
};
var drawAxis = function(camera, mesh, drawAncestors, pivot){
context2D.lineWidth = 1;
context2D.shadowColor = '#000000';
context2D.lineCap = "square";
context2D.shadowBlur = 10;
context2D.shadowOffsetX = 0;
context2D.shadowOffsetY = 0;
//////////////////////// update camera view matrix
var viewMatrix = camera.getViewMatrix();
//////////////////////////
var...