(TODO)技术拆解-元素周期表效果

这个从代码上来看,是比较简单的,关键在于思路和几个库。

这份代码写得非常好,完全可以当做我们后续动画的模板代码。

设计思路

  • 通过数学函数计算不同结果的空间坐标值(x, y, z)和旋转值(rotation)
  • 通过 Tween 来进行两个状态的动画变更

几个概念

THREE.PerspectiveCamera

THREE.Scene

THREE.CSS3DObject

THREE.Object3D

THREE.Vector3

THREE.CSS3DRenderer

THREE.TrackballControls

实现原理

球形布局的算法

螺旋布局的算法

动画

requestAnimationFrame