學最有用的
第一章 : 導論
1-1 數據可視化應用及學習技巧
數據可視化作用：
- 1.信息記錄（使用圖形化的數據記錄信息）
- 2.抽象 現實的一種抽象
- 3.展示隱含模式
- 4.傳播思想
為什么：
- 1.信息可視化
- 2.清晰直觀 視覺基因
第二章 : 數據可視化思想
2-1 可視化表達背景與趨勢
和第一節內容一樣
2-2 視覺感知與視覺通道
視覺編碼描述的是將數據映射到最終可視化結果上
第三章 : Tableau可視化分析與表達
3-1 tableau安裝及使用
tableau類似於exec表格化的操作
第四章 : Echarts可視化
百度開源的項目
4-1 前端基礎概述
前端框架
- 前端 = HTML + CSS + JavaScript（動畫效果）
HTML 指的是超文本標記語言 (Hyper Text Markup Language) 內容（文字語言） 標記語言
CSS 指層疊樣式表 (Cascading Style Sheets) 樣式（大小 樣子 格式） 標記語言
*JavaScript = DOM + BOM + ECMAScript
ECMAScript，描述了該語言的語法和基本對象，如類型、運算、流程控制、面向對象、異常等。（標准語言）
文檔對象模型（DOM），描述處理網頁內容的方法和接口。
瀏覽器對象模型（BOM），描述與瀏覽器進行交互的方法和接口。
Echarts
D3 可視化非常好、學習成本高（2D效果）
DECK.GL 3D效果 webGL
4-2 HTML+CSS
<!DOCTYPE html> 版本
<html lang="en"> 頁面語言是英文
<head>
<meta charset="UTF-8"> 頁面是按照utf-8 編碼 解碼
<title>標題</title>
</head>
<body>
<p>這是一個段落。</p>
</body>
</html>
HTML <meta> 元素
div 沒有任何含義，只是一個組織模塊。
css顏色樣式 層疊樣式表
<p style="backageground:**; color:***"> </p>
CSS三種方式：
* 內聯樣式 在html元素中使用style屬性
* 內部樣式表 在html文檔頭部<head>區域中使用<style>元素來包含css
* 外部引用 - 使用外部CSS文件 .css文件
<link> 標簽定義了文檔與外部資源之間的關系。
<link> 標簽通常用於鏈接到樣式表
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
自定義顏色
id 選擇器
id 選擇器可以為標有特定 id 的 HTML 元素指定特定的樣式。id 選擇器以 "#" 來定義。
#red {color:red;}
#green {color:green;}
<p id="red">這個段落是紅色。</p>
<p id="green">這個段落是綠色。</p>
4-3 JavaScript基礎語法(一)
. 是在同級目錄下尋找文件
<sccript src="./ecahrts"> </script>
console.log(parseInt("1")) 控制台輸出
for 循環是初始條件 先判斷、當判斷合理為ture時 才進行循環。
函數解決重復代碼的問，代碼重復使用。
javascript 操作DOM能力的非常方便有助於，有助於書寫爬蟲！
document.getElementById("id") 通過標簽拿到html元素，對他進行操作。
4-4 JavaScript基礎語法(二)
數組可以嵌套
object 類似有字典 key-value
- object["d"]
- object.d
a.push()
a.length
數組排序：
- 順序：
a.sort();
- 逆序：
a.sort(function (a,b){
return b-a;
})
使用jquery
引入jquery
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js"></script>
$ 是jquery的符號
<script>
$.get('./test.txt',function(data){
console.log(data);
})
</script>
./test.txt 同級調用
./src/test.txt 其他目錄
4-5 Echarts可視化應用簡介
4-6 Echarts零基礎上手一個demo
4-7 Echarts可視化——餅圖、環形圖
4-8 Echarts可視化——南丁格爾玫瑰圖
4-9 Echarts可視化——柱狀圖
4-10 Echarts可視化——散點圖
4-11 Echarts可視化——折線圖
4-12 Echarts可視化——日歷圖、樹狀圖
4-13 Echarts可視化——地圖
4-14 案例：旅行數據可視化
第五章 : Infographic信息圖表可視化
5-1 Adobe Illustrator安裝及概覽
軟件 類似與ps
第六章 : 數據可視化項目實戰
6-1 智能城市項目：整體結構可視化
使用Adobe Illustrator實現