渲染你的第一个 3d 场景 By Three.js

课程目录

• P5_使用 three.js 渲染第一个场景：点击查看
• P6_轨道控制器查看物体：点击查看
• P7_添加坐标辅助器：点击查看
• P8_设置物体移动：点击查看
• P9_移动缩放与旋转：点击查看
• P10_应用 requestAnimationFrame：点击查看
• P11_通过 Clock 跟踪时间处理动画应用：点击查看
• P12_Gsap 动画库基本使用与原理：点击查看
• P13_Gsap 控制动画属性与方法：点击查看
• P14_根据尺寸变化实现自适应画面：点击查看
• P15_调用 js 接口控制画面布局全屏和退出全屏：点击查看
• P16_应用图形用户界面变更变量.js：点击查看
• P17_掌握几何体顶点_UV_法向属性：点击查看
• P18_BufferGeometry 设置顶点创建矩形.js：点击查看
• P19_生成酷炫三角形科技物体：点击查看
• P20_常见网络几何体：点击查看
• P21_初识材质与纹理：点击查看
• P22_详情纹理偏移_旋转_重复：点击查看
• P23_设置纹理显示算法与mipmap点击查看
• P24_透明材质与透明纹理：点击查看
• P25_环境遮挡贴图与强度：点击查看

启动项目

npm run dev
or
yanr dev

项目打包构建

npm run build
or
yarn build

教程

安装 parcel 官网 https://parceljs.org

yarn add --dev parcel

安装 gsap / dat.gui / three

yarn add gsap dat.gui three