getfromcode

Three.js可视化企业实战WEBGL课(新增Cesium+元宇宙)

体系课
课程简介

这门课解决什么问题 这门课针对的是职场中常见的三维可视化开发场景。当业务方要求你交付一个能展示城市级地理信息、工业设备运行状态或虚拟场景的网页时,传统二维图表往往力不从心。这门课聚焦WEBGL渲染与Cesium地图集成,帮你把抽象的空间数据变成可交互的三维网页,直接解决从二维报表到三维看板的跃迁难题。 适合什么基础 建议你具备基本的HTML与JavaScr…

已有 0 人浏览 发布 2026-09-23 更新 2026-09-23

这门课解决什么问题

这门课针对的是职场中常见的三维可视化开发场景。当业务方要求你交付一个能展示城市级地理信息、工业设备运行状态或虚拟场景的网页时,传统二维图表往往力不从心。这门课聚焦WEBGL渲染与Cesium地图集成,帮你把抽象的空间数据变成可交互的三维网页,直接解决从二维报表到三维看板的跃迁难题。

适合什么基础

建议你具备基本的HTML与JavaScript语法认知,不需要深厚的数学功底,课程会循序渐进地拆解坐标系、顶点与法向等核心概念。如果你有一定前端开发经验,想向三维可视化或WebGL方向拓展,这门课的资料能直接对接你的现有知识体系,避免从零开始摸索环境搭建的弯路。

建议先看哪几块

优先观看环境搭建与基础渲染模块,这是后续一切的三维操作前提;接着重点攻克PBR材质与纹理、环境遮挡贴图这些决定画面质感的核心模块;最后关注Cesium与元宇宙相关的进阶集成内容,这部分决定了你能做出什么样的企业级效果。

学完能独立做什么

学完能独立完成三维场景的搭建与交互开发。你可以熟练运用轨道控制器控制视角,通过requestAnimationFrame和动画库实现物体的平滑移动与缩放,并掌握物理渲染材质让画面真实,最终将Cesium地图数据融入场景,独立交付一个具备空间数据展示与交互的三维可视化网页应用。

资料怎么配合练习

资料按核心逻辑递进编排,建议边看边动手敲代码。每讲完一个核心概念,比如几何体属性或材质贴图,立刻打开练习环境复刻刚才的操作,不要等看完整个模块再动笔。遇到渲染异常或环境报错,跟着课内给出的排查思路一步步定位,积累实战经验。

课程目录

01. 认识three.js与开发环境搭建 01.课程介绍.mp4 124.80M 02.本地搭建threejs官方网站.mp4 60.62M 03.使用parcel搭建three.js开发环境.mp4 110.45M 04.关于运行搭建three出现的问题.mp4 52.62M 05.使用three.js渲染第一个场景和物体.mp4 180.59M 06.轨道控制器查看物体.mp4 36.79M 02 Three.js开发入门与调试设置 01.添加坐标轴辅助器(1).mp4 17.23M 02.设置物体移动.mp4 26.84M 03.物体的缩放与旋转.mp4 33.23M 04.应用requestAnimationFrame.mp4 26.50M 05.通过Clock跟踪时间处理动画.mp4 37.36M 06.Gsap动画库基本使用与原理.mp4 48.12M 07.Gsap控制动画属性与方法.mp4 36.19M 08.根据尺寸变化实现自适应画面.mp4 51.55M 09.调用js接口控制画布全屏和退出全屏.mp4 38.21M 10.应用图形用户界面更改变量.mp4 87.19M 03 全面认识threejs物体 01.掌握几何体顶点_UV_法向属性.mp4 48.71M 02.BufferGeometry设置顶点创建矩形.mp4 44.00M 03.生成酷炫三角形科技物体.mp4 51.63M 04.常用网格几何体.mp4 51.42M 04 详解材质与纹理 01.初识材质与纹理.mp4 42.36M 02.详解纹理偏移_旋转_重复.mp4 61.37M 03.设置纹理显示算法与mipmap.mp4 49.88M 04.透明材质与透明纹理.mp4 41.72M 05.环境遮挡贴图与强度.mp4 41.95M 05 详解PBR材质纹理 01.详解PBR物理渲染.mp4 51.37M 02.标准网格材质与光照物理效果 .mp4 47.44M 03.置换贴图与顶点细分设置.mp4 45.18M 04,设置粗糙度与粗糙度贴图.mp4 28.66M 05.设置金属度与金属贴图.mp4 23.52M 06.法线贴图应用.mp4 17.86M 07.如何获取各种类型纹理贴图.mp4 34.50M 08.纹理加载进度情况.mp4 96.30M 09.详解环境贴图.mp4 58.73M 10.经纬线映射贴图与HDR.mp4 77.41M 06 详解灯光与阴影 01.灯光与阴影的关系与设置.mp4 73.69M 02.平行关阴影属性与阴影相机原理.mp4 41.31M 03.详解聚光灯各种属性与应用.mp4 76.64M 04.详解点光源属性与应用.mp4 78.12M 07 精通粒子特效 01.初识Points与点材质.mp4 53.39M 02,深度解析点材质属性.mp4 53.41M 03.应用顶点着色打造绚丽多彩的星空.mp4 56.83M 04.通过封装与相机裁剪实现漫天飞舞的雪花.mp4 94.96M 05.运用数学知识打造复杂形状臂旋星系01.mp4 81.88M 06.运用数学知识打造复杂形状臂旋星系02.mp4 29.79M 07.运用数学知识打造复杂形状臂旋星系03.mp4 71.02M 08.运用颜色收敛方法设置星系臂旋渐变.mp4 45.48M 08 详解光线投射与物体交互 01.精讲投射光线实现3维物体交互.mp4 147.11M 09 打造3D全屏滚动官网 01.设置页面结构与样式.mp4 130.41M 02.同步屏幕滚动与相机位置.mp4 165.38M 03.设置第三屏特效.mp4 71.48M 04.切屏时候触发当屏物体特效.mp4 114.32M 05,gsap控制网页切屏文字动画.mp4 32.15M 06.鼠标控制相机摇晃.mp4 82.93M 07.设置滚动条隐藏的方式.mp4 11.07M 10 应用物理引擎设置物体相互作用 01.认识物理引擎与cannon安装.mp4 49.52M 02.使用物理引擎关联Threejs物体.mp4 105.82M 03.设置固定不动的地面与小球碰撞.mp4 29.96M 04.监听碰撞事件和控制碰撞音效.mp4 39.89M 05.关联材质设置摩擦与弹性系数.mp4 35.15M 06.立方体相互碰撞后旋转效果.mp4 77.98M 07.给物体施加力.mp4 17.35M 11 WEBGL与GPU渲染原理(难点)后期再消化亦可 01.渲染管线.mp4 23.02M 02.细讲渲染流程.mp4 54.66M 03.WEBGL绘制三角形.mp4 101.55M 04.缩放矩阵与变量.mp4 73.24M 05.着色器glsl基本规范.mp4 23.84M 12 入门着色器编程 01.初识着色器语言.mp4 47.88M 02.着色器插件安装与文件导入开发.mp4 29.95M 03.认识着色器变量.mp4 60.98M 04.控制顶点位置打造波浪形状.mp4 62.59M 05.传递变量打造动画与uv采样纹理.mp4 38.77M 13 进阶着色器编程 01.着色器编写各类型图案.mp4 202.96M 02.着色器编写各类型图案2.mp4 215.72M 03.shader着色器编写高级图案.mp4 188.09M 04.shader着色器编写高级图案2.mp4 208.79M 05.shader着色器打造漫天飞舞孔明灯1.mp4 317.59M 06.shader着色器打造漫天飞舞孔明灯2.mp4 211.96M 14 着色器打造烟雾水云效果 01.烟雾水效果介绍与代码准备.mp4 48.28M 02.sin函数与噪声函数混合.mp4 93.25M 03.设置sin与噪声参数.mp4 54.93M 04.时间打造流动效果.mp4 45.75M 05.设置水流和波纹方向与速度.mp4 118.98M 06.使用官方提供的水模型.mp4 60.59M 07.打造沙滩_水池.mp4 150.62M 15 着色器设置点材质 01.着色器设置点材质基本设置.mp4 78.88M 02.点着色器图形设置原理.mp4 33.48M 03.使用纹理设置点着色器材质.mp4 35.83M 04.Points中生成不同点图案.mp4 94.99M 05.根据视图Position设置点图案大小.mp4 19.00M 06.着色器设置顶点旋转打造臂旋星系.mp4 27.18M 07.着色器设置顶点颜色打造渐变星系.mp4 19.77M 16 炫丽烟花交互项目案例 01.点着色器设置炫丽烟花项目案例01.mp4 301.94M 02.点着色器设置炫丽烟花项目案例02.mp4 291.25M 03.点着色器设置炫丽烟花项目案例03(1).mp4 314.79M 03.点着色器设置炫丽烟花项目案例03.mp4 314.79M 17 使用着色器加工材质 01.three框架材质原理与应用.mp4 61.81M 02.修改物理光照材质制作人物被打效果01.mp4 63.55M 03.修改物理光照材质制作人物被打效果02.mp4 71.99M 04.修改物理光照材质制作人物被打效果03.mp4 107.54M 18 效果合成与后期处理 01.合成效果原理与设置(1).mp4 94.68M 01.合成效果原理与设置.mp4 94.68M 02.抗锯齿_点效果_发光_屏幕闪动等特效(1).mp4 126.89M 02.抗锯齿_点效果_发光_屏幕闪动等特效.mp4 126.89M 03.使用shaderPass实现自定义合成效果.mp4 90.32M 04.使用法向纹理合成特色渲染镜头.mp4 72.90M 05.运用时间打造水底波浪动态渲染效果.mp4 40.20M 19 HTML混合3D渲染 01.CSS2D渲染器基本使用.mp4 82.72M 02.添加多个元素标签跟随物体移动.mp4 31.28M 03.使用射线碰撞来检测标签显示隐藏.mp4 104.82M 20 曲线应用与轨迹运动 01.曲线使用与绘制流程.mp4 49.79M 02.让物体与相机沿着曲线轨迹运动.mp4 36.13M 21 智慧城市项目准备与模型生成 01.智慧城市和项目介绍.mp4 266.82M 02.创建智慧城市项目并配置glsl写法支持.mp4 103.31M 22 智慧城市各类型特效 01.多层着色器特效合并与城市光圈扩散效果01.mp4 159.55M 02.直线光带掠过城市效果01.mp4 74.45M 03.从下向上扫描城市特效.mp4 30.58M 04.利用tube特性生成带纹理图案飞线.mp4 109.15M 05.飞线方案2-着色器绘制酷炫飞线.mp4 137.62M 06.函数翻折实现彗星型飞线动画.mp4 68.35M 07.生成建筑线框特效.mp4 78.58M 08.智慧城市光墙特效.mp4 136.18M 09.智慧城市雷达扫描特效.mp4 134.88M 10.封装3D警告标识与点击提示事件.mp4 124.48M 23 智慧城市大屏互动 01.添加智慧城市天空盒子和设置抗锯齿效果.mp4 49.67M 02.智慧城市大屏样式与结构.mp4 115.03M 03.设置Pointer-events穿透事件.mp4 27.97M 04.智慧城市动态数字面板动画.mp4 166.90M 05.通过接口生成城市事件列表.mp4 160.71M 06.城市事件列表动态生成雷达-飞线-光墙.mp4 504.54M 07.大屏HTML元素与场景物体数据交互与特效展现.mp4 333.84M 24 blender基础 01.blender下载与语言渲染设置.mp4 18.70M 02.blender大纲选项开关与保存启动文件.mp4 42.73M 03.界面布局与工具栏侧边栏.mp4 38.73M 04.3d界面查看与相机视图.mp4 41.42M 05.相机视图和透视与正交.mp4 37.57M 06.局部视图与隐藏物体.mp4 36.74M 07.添加与删除物体和添加物体的操作面板.mp4 31.84M 08.ExtraObject插件添加额外石头物体.mp4 13.88M 25 blender操作教学 01.物体选择.mp4 29.02M 02.物体移动旋转缩放设置.mp4 61.03M 03.变换坐标系与变换轴心.mp4 58.83M 04.吸附功能使用.mp4 35.07M 05.模式切换与物体吸附.mp4 38.32M 06.物体合并与分离.mp4 32.87M 07.设置物体的父级和子级.mp4 26.03M 08.叠加层与快速收藏夹.mp4 25.69M 09.各种视图着色预览使用.mp4 59.07M 10.平滑与平直着色.mp4 29.21M 26 blender建模 01.点线面基本操作.mp4 58.63M 02.删除点线面基本操作.mp4 42.64M 03.法向与法向翻转.mp4 36.62M 04.挤出功能使用.mp4 71.56M 05.倒角.mp4 44.32M 06.环切与切割.mp4 63.61M 07.多边形与旋转.mp4 37.30M 08.光滑和随机以及滑移.mp4 36.63M 09.推拉_球形化_隔离顶点.mp4 37.77M 27 blender修改器使用 01.阵列修改器.mp4 50.27M 02.倒角修改器(1).mp4 48.33M 02.倒角修改器.mp4 48.33M 03.布尔修改器.mp4 27.24M 04.镜像修改器(1).mp4 29.18M 04.镜像修改器.mp4 29.18M 05.实体化修改器.mp4 19.89M 06.表面细分修改器.mp4 20.34M 07.字体添加.mp4 51.62M 28 材质与原理化BSDF 01.原理化BSDF.mp4 55.54M 02.原理化BSDF各种属性使用.mp4 97.18M 29 智慧园建模 01.使用纹理贴图创建大厦.mp4 77.88M 02.物体设置2种材质打造大厦屋顶.mp4 78.10M 03.使用image插件快速搭建房子.mp4 201.03M 04.通过现实照片打造摩天大楼.mp4 187.65M 05.使用建筑生成插件快速生成建筑.mp4 63.84M 06.创建树.mp4 56.50M 07.制作照亮路面的路灯.mp4 127.97M 08.根据地图打造马路.mp4 87.12M 09.根据地图创建多边形建筑.mp4 46.65M 30 打造智慧园区 01.资产库打造智慧园区.mp4 66.54M 02.沃罗诺伊纹理种出随机草地.mp4 50.55M 03.烘焙计算好光照阴影的纹理.mp4 113.26M 04.模型优化与材质优化.mp4 133.92M 05.如何优化导出模型.mp4 57.44M 06.draco解压模型与场景摄像基础设置.mp4 141.00M 07.优化模型渲染逼近真实物理展示效果.mp4 88.12M 31 智慧园区动画与多种游览模式 01.园区热气球动画.mp4 192.14M 02.设置单一物体热气球多种动画.mp4 99.82M 03.设置大屏控制物体运动模式.mp4 146.63M 04.设置园区汽车运行轨迹与动画.mp4 307.63M 05.园区多相机视角切换.mp4 319.20M 06.观览模式之轨道观览-飞行模式-第一人称模式.mp4 266.11M 32 骨骼动画 01.创建骨骼与顶点组.mp4 115.90M 02.骨骼动画制作.mp4 110.54M 03.人物的骨骼动画.mp4 173.29M 04.如何切换控制器聚焦位置与拉近视角.mp4 48.65M 33 变形动画 01.变形动画原理与实现.mp4 192.41M 02.实现花苗生长到花开效果.mp4 368.55M 34 打造智慧工厂 01.根据户型图搭建户型结构墙体.mp4 179.26M 02.平面上创建发光灯带.mp4 125.75M 03.厂房楼层材质光效优化与模型加载.mp4 263.52M 04.楼层结构与房间用3D科幻悬浮框标注.mp4 331.73M 05根据需要微调科幻标注的位置.mp4 39.38M 06.大屏控制各楼层展开显示.mp4 577.86M 07.战斗机产品打散变形与组装恢复动画特效.mp4 490.86M 08.将产品物体变成粒子特效.mp4 97.73M 09.递归复原复杂模型生成战斗机粒子特效.mp4 234.12M 10.产品爆炸破碎特效与产品爆炸恢复效果.mp4 285.06M 35 物体发光效果 01.根据需要设置单个物体轮廓发光.mp4 238.20M 02.分层设置物体发光特效.mp4 135.65M 36 地理数据生成3D物体与地图 01.GEOJSON与地图下载.mp4 62.47M 02.通过GEO数据生成3D地图[52it.cc 海量资源].mp4 193.44M 03.与3D地图进行交互.mp4 85.61M 04.通过GEO生成3D线.mp4 59.44M 37 附赠扩展:cesium入门 01.打造第一个cesium应用.mp4 130.86M 02.Cesium基础设置.mp4 123.49M 03.详讲viewer查看器.mp4 102.83M 04.cesium天空盒.mp4 31.75M 05.Cesium自定义地图与地图叠加.mp4 96.54M 06.添加地形与添加自定义地形.mp4 173.96M 38 附赠扩展:cesium场景与物体 01.坐标系与坐标系数值转换.mp4 98.95M 02.相机的方向和位置.mp4 140.53M 03.相机动画与相机动态交互.mp4 189.12M 04.添加物体与3D建筑物.mp4 140.62M 05.标签与广告牌.mp4 100.43M 06.3D模型添加与设置.mp4 139.96M 07.椭圆_走廊_圆柱体添加与设置.mp4 91.65M 08.多边形_体积拆线_矩形_椭球体设置.mp4 109.13M 39 附赠扩展:cesium精通物体材质与外观 01.Primitive创建图像物体.mp4 123.30M 02.Primitive多个实体与颜色修改.mp4 95.59M 03.entity和Primitive物体交互.mp4 128.53M 04.entity材质.mp4 107.88M 05.entity拆线材质设置.mp4 186.30M 06.Appearance外观与材质.mp4 100.75M 07.primitive材质类型与设置.mp4 171.07M 40 附赠扩展:cesium高级技巧-着色器编写材质与外观 01.fabric自定义着色器设置材质.mp4 74.22M 02.cesium着色器自带函数与变量.mp4 111.46M 03.Appearance编写着色器修改外观.mp4 83.74M 04.编写自定义MaterialProperty材质.mp4 146.67M 41 附赠扩展:cesium应用各类型地理数据 01.加载渲染GEOJSON数据.mp4 75.76M 02.自定义GEOJSON生成物体的样式.mp4 133.03M 03.kml数据生成全球科学研究所地理标记.mp4 222.20M 04.初识CZML数据与应用(1).mp4 38.94M 04.初识CZML数据与应用.mp4 38.94M 05.CZML时间动态图形场景.mp4 68.69M 06.追踪航班跨洋飞行.mp4 339.94M 07.3DTiles与性能监控.mp4 293.56M 08.根据不同条件设置3D_tiles样式.mp4 128.95M 09.3D_tiles高级样式设置与条件渲染.mp4 201.96M 课程资料.zip 7.77G
课程购买
课程价格
金币29.9
299金币限时优惠会员免费
销量:0
💎 开通会员每日免费下载,比单买更划算 →
支付成功后会自动显示下载资源云盘的链接!点击链接即可下载到本地。