THREE.js 入门之上海外滩
- 最近入了 three.js 的坑,想用 three.js 做一些 demo 以便巩固自己最近所掌握的知识点,而且正好赶上国庆放假,随,有了这篇~
- 预览地址:Three.js 之上海外滩 欢迎 start❤️~
本篇虽是关于 Three.js 入门的文章,但是太过入门的就不讲了。没意义,网上很多知识,本篇主要是把自己在写 demo 时候遇到的坑点给记录下来,有什么不懂的直接去查阅文档或者网上搜,这里要提一下:Three.js 的官方文档和例子对于开发者也是挺好的(有中文版!)
废话不多,先看下效果吧:
代码比较多,就不一一讲解了,本篇主要分为以下几个部分:
- 初始化代码,创建场景,相机,渲染器,灯光,搭建不规则的地面几何体等
- 搭建东方明珠
- 搭建上海中心大厦
- 搭建环球金融中心
- 搭建金茂大厦
- 随机算法搭建其他建筑物
- 给所有建筑物进行贴图优化
- 搭建黄浦江
- 搭建 360 全景空间