【threejs】实现星空、星链、太阳系、线等效果的参考

前言

星空其实就是粒子。
星链是一组星星用线连接。
如果要增加指向的箭头，则需要再加上箭头。

一些入门的Threejs项目参考

效果

• threejs实现3D星空效果
  没实际跑过，无完整项目代码，效果还可以。无星星材质图。

• Three.js 的 3D 粒子动画：群星送福
  没实际跑过，有源码，有打碎重组的效果实现

• 线

  • ThreeJS 中线的那些事
    • 详细的教程贴，线的实现。
  • 关于线的宽度修改：THREE.js（三）：解决设置材质线条宽度(lineWidth) 无效
    • 然而还没找到对星链的线条修改的方法= =

• three.js实现太阳系

  • vue2+有源码+有demo，demo地址
  • 但是在本地运行npm i 失败不知道为啥
  • 贴图都比较全，有使用到group
  • 背景星空效果也还可以（加了贴图的云层）
  • 参考的是SOLAR SYSTEM，非常酷炫的项目

交互

• 增加点击或者Hover事件（忘了有没有参考下面这些了- -后面整理的时候再看看）
  • threejs如何在三维场景中添加点击事件
  • three.js实现点击事件（vue）
  • Three.js - 通过 THREE.Raycaster 实现模型选中与信息显示
  • Three.js实现hover与Click选中效果
  • vue-cli3.0以上 threejs引入obj模型 点击显示模型数据 点击高亮

---

乱入

• 使用js+canvas实现连线星空效果
  没有试过，代码全的，可以试试

---

扩展
threejs-生成带宽度的线-MeshLine的使用
代码没试过，但是看起来是可以贴材质，做中国风的效果。
使用线实现彩带等效果的参考
没试过代码。
three.js 实现图片粒子爆炸特效 有点像点击后水珠迸溅的效果，有源码，没试过