大数据可视化应用开发

　　万物互联背景下，数据呈现爆炸式增长。当前通过可视化的信息呈现方式提高数据效益、提高洞察力成为行业关注的焦点。本书以“新能源汽车大数据可视化监测平台”项目为载体，以丰富的可视化和交互式图表作为信息表现方式，旨在通过Web可视化设计方法以及主流前端框架、工具的综合运用，使学生快速提高Web前端开发技术水平，实现培养优秀的Web前端工程师目的。 本书共分7个单元。内容包括：Web数据可视化概述、新能源汽车大数据可视化监测平台、Web基础、前端框架、数据可视化设计基础、数据可视化整合、新能源汽车数据大屏。 本书涵盖多学科知识，综合性强；以实际项目为载体，化繁为简，循序渐进，弥补了学校教学缺乏实战的弊端，是Web可视化技术的优佳图书。 本书适合作为高职高专计算机专业、大数据相关专业课程的教学用书，也可供从事数据可视化、数据分析、前端设计的技术人员参考阅读。

　　苏州工业职业技术学院刘文军、胡霞；南京第五十五所技术开发有限公司宋学永

单元1　Web数据可视化概述.1
单元描述 1
任务分解 2
知识要点 2
1. 数据可视化 2
2. Web 数据可视化类型及方法 2
3. Web 数据可视化相关技术 3
任务1.1　认识Web 前端开发 4
任务1.2　认识Web 数据可视化应用案例. 5
单元小结 6
课后练习 6
单元2　新能源汽车大数据可视化监测平台7
单元描述 7
任务分解 8
知识要点 8
1. 新能源汽车基础 . 8
2. 车辆数据与存储 . 9
3. 前端框架数据驱动模式 . 10
任务2.1　理解新能源汽车远程监测业务. 11
任务2.2　理解业务数据 13
任务2.3　确定车辆数据模型 15
单元小结 16
课后练习 16
单元3　Web基础17
单元描述 17
任务分解 18
知识要点 18
1. 前端开发常用工具介绍. 18
2. HTML+CSS 基础 19
3. 网页中的JavaScript. 23
任务3.1　搭建开发环境 25
任务3.2　创建新能源汽车单车监控页面. 28
任务3.3　呈现车辆运行状态 38
单元小结 43
课后练习 43
单元4　前端框架45
单元描述 45
任务分解 47
知识要点 47
1. 前端框架简介. 47
2. Vue.js 安装. 49
3. webpack 构建项目 51
4. Vue.js 基础. 53
5. 常用插件 63
任务4.1　搭建Vue 开发环境. 66
任务4.2　新能源汽车大数据分析系统路由与组件设计 80
任务4.3　新能源汽车大数据分析系统用户管理页面实现. 94
任务4.4　新能源汽车大数据分析系统动态页面实现 108
单元小结 . 113
课后练习 . 113
单元5　数据可视化设计基础.114
单元描述. 114
任务分解. 115
知识要点. 115
1. 有效可视化创建步骤 .115
2. 常用可视化工具 . 122
3. ECharts 基础 . 123
4. D3 基础 . 128
任务5.1　认识数据可视化 130
任务5.2　使用ECharts 实现车辆数据可视化. 133
任务5.3　使用D3 完成车辆实时监控可视化 138
单元小结. 143
课后练习. 143
单元6 　数据可视化整合 144
单元描述. 145
任务分解. 145
知识要点. 146
1. Ajax 介绍 . 146
2. VUE 的生命周期 148
3. async 与await . 149
4. ECharts 实现Web 可视化图表绘制. 150
任务6.1　研发与维修统计分析页面设计与实现. 150
任务6.2　新增故障比例可视化展示. 154
任务6.3　车辆城市分布Top10 可视化展示 158
任务6.4　单车总电流监控可视化展示 163
任务6.5　单车蓄电池温度可视化展示 168
单元小结. 173
课后练习. 173
单元7　新能源汽车数据大屏175
单元描述 .175
任务分解 .176
知识要点 .176
1. 大屏设计的步骤 . 176
2. 大屏布局 177
3. 大屏设计技巧 . 178
任务7.1　建立数据分析维度.179
任务7.2　实现大屏布局.180
任务7.3　数据大屏实现.182
单元小结199
课后练习199
参考文献 .200