本書分7個單元。內容包括:Web數據可視化概述、新能源汽車大數據可視化監(jiān)測平臺、Web基礎、前端框架、數據可視化設計基礎、數據可視化整合、新能源汽車數據大屏。
2020年4月
單元1 Web數據可視化概述.........1
單元描述.. 1
任務分解.. 2
知識要點.. 2
1. 數據可視化 .... 2
2. Web 數據可視化類型及方法 ...... 2
3. Web 數據可視化相關技術 .......... 3
任務1.1 認識Web 前端開發(fā).............. 4
任務1.2 認識Web 數據可視化應用案例........... 5
單元小結.. 6
課后練習.. 6
單元2 新能源汽車大數據可視化監(jiān)測平臺..............7
單元描述.. 7
任務分解.. 8
知識要點.. 8
1. 新能源汽車基礎 ........... 8
2. 車輛數據與存儲 ........... 9
3. 前端框架數據驅動模式 ............. 10
任務2.1 理解新能源汽車遠程監(jiān)測業(yè)務........... 11
任務2.2 理解業(yè)務數據...... 13
任務2.3 確定車輛數據模型.............. 15
單元小結 16
課后練習 16
單元3 Web基礎............17
單元描述 17
任務分解 18
知識要點 18
1. 前端開發(fā)常用工具介紹............. 18
2. HTML+CSS 基礎........ 19
3. 網頁中的JavaScript... 23
任務3.1 搭建開發(fā)環(huán)境...... 25
任務3.2 創(chuàng)建新能源汽車單車監(jiān)控頁面........... 28
任務3.3 呈現車輛運行狀態(tài).............. 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 開發(fā)環(huán)境............. 66
任務4.2 新能源汽車大數據分析系統(tǒng)路由與組件設計.... 80
任務4.3 新能源汽車大數據分析系統(tǒng)用戶管理頁面實現. 94
任務4.4 新能源汽車大數據分析系統(tǒng)動態(tài)頁面實現...... 108
單元小結 ............. 113
課后練習 ............. 113
單元5 數據可視化設計基礎.....114
單元描述............. 114
任務分解............. 115
知識要點............. 115
1. 有效可視化創(chuàng)建步驟 .115
2. 常用可視化工具 ....... 122
3. ECharts 基礎 ............. 123
4. D3 基礎 ..... 128
任務5.1 認識數據可視化 130
任務5.2 使用ECharts 實現車輛數據可視化. 133
任務5.3 使用D3 完成車輛實時監(jiān)控可視化.. 138
單元小結............. 143
課后練習............. 143
單元6 數據可視化整合............ 144
單元描述............. 145
任務分解............. 145
知識要點............. 146
1. Ajax 介紹 ... 146
2. VUE 的生命周期 ...... 148
3. async 與await ........... 149
4. ECharts 實現Web 可視化圖表繪制....... 150
任務6.1 研發(fā)與維修統(tǒng)計分析頁面設計與實現............. 150
任務6.2 新增故障比例可視化展示. 154
任務6.3 車輛城市分布Top10 可視化展示.... 158
任務6.4 單車總電流監(jiān)控可視化展示............ 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