I'm using babylonJs to draw some cylinders between 2 points and it works perfect when the points have the Y coord in 0, but when one of the points have a different Y, then the cylinder is off as you can see in the image Error
This diagonal should go from corner to corner. The code I'm using is this one:
for(var i = 0;i+1 < newObj.attachmentPoints.length;i++){
if( newObj.attachmentPoints[i].attachmentType === "Measure" && newObj.attachmentPoints[i+1].attachmentType === "Measure")
{
let from = new BABYLON.Vector3(newObj.attachmentPoints[i].location.x, -newObj.attachmentPoints[i].location.y, -newObj.attachmentPoints[i].location.z);
let to = new BABYLON.Vector3(newObj.attachmentPoints[i+1].location.x, -newObj.attachmentPoints[i+1].location.y, -newObj.attachmentPoints[i+1].location.z);
const faceColors = [ ];
faceColors[0] = new BABYLON.Color4(0, 0, 1, 1);
faceColors[1] = new BABYLON.Color4(0, 0, 1, 1);
faceColors[2] = new BABYLON.Color4(0, 0, 1, 1);
let distance = BABYLON.Vector3.Distance(to,from );
var options = {
height:distance,
diameterTop:1,
diameterBottom:1,
tessellation:36,
faceColors:faceColors
}
var cylinder = BABYLON.MeshBuilder.CreateCylinder("cylinder", options, this._scene);
cylinder.setPivotMatrix(BABYLON.Matrix.Translation(0, -distance / 2, 0));
cylinder.position = new BABYLON.Vector3(newObj.attachmentPoints[i+1].location.x, -distance / 2, -newObj.attachmentPoints[i+1].location.z);
var v1 = to.subtract(from);
v1.normalize();
var v2 = new BABYLON.Vector3(0, 1, 0);
var axis = BABYLON.Vector3.Cross(v1, v2);
axis.normalize();
console.log(axis);
var angle = BABYLON.Vector3.Dot(v1, v2);
cylinder.rotationQuaternion = BABYLON.Quaternion.RotationAxis(axis, -Math.PI / 2 + angle);
}
}
Any clue?