Javascript 如何在p5.js中为球体（冠状病毒）周围的圆柱体创建嵌套for循环？

我是个新手，正在学习p5.js，我正在尝试用p5.js制作一个带有球体和一堆圆柱体的3D冠状病毒

你可以在这里看到我的草图：

var sketch=函数（p）{
与（p）{
设角度=0；
p、 设置=函数（）{
createCanvas（400400，WEBGL）；
};
p、 draw=函数（）{
环境光（255）；
背景（175）；
仰泳（）；
旋转（角度）；
rotateZ（角度*0.8）；
正常材料（）；
推（）；
rotateY（PI）；
球体（100）；
pop（）；
推（）；
对于（i=0；i<24；i++）{
rotateZ（PI/6）；
推（）；
平移（0，-21*5，0*5）；
rotateY（PI/18）；
rotateX（0）；
气缸（6,20）；
pop（）；
} 
对于（i=0；i<24；i++）{
rotateZ（PI/5）；
推（）；
平移（0，-19*5，9*5）；
rotateY（PI/18）；
rotateX（-PI/8）；
气缸（6,20）；
pop（）；
} 
对于（i=0；i<24；i++）{
rotateZ（PI/4）；
推（）；
平移（0，-15*5，15*5）；
rotateY（PI/18）；
rotateX（-PI/4）；
气缸（6,20）；
pop（）；
} 
对于（i=0；i<24；i++）{
rotateZ（PI/3）；
推（）；
翻译（0，-9*5，19*5）；
rotateY（PI/18）；
rotateX（-PI/2.5）；
气缸（6,20）；
pop（）；
}  
对于（i=0；i<5；i++）{
rotateZ（0）；
推（）；
翻译（0,0*5,21*5）；
rotateY（0）；
rotateX（-PI/2）；
气缸（6,20）；
pop（）；
} 
对于（i=0；i<5；i++）{
rotateZ（0）；
推（）；
翻译（0,0*5，-21*5）；
rotateY（0）；
rotateX（-PI/2）；
气缸（6,20）；
pop（）；
} 
对于（i=0；i<24；i++）{
rotateZ（PI/3）；
推（）；
翻译（0,9*5，-19*5）；
rotateY（-PI/18）；
rotateX（-PI/2.5）；
气缸（6,20）；
pop（）；
} 
对于（i=0；i<24；i++）{
rotateZ（PI/4）；
推（）；
翻译（0,15*5，-15*5）；
rotateY（-PI/18）；
rotateX（-PI/4）；
气缸（6,20）；
pop（）；
} 
对于（i=0；i<24；i++）{
rotateZ（PI/5）；
推（）；
翻译（0,19*5，-9*5）；
rotateY（-PI/18）；
rotateX（-PI/8）；
气缸（6,20）；
pop（）；
} 
pop（）；
角度+=0.01；
};
}
};
让节点=document.createElement（'div'）；
window.document.getElementById（'p5-container'）.appendChild（节点）；
新p5（草图、节点）
正文{
背景色：#e9e9e9；
}
这里有一个简单的解决方案。在下面的代码中，我首先根据
总的
顶点数计算每个顶点的位置，并将它们存储在名为
globe
的2D数组中！这将允许您存储信息，稍后在代码中可以使用这些信息以单数for循环（每个）绘制球体和圆柱体

然后，我根据存储在
globe
中的信息，使用三角形（换句话说，顶点、边和面）创建了一个球体。你会注意到我画的不是圆柱体而是球体。如果你试着把它改成圆柱体，它看起来就不那么吸引人了。我的数学不是很好，但是你可以通过计算每个顶点的
法线来解决这个问题。您可能会发现这很有帮助，但请记住，您需要将其从2D转换为3D


constglobe=[]//保存向量的二维数组（v1、v2）
常数r=70//圆半径
常数总数=15//顶点数
设角x=0//旋转X轴
设angleY=0//旋转Y轴
函数设置（）{
createCanvas（300200，WEBGL）；
//根据给定的顶点数计算向量
对于（设i=0；i

html，正文{
保证金：0；
填充：0；
}
帆布{
显示：块；
}

经过一些研究，我认为我应该采用分形树方法，而不是这种循环方法……我将继续在这里尝试；）请看问题的答案。您是否考虑过使用向量绘制球体。然后你可以用一个做循环，画一个圆柱体