# 圖表使用說明

本頁面除了基本的圖表解讀以外，也介紹進階的[圖表使用小技巧](#tu-biao-shi-yong-xiao-ji-qiao)，幫助使用者更好的使用First CDP

## 圖表解讀

### 資料標籤

在圖表上，都會有相關的資料標籤可以讓閱讀者快速理解數據的變化與比較

<figure><img src="https://2163981483-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQg9azWrbuuN85T76pzxm%2Fuploads%2FnD31WJ4FM5Eu57jFSuyU%2F%E4%BB%8B%E9%9D%A2%E6%93%8D%E4%BD%9C%E8%AA%AA%E6%98%8E-1.jpg?alt=media&#x26;token=02829bf8-6406-4019-81fa-56ec067839ed" alt=""><figcaption><p>左側為直條圖單位，右側為折線圖單位</p></figcaption></figure>

* 基本資料標籤：例如直條圖的縱軸、橫軸，兩單位的比較可以容易理解成長性等資訊；也可以合併圖表，顯示三種以上不同的單位，比較兩類別的相關性等資訊
* 圖表顏色：色彩也是讓我們更容易判讀圖表的關鍵，習慣上不同類型的資料會使用對比強烈的顏色，讓眼球容易抓到自己需要的資訊

<figure><img src="https://2163981483-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQg9azWrbuuN85T76pzxm%2Fuploads%2FAW7FOGPFfi14IOP7kkHD%2F%E4%BB%8B%E9%9D%A2%E6%93%8D%E4%BD%9C%E8%AA%AA%E6%98%8E-2.jpg?alt=media&#x26;token=13ac5594-742b-4165-973f-654355d48325" alt=""><figcaption><p>浮出視窗顯示圖表內的詳細資訊</p></figcaption></figure>

* 詳細資料標籤：在First CDP上，我們也可以透過移動滑鼠游標，在圖表上得到更詳細的資料標籤
* 浮出視窗解讀：除了顯示詳細資料外，也會用顏色去區別不同資料，讓閱讀者更能專注在浮出視窗上

### 圖表工具

為了方便檢視，First CDP在圖表上會放上圖表工具，可以幫助閱讀者彈性使用圖表

* 在統計圖的左上角會有**縮放工具**，可以進行放大、縮小與平移，最右邊的屋子則是重製回初始的樣子

<figure><img src="https://2163981483-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQg9azWrbuuN85T76pzxm%2Fuploads%2FrtvYWBZv8wTOFHfnNtOa%2F%E4%BB%8B%E9%9D%A2%E6%93%8D%E4%BD%9C%E8%AA%AA%E6%98%8E-3.jpg?alt=media&#x26;token=721ae8aa-915b-4fa8-96e9-5874e58e224d" alt=""><figcaption><p>透過縮放工具可以細部檢視圖表內容，專注於特定區間</p></figcaption></figure>

* 在表格的首欄位會有**排序工具**，可以透過排序圖表，更好的評估各項目的成效

<figure><img src="https://2163981483-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQg9azWrbuuN85T76pzxm%2Fuploads%2FGxesFONotjIFk4tKNUcx%2F%E4%BB%8B%E9%9D%A2%E6%93%8D%E4%BD%9C%E8%AA%AA%E6%98%8E-5.jpg?alt=media&#x26;token=34923193-462b-4068-aaf1-6a25abf51b77" alt=""><figcaption><p>點擊排序鈕，可以讓表格依照數值大小做呈現</p></figcaption></figure>

## 圖表使用小技巧

除了上述介紹的浮出視窗與圖表工具以外，First CDP也設計了一些實用的功能供使用者彈性使用

### 區間縮放

* 我們在統計圖中，游標預設為區間縮放功能，可以直接框出自己想要的區間
* 除了直條圖以外，也很適合用在泡泡圖、點分布圖

<figure><img src="https://2163981483-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQg9azWrbuuN85T76pzxm%2Fuploads%2F3M3BhITx32Dc9T9sHOIM%2F%E4%BB%8B%E9%9D%A2%E6%93%8D%E4%BD%9C%E8%AA%AA%E6%98%8E-GIF1.gif?alt=media&#x26;token=b499fa14-d992-4f14-82bc-ed9fb5b8db95" alt=""><figcaption><p>區間縮放示範</p></figcaption></figure>

### 自選標籤

* 我們在統計圖中，可以點擊下方類別標籤，便可呈現單一類別圖表，專注於檢視單一指標
* 除了適合直條折線合併圖，在多單位折線圖中也可以使用

<figure><img src="https://2163981483-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQg9azWrbuuN85T76pzxm%2Fuploads%2FYXcvqrxRyuKCScZoSZuB%2F%E4%BB%8B%E9%9D%A2%E6%93%8D%E4%BD%9C%E8%AA%AA%E6%98%8E-GIF23.gif?alt=media&#x26;token=9a5b4984-0a20-454f-8331-24beef5d6cfb" alt=""><figcaption><p>自選標籤示範</p></figcaption></figure>
