Javascript 如何让模型与随机旋转90度角？

我可以使用圆柱体绘制树（数据在图1中）（结果在图1中），但现在 我不知道如何让树模型随机旋转90度角

第一个输入点

//input point 
//It is a,b,b,c,b,d......
//start point,end point,start point,end point....
const line_point =[0, 0, 0,
 2, 151, 2,
 2, 151, 2, 
 -62, 283, 63,
 2, 151, 2,
 62, 297, -58,
 -62, 283, 63,
 -104, 334, 74,
 -62, 283, 63,
 -58, 338,  45,
 62, 297, -58, 
 67, 403, -55,
 62, 297, -58,
 105, 365, -86];

const star_line_x= new Array();
const star_line_y= new Array();
const star_line_z= new Array();

const end_line_x= new Array();
const end_line_y= new Array();
const end_line_z= new Array();

for (var q=0; q < line_point.length; q+=6){
    star_line_x.push(line_point[q]);
}
for (var r=1; r < line_point.length; r+=6){
    star_line_y.push(line_point[r]);
}
for (var s=2; s < line_point.length; s+=6){
    star_line_z.push(line_point[s]);
}

for (var t=3; t < line_point.length; t+=6){
    end_line_x.push(line_point[t]);
}
for (var u=4; u < line_point.length; u+=6){
    end_line_y.push(line_point[u]);

}
for (var v=5; v < line_point.length; v+=6){

    end_line_z.push(line_point[v]);
}
var cylinder_star_point = new Array();
var cylinder_end_point = new Array();

//star_point end_point
for (var w=0; w < line_point.length/6; w++){

var star_point = new THREE.Vector3 (star_line_x[w],star_line_y[w],star_line_z[w]);
    var end_point = new THREE.Vector3 (end_line_x[w],end_line_y[w],end_line_z[w]);
    cylinder_star_point.push( star_point);
    cylinder_end_point.push( end_point);
}

取出星点和终点

//input point 
//It is a,b,b,c,b,d......
//start point,end point,start point,end point....
const line_point =[0, 0, 0,
 2, 151, 2,
 2, 151, 2, 
 -62, 283, 63,
 2, 151, 2,
 62, 297, -58,
 -62, 283, 63,
 -104, 334, 74,
 -62, 283, 63,
 -58, 338,  45,
 62, 297, -58, 
 67, 403, -55,
 62, 297, -58,
 105, 365, -86];

const star_line_x= new Array();
const star_line_y= new Array();
const star_line_z= new Array();

const end_line_x= new Array();
const end_line_y= new Array();
const end_line_z= new Array();

for (var q=0; q < line_point.length; q+=6){
    star_line_x.push(line_point[q]);
}
for (var r=1; r < line_point.length; r+=6){
    star_line_y.push(line_point[r]);
}
for (var s=2; s < line_point.length; s+=6){
    star_line_z.push(line_point[s]);
}

for (var t=3; t < line_point.length; t+=6){
    end_line_x.push(line_point[t]);
}
for (var u=4; u < line_point.length; u+=6){
    end_line_y.push(line_point[u]);

}
for (var v=5; v < line_point.length; v+=6){

    end_line_z.push(line_point[v]);
}
var cylinder_star_point = new Array();
var cylinder_end_point = new Array();

//star_point end_point
for (var w=0; w < line_point.length/6; w++){

var star_point = new THREE.Vector3 (star_line_x[w],star_line_y[w],star_line_z[w]);
    var end_point = new THREE.Vector3 (end_line_x[w],end_line_y[w],end_line_z[w]);
    cylinder_star_point.push( star_point);
    cylinder_end_point.push( end_point);
}

const star_line_x=new Array（）；
const star_line_y=新数组（）；
const star_line_z=新数组（）；
const end_line_x=新数组（）；
const end_line_y=新数组（）；
const end_line_z=新数组（）；
对于（变量q=0；q

计算气缸高

//calculation cylinder high
var line_len = new Array();
for (var dd=0; dd < line_point.length/6; dd++){
    var len_x = Math.pow(end_line_x[dd]-star_line_x[dd],2);
    var len_y = Math.pow(end_line_y[dd]-star_line_y[dd],2);
    var len_z = Math.pow(end_line_z[dd]-star_line_z[dd],2);
    var len_direction = Math.sqrt(len_x+len_y+len_z);
    line_len.push(len_direction);//Cylinder high

}

//计算气缸高
var line_len=新数组（）；
对于（变量dd=0；dd

计算中心点

//center_point
const cylinder_center_point= new Array();
for (var bb=0; bb< cylinder_end_point.length; bb++){
    var star_set_point = cylinder_star_point[bb];
    var end_set_point = cylinder_end_point[bb];
    var center_point = end_set_point.clone().add(star_set_point).divideScalar(2);
    cylinder_center_point.push(center_point);
}

//中心点
常数圆柱体_中心_点=新阵列（）；
对于（var bb=0；bb<圆柱体\端点\点长度；bb++）{
var star_set_point=圆柱体_star_point[bb]；
var end_set_point=圆柱体_end_point[bb]；
var center_point=end_set_point.clone（）.add（star_set_point）.divideScalar（2）；
气缸中心点。推动（中心点）；
}

计算圆柱体方向向量

//cylinder direction
const cylinder_direction= new Array();
for (var cc=0; cc < cylinder_end_point.length; cc++){
    var star_direction = cylinder_star_point[cc];
    var end_direction = cylinder_end_point[cc];
    var center_direction  = end_direction.clone().sub(star_direction);
    cylinder_direction.push(center_direction);
}

   for (var dd=0; dd <cylinder_direction.length;dd++){
    var material = new THREE.MeshPhongMaterial({color:'#ff0000'});
    let upVector = new THREE.Vector3(0, 1, 0);

    var geometry = new THREE.CylinderGeometry(5, 5, line_len[dd], 20, 1, false); 
    var mesh = new THREE.Mesh(geometry, material);
    mesh.position.set(0, line_len[dd]/2, 0);

    var group = new THREE.Group();
    group.position.set(star_line_x[dd],star_line_y[dd],star_line_z[dd]);
    group.add(mesh);

    let targetVector =cylinder_direction[dd];
    let quaternion = new THREE.Quaternion().setFromUnitVectors(upVector, targetVector.normalize());
    group.setRotationFromQuaternion(quaternion) 
    scene.add(group)
} 

//圆柱体方向
常量圆柱体_方向=新数组（）；
对于（var cc=0；cc<圆柱体\端点\点长度；cc++）{
var star_方向=圆柱体_star_点[cc]；
var end_方向=圆柱体_end_点[cc]；
var center\u direction=end\u direction.clone（）.sub（星形方向）；
气缸方向。推动（中心方向）；
}

牵引油缸

//cylinder direction
const cylinder_direction= new Array();
for (var cc=0; cc < cylinder_end_point.length; cc++){
    var star_direction = cylinder_star_point[cc];
    var end_direction = cylinder_end_point[cc];
    var center_direction  = end_direction.clone().sub(star_direction);
    cylinder_direction.push(center_direction);
}

   for (var dd=0; dd <cylinder_direction.length;dd++){
    var material = new THREE.MeshPhongMaterial({color:'#ff0000'});
    let upVector = new THREE.Vector3(0, 1, 0);

    var geometry = new THREE.CylinderGeometry(5, 5, line_len[dd], 20, 1, false); 
    var mesh = new THREE.Mesh(geometry, material);
    mesh.position.set(0, line_len[dd]/2, 0);

    var group = new THREE.Group();
    group.position.set(star_line_x[dd],star_line_y[dd],star_line_z[dd]);
    group.add(mesh);

    let targetVector =cylinder_direction[dd];
    let quaternion = new THREE.Quaternion().setFromUnitVectors(upVector, targetVector.normalize());
    group.setRotationFromQuaternion(quaternion) 
    scene.add(group)
} 

---

for（var dd=0；dd可以设置每个圆柱体网格的旋转.z，也可以使用名为.lookAt的辅助函数（使对象“指向”空间中的某个位置）

在使用.lookAt（）之前，请确保首先将对象添加到场景中

下面是通过递归和对象层次结构创建树结构的另一种方法：

@manthraxThank衷心感谢你的回答。我很难理解它。你能提供更多细节吗？我用glitch中的一个例子更新了我的答案。让我知道这是否有帮助？@manthraxThank谢谢你的回答。对不起，我的例子太复杂了。因此，如果我想旋转树，我需要旋转。Y和Z？而不是scene.add（group）try:treeGroup=new THREE.group（）treeGroup.add（group）scene.add（treeGroup）treeGroup.rotation.y+=Math.PI*Math.random（）*2也许？@manthraxThank谢谢你这么多。我试着用你告诉我的想法，然后用treeGroup.rotation.y=-Math.PI/2；这就是答案。谢谢你的帮助。