ThreeJS版本-3D模型动态展示

中级JavaScript 共计13节课时长00:53:42 ￥199.00 购买

课程介绍

本课程使用 Three.js 3D 渲染引擎和 Tween.js 动画库，层层递进的将 Blender 导出的多层汉堡模型加载到页面中，实现汉堡的多角度全景转动展示以及不同层级的展开与回收，让用户最大程度的了解将 3D 模型加载到渲染引擎中的方方面面，实现模型在立体空间中的全方位展示效果。

课程附件

下载附件

课程目录

课程介绍
- 课程介绍 ( 00:03:17 )
Three.js基础与页面搭建
- Three.js基础 ( 00:03:23 )
- Three.js 创建相机 ( 00:05:52 )
- 添加渲染器与resize监听 ( 00:04:30 )
3D 模型的导出与加载
- Blender 基础 ( 00:01:26 )
- Blender 模型导出 ( 00:02:38 )
- 引入全景背景图 ( 00:05:28 )
- 引入3D模型 ( 00:05:18 )
实现页面场景的转动与元素缩放
- 添加轨道控制器 ( 00:05:06 )
使用Tween.js制作入场动画及元素移动
- Tween.js 基础 ( 00:01:57 )
- 使用 Tween.js 制作模型动画 ( 00:05:02 )
细化页面效果
- 制作预加载页面 ( 00:04:58 )
- 曝光调整与控制转动角度 ( 00:04:47 )