ise*_*ise 2 tquery webgl three.js
我正在创建一个带有地图的3D地球仪,它应该在几秒钟后解开并填满屏幕.
我已经设法使用three.js和webGL创建地球仪,但是我无法找到有关能够为形状变化设置动画的任何信息.有人可以提供任何帮助吗？它甚至可能吗？
(抽象算法和Kevin Reid的答案很好,只缺少一件事:一些实际的Three.js代码.)
您基本上需要计算原始球体的每个点在平坦化后将其映射到的位置.此数据是着色器的一个属性:附加到每个顶点的一段数据,它不同于几何体的顶点到顶点.然后,要动画从原始位置到结束位置的过渡,在动画循环中,您将需要更新已经过去的时间量.此数据是着色器的统一:在动画的每个帧期间对于所有顶点保持不变的一段数据,但可以从一帧更改为下一帧.最后,存在称为"混合"的方便函数,其将在每个顶点的原始位置和结束/目标位置之间线性插值.
我已经为你写了两个例子:第一个只是"展平"一个球体,将点(x,y,z)发送到点(x,0,z).
http://stemkoski.github.io/Three.js/Shader-Attributes.html
第二个例子遵循抽象算法在评论中的建议:"将球体的顶点展开回平面上,就像反球面UV贴图一样." 在这个例子中,我们可以很容易地从UV坐标计算结束位置,因此在这种情况下我们实际上不需要属性.
http://stemkoski.github.io/Three.js/Sphere-Unwrapping.html
希望这可以帮助!