iT邦幫忙

鐵人檔案

第 12 屆 iThome 鐵人賽
回列表
Modern Web

資視就是力量 - Highcharts 系列

從第四次工業革命(工業4.0)開始,大數據成為產業發展的顯學,各種產業不斷在收集與歸納龐大的使用者資料,運用在行銷策略、製造生產等領域。

不過數據在經過「機器」進行演算與整理後,最終要閱讀的仍然是「人類」,因此有效的資料視覺化能幫助用戶分析和推理。

也因為如此,現在越來越多網站運用所謂的「儀表板」來做數據監控、分析的應用,進而使得圖表繪製逐漸成為前端工程師的必備技能之一。

這次將從零開始介紹 Highcharts 這套圖表庫的基本功能與實作。

鐵人鍊成 | 共 30 篇文章 | 38 人訂閱 訂閱系列文 RSS系列文
DAY 1

資視就是力量 - Highcharts / 資料視覺化

「資視」指的是資料視覺化,請原諒我使用諧音雙關的爛梗 XD 從第四次工業革命(工業4.0)開始,大數據成為產業發展的顯學,各種產業不斷在收集與歸納龐大的使用...

2020-09-15 ‧ 由 MaxLeeBK 分享
DAY 2

資視就是力量 - Highcharts / 圖表的意義

資料視覺化是一門藝術也是一門科學,它藉由人類喜愛以視覺理解資訊的特性來增強我們資料處理的效率。 上一篇文章裡已經知道資料視覺化大大影響現在網頁開發的趨勢,而...

2020-09-16 ‧ 由 MaxLeeBK 分享
DAY 3

資視就是力量 - Highcharts / 圖表的組成

圖表的種類非常多,呈現方式各有不同,但幾乎都有幾個固定的元素內容,能夠使圖表的易讀性提昇。 昨天我們成功做出了一個 Highcharts 的圖表,今天要重新...

2020-09-17 ‧ 由 MaxLeeBK 分享
DAY 4

資視就是力量 - Highcharts / 圖表整體設定

本章節範例:https://codepen.io/max-lee/pen/BaKwdyN避免文章篇幅過長,沒辦法每個屬性都利用圖片示意,所以記得善用範例來測試...

2020-09-18 ‧ 由 MaxLeeBK 分享
DAY 5

資視就是力量 - Highcharts / 說明文字設定

本章節範例:https://codepen.io/max-lee/pen/BaKwdyN避免文章篇幅過長,沒辦法每個屬性都利用圖片示意,所以記得善用範例來測試...

2020-09-19 ‧ 由 MaxLeeBK 分享
DAY 6

資視就是力量 - Highcharts / 圖例設定

本章節範例:https://codepen.io/max-lee/pen/gOroOjd避免文章篇幅過長,沒辦法每個屬性都利用圖片示意,所以記得善用範例來測試...

2020-09-20 ‧ 由 MaxLeeBK 分享
DAY 7

資視就是力量 - Highcharts / 提示框設定

本章節範例:https://codepen.io/max-lee/pen/gOroOjd避免文章篇幅過長,沒辦法每個屬性都利用圖片示意,所以記得善用範例來測試...

2020-09-21 ‧ 由 MaxLeeBK 分享
DAY 8

資視就是力量 - Highcharts / 座標軸設定 - 外觀樣式

本章節範例:https://codepen.io/max-lee/pen/abNqLjX避免文章篇幅過長,沒辦法每個屬性都利用圖片示意,所以記得善用範例來測試...

2020-09-22 ‧ 由 MaxLeeBK 分享
DAY 9

資視就是力量 - Highcharts / 座標軸設定 - 座標刻度

本章節範例:https://codepen.io/max-lee/pen/KKzQmRZ避免文章篇幅過長,沒辦法每個屬性都利用圖片示意,所以記得善用範例來測試...

2020-09-23 ‧ 由 MaxLeeBK 分享
DAY 10

資視就是力量 - Highcharts / 數據列設定

本章節範例:https://codepen.io/max-lee/pen/mdPxGyq避免文章篇幅過長,沒辦法每個屬性都利用圖片示意,所以記得善用範例來測試...

2020-09-24 ‧ 由 MaxLeeBK 分享