体系课-数据可视化⼊门到精通-打造前端差异化竞争⼒
体系课-数据可视化⼊门到精通-打造前端差异化竞争⼒：
课程⽬录
第1章 课程介绍【不看错过⼀个亿】4 节 | 8分钟
本章节整体介绍课程的制作背景、整理安排、以及主要内容。
1-1 学习本课程需要的知识点说明
1-2 课程介绍（导学） (05:27)
1-3 课程学习指南 (02:22)
1-4 【讨论题】谈谈对数据可视化的理解
第2章 数据可视化应⽤场景4 节 | 15分钟
本章节，介绍了什么是数据可视化，数据可视化的发展历史、以及在什么场景下需要⽤数据可视化、以及发展前景。
2-1 什么是数据可视化 (02:25)
2-2 数据可视化发展历史 (03:44)
2-3 数据可视化的应⽤场景 (03:58)
2-4 数据可视化的发展前景 (04:31)
第3章 数据可视化前端技术选型（上）【不知道什么是可视化？看这⾥就对了】10 节 | 91分钟
本章节，解决⼤家不知道如何选择技术的问题。⽼师带⼤家分析当下市⾯上的所有数据可视化技术，以及不同的技术擅长做什么效果，以及各个技术的⼊门讲解，⼤家系统的对数据可视化有全⾯的了解。
3-1 前端可视化解决⽅案 (04:07)
3-2 canvas ⼊门 (14:56)
3-3 svg ⼊门 (08:54)
3-4 webgl 技术分享 (03:03)
3-5 zrender ⼊门 (09:59)
3-6 d3 ⼊门 (09:16)
3-7 three.js 介绍 (02:23)
3-8 本章⼩结 (02:02)
3-9 canvas ⾼级应⽤：图⽚压缩算法实现（上） (20:31)
3-10 canvas ⾼级应⽤：图⽚压缩算法实现（下） (15:29)
第4章 数据可视化前端技术选型（下）【想⼊门antv和echarts的童鞋点进来】15 节 | 113分钟
详细介绍前端可视化开发中两⼤主流技术栈：AntV 和 ECharts，以及highcharts。
4-1 highcharts 介绍 (03:41)
4-2 antv-g2 ⼊门 (13:33)
4-3 antv-g6 ⼊门 (11:50)
4-4 antv-l7 ⼊门 (23:15)
4-5 echarts ⼊门 (08:34)
4-6 echarts ⾃定义主题和svg渲染 (08:40)
4-7 echarts 系列及多系列案例 (07:40)
4-8 echarts 新特性 dataset (05:09)
4-9 echarts 组件 (10:37)
4-10 echarts 定位 (02:31)
4-11 echarts 坐标系 (03:49)
4-12 echarts 双坐标系 (03:18)
4-13 echarts 多坐标系 (04:11)
4-14 三种技术栈对⽐ (04:40)
4-15 本章⼩结 (01:23)
第5章 数据报表项⽬初始化+核⼼指标组件开发【⼀⼤波⼲货来袭】16 节 | 93分钟
夯实基础知识后，我们将开启数据报表项⽬，本章将带⼤家完成项⽬初始化，并集成element-ui和echarts库，知识点很多，赶紧拿起⼩本本学起来。
5-1 本章概述
5-2 数据报表项⽬简介 (04:18)
5-3 关于技术选型的说明 (01:27)
5-4 项⽬初始化 (05:52)
5-5 element-ui和echarts引⼊ (05:20)
5-6 容器组件初始化 (03:47)
5-7 顶部核⼼指标组件布局开发 (05:27)
5-8 扩展知识：前端组件化设计原则
5-9 核⼼指标公共组件抽取 (14:35)
5-10 累计销售额组件开发 (09:14)
5-11 累计订单量组件开发 (14:17)
5-12 今⽇交易⽤户数组件开发 (07:00)
5-13 累计⽤户数组件开发（上） (08:59)
5-14 累计⽤户数组件开发（下） (12:32)
5-15 【学习任务】数据报表顶部组件开发
5-16 【讨论题】如何抽象业务组件svg和canvas的区别
第6章 核⼼指标组件重构+销售趋势组件开发【vue+echarts正确打开姿势】14 节 | 119分钟
本章我们重点使⽤vue-echarts组件重构代码中应⽤echarts部分代码，利⽤vue-echarts简化echarts开发。
6-1 本章概述
6-2 vue-echarts组件库⼊门 (08:51)
6-3 v-charts组件库⼊门 (08:28)
6-4 扩展知识：vue-echarts⼊门
6-5 vue-charts 重构核⼼指标组件 (04:44)
6-6 扩展知识：v-charts⼊门
6-7 销售趋势组件容器+头部开发（上） (15:06)
6-8 销售趋势组件容器+头部开发（下） (14:17)
6-9 销售趋势图表和列表开发 (20:00)
6-10 搜索关键词组件开发（上） (11:48)
6-11 搜索关键词组件开发（下） (10:43)
6-12 分类销售排⾏组件开发 (24:54)
6-13 【学习任务】完成销售趋势组件开发
6-14 【讨论题】谈谈对 vue-echarts 和 v-chart
第7章 百度地图数据可视化【硬核的百度地图可视化，解决各种疑难杂症】14 节 | 201分钟
很多同学期待已久的地图可视化深度教学，让我们从百度地图开始，深度学习地图可视化开发，知识量巨⼤，你准备好了吗？
7-1 百度地图⼊门案例+异步加载 (15:53)
7-2 百度地图3D建筑+3D地球 (10:33)
7-3 百度地图控件 (14:29)
7-4 百度地图⾃定义样式 (04:51)
7-5 百度地图绘图（上） (10:15)
7-6 百度地图绘图（下） (13:01)
7-7 百度地图ViewAnimation动画 (16:32)
7-8 百度地图TrackAnimation动画 (09:36)
7-9 百度地图可视化之散点图（上） (16:50)
7-10 百度地图可视化之散点图（下） (19:04)
7-11 百度地图可视化之飞线动画 (18:06)
7-12 百度地图可视化之炫酷飞线动画（上） (15:37)
7-13 百度地图可视化之炫酷飞线动画（下） (14:50)
7-14 百度地图可视化之3D建筑 (20:24)
第8章 数据⼤盘+vue-element-admin集成+部署【商业级可视化项⽬】18 节 | 206分钟
有地图可视化知识加持，现在可以愉快地完成数据报表项⽬了，再接上真实API，妥妥的商业级项⽬。
8-1 （上）销售⼤盘地图组件开发 (11:34)
8-2 （下） 销售⼤盘地图组件开发 (14:23)
8-3 v-charts移植销售⼤盘地图组件 (14:09)
8-4 销售⼤盘组件集成 (08:25)
8-5 ⽔球图的基本⽤法 (19:01)
8-6 ⽀付转化率组件开发 (16:08)
8-7 词云图的基本⽤法 (13:28)
8-8 http请求公共⽅法封装 (07:45)
8-9 【重要章节】防盗版接⼝接⼊ (06:52)
8-10 provide+inject实现组件通信 (12:17)
8-11 累计销售额组件数据接⼊ (08:17)
8-12 千分位算法实现 (10:23)
8-13 顶部核⼼指标组件数据接⼊ (13:21)
8-14 销售额组件API对接 (07:10)
8-15 搜索量组件API对接 (20:04)
8-16 品类分布组件API对接 (13:57)
8-17 销售⼤盘+⽤户增长+热门搜索API对接 (08:01)
8-18 扩展知识：axios快速⼊门
第9章 vue-element-admin接⼊+上线部署【95%的前端⼯程师都不知道】8 节 | 87分钟
还不知道怎么把数据报表接⼊真实项⽬？还不会把开发好的项⽬发布上线？让Sam⽼师给你答案！
9-1 vue-element-admin项⽬下载和运⾏ (10:17)
9-2 登录API接⼊（上） (23:29)
9-3 登录API接⼊（下） (02:56)
9-4 数据报表页⾯移植 (19:49)
9-5 数据报表样式优化 (07:26)
9-6 退出登录功能实现 (02:55)
9-7 项⽬构建与发布 (12:50)
9-8 https证书+cdn配置实战 (07:09)
第10章 外卖业务数据⼤屏项⽬需求分析+项⽬框架搭建【是时候⼊门⼀波vue3.0了】8 节 | 59分钟
如何开发数据⼤屏？Vue3.0还不会？让BAT⽼司机给你答案。
10-1 数据⼤屏项⽬技术⽅案分析 (04:47)
10-2 vue3项⽬初始化 (11:24)
10-3 vue3基本开发体验 (04:32)
10-4 vue3新特性composition-api（上） (10:42)
10-5 vue3新特性composition-api（下） (11:16)
10-6 vue3+vue-router使⽤⽅法 (04:41)
10-7 vue3+vuex使⽤⽅法 (09:33)
10-8 本章⼩结 (01:31)
第11章 数据⼤屏组件库搭建【⼤招！全⽹最稀缺的vue3.0组件库教学，知识量爆炸】11 节 | 114分钟秀操作的时候到了，全⽹稀缺的vue3.0组件库教学，赶紧上车吧
11-1 组件库项⽬创建+开发模式配置 (11:46)
11-2 rollup 切换模块化标准+多模块构建 (05:51)
11-3 rollup node-resolve插件+babel-node⽤法讲解 (15:28)
11-4 tree-shaking 机制讲解 (06:51)
11-5 rollup external属性+commonjs插件讲解 (08:38)
11-6 rollup babel+json+terser插件 (08:47)
11-7 【放⼤招了】rollup vue 组件编译 (12:34)
11-8 【关键步骤】在 html 中使⽤⾃定义 vue 组件 (08:54)
11-9 npm link关联组件库+eslint初始化 (15:11)
11-10 【重磅】组件库按需加载实战 (09:27)
11-11 【重要】vue2组件库兼容⽅案 (10:10)
第12章 项⽬⽮量图组件开发必备的svg知识⼊门【svg半⼩时全⽅位⼊门】8 节 | 78分钟
详细讲解svg怎么玩，还不会svg的⼩伙伴有福了！
12-1 svg 应⽤场景和优势 (04:59)
12-2 svg viewport 和 viewBox ⽤法讲解 (15:24)
12-3 深度剖析 svg preserveAspectRatio 属性（上） (09:27)
12-4 深度剖析 svg preserveAspectRatio 属性（下） (08:30)
12-5 svg 组件库最佳实践 (13:08)
12-6 通⽤ svg 组件封装 (06:29)
12-7 如何快速集成 iconfont svg 图标 (04:52)
12-8 iconfont 最佳实践 (14:55)
第13章 深⼊svg动画开发【⼜⼀波⾼端操作，95%前端⼯程师都不会的svg动画】7 节 | 80分钟带给⼤家最全⾯的svg动画实战教程。
13-1 svg transform属性解析 (08:12)
13-2 svg matrix 变换原理讲解 (06:10)
13-3 svg + CSS 动画实战：环形进度条 (20:57)
13-4 svg + CSS 动画实战：LOGO描边动画 (14:03)
13-5 svg SMIL 动画 + set 标签讲解 (07:32)
13-6 svg SMIL animate 动画 (09:31)
13-7 svg 动画核⼼：轨迹动画 (13:24)
第14章 通⽤数据⼤屏⽮量图svg组件开发【活学活⽤前⾯学到的各种⾼端知识】9 节 | 75分钟学了⼀堆svg基础知识，怎么⽤到项⽬⾥？马上安排！
14-1 loading 组件样式开发 (07:36)
14-2 loading 组件动画开发 (05:53)
14-3 loading 组件扩展能⼒开发 (11:07)
14-4 flyBox 组件样式开发 (04:48)
14-5 svg mask 蒙版⽤法讲解 (09:00)
14-6 linearGradient 和 radialGradient ⽤法讲解 (11:42)
14-7 flyBox 组件⾃适应布局开发 (10:20)
14-8 flyBox 组件扩展能⼒开发 (05:08)
14-9 flyBox 组件 uuid 改造 + 实现过程回顾 (08:27)
第15章 数据⼤屏容器组件开发【数据⼤屏到底怎么开发？先从这⾥开始！】7 节 | 60分钟
突破Chrome 12px显⽰极限，让数据⼤屏更加丰满，⼜⼀波知识盛宴。
15-1 固定宽⾼⽐及突破chrome 12px原理讲解 (09:05)
15-2 容器初始化功能开发 (11:35)
15-3 【关键步骤】固定宽⾼⽐算法开发 (11:00)
15-4 浏览器缩放时锁定屏幕宽⾼⽐功能开发 (04:07)
15-5 【实⽤】onResize ⽅法防重发机制开发 (06:35)
15-6 【⾼能】组件库 async function 特性⽀持 (04:54)
15-7 MutationObserver 监听样式变更 (12:05)
第16章 数据⼤屏业务组件开发【真正将Vue3.0⽤于商业级项⽬】16 节 | 160分钟
⼀⼤波业务组件开发，⼯作量不⼩，咱们⼀个个来。
16-1 数据⼤屏业务组件开发说明 (01:50)
16-2 数据⼤屏loading逻辑开发 (06:09)
16-3 数据⼤屏整体布局开发 (13:52)
16-4 数据⼤屏标题组件开发 (08:26)
16-5 ⽤户统计组件开发-通过hooks封装业务逻辑 (11:15)
16-6 【⾼能】VueCountTo组件兼容Vue3开发 (09:07)
16-7 VueCountTo组件项⽬实战 (09:17)
16-8 进度条组件开发 (05:07)
16-9 年龄分布组件开发 (07:59)
16-10 Vue3+ECharts开发 (12:47)
16-11 年龄分布图表组件开发 (16:09)
16-12 设备统计组件开发 (10:35)
16-13 南丁格尔图开发 (13:02)
16-14 性别统计组件开发 (06:38)
16-15 骑⼿统计组件开发 (13:51)
16-16 热卖品类组件开发 (13:26)
第17章 数据⼤屏⾃动轮播列表组件开发【难度⾮常⾼的⼀个基础组件，各种骚操作】16 节 | 204分钟来个难度有点⾼的轮播组件，还没思路？没事，看⽼司机怎么破题。
17-1 顶部核⼼指标组件开发（Iconfont加⼊实战） (10:16)
17-2 可变换的分类组件开发（vue3⿏标事件实战） (16:27)
17-3 补充知识：js⿏标事件onmouseenter和onmouseover的区别 (07:43)
17-4 基础滑动列表组件技术⽅案分析 (07:19)
17-5 基础滑动列表标题样式开发 (13:40)
17-6 标题数据处理（深拷贝+lodash按需加载） (17:03)
17-7 组件props重构（lodash对象合并算法） (14:58)
17-8 标题动态列宽算法开发 (09:12)
17-9 ⾏数据渲染开发 (13:38)
17-10 ⾏数据⾼度动态计算 (06:54)
17-11 ⾏动态样式开发 (15:17)
17-12 滑动动画开发（上）（同步sleep写法） (14:45)
17-13 滑动动画开发（中） (12:46)
17-14 滑动动画开发（下） (04:45)
17-15 将基础滑动列表应⽤到数据⼤屏 (15:36)
17-16 销售⼤盘参数配置 (22:51)
第18章 复杂图表——echarts混合图表+动画渲染技术实战【嫌图表简单的同学点进来！】5 节 | 94分钟嫌课程的echarts图表难度不够？安排⼏个⾼难度的图表。
18-1 深⼊echarts timeline组件 (17:27)
18-2 echarts timeline 实战案例 (21:46)
18-3 echarts 实现⾃定义地图渲染（解决组件库external失效问题） (12:16)
18-4 echarts ⾃定义地图配置详解（VisualMap实战） (22:17)
18-5 ⾃定义地图预警信号实战（EffectScatter应⽤） (20:08)
第19章 echarts-gl技术讲解7 节 | 107分钟
终于到了echarts-gl，看看如何⽤echarts做3d绘图。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。