iT邦幫忙

資料視覺化相關文章
共有 54 則文章

技術 全方位對比:SmartQuery VS FineReport来自報表工程師的經驗

写在前面 相比起BI這些當紅炸子雞概念,報表工具大家可能不太熟悉,希望這篇文章能夠給大家提供一些新的看法和參考。 我資歷不算深,但工作中經常用到報表開發工具,所...

鐵人賽 Modern Web DAY 30

技術 資視就是力量 - Highcharts / 尾聲

終於,花了一個月的時間,我們從零開始認識 Highcharts 到現在已經能夠配合 Vue.js 一同運用,希望這次的系列文章能幫助到各位,如果內容與實際使用上...

鐵人賽 Modern Web DAY 29

技術 資視就是力量 - Highcharts / Vue 做個記帳本 (下)

昨天已經將記帳本打造出一個基本雛形了,但似乎功能並不是很多,純粹就只是看到消費的金額和走向而已,所以我們今天來利用圖表的「事件屬性」搭配 Vue 的 emit...

鐵人賽 Modern Web DAY 28

技術 資視就是力量 - Highcharts / Vue 做個記帳本 (上)

既然已經掌握了 Highcharts-Vue 的基本使用技巧,那今明兩天打算帶大家來實作一個「記帳本」,用一個比較完整的應用來完結這個系列,也算是一個學習成果的...

鐵人賽 Modern Web DAY 27

技術 資視就是力量 - Highcharts / Vue 資料綁定

昨天我們成功安裝 Highcharts-Vue 並繪製出一個基本的圖表,不過既然都已經使用 Vue 了,我們應該要好好運用「資料綁定」的概念,也就是當資料變動時...

鐵人賽 Modern Web DAY 26

技術 資視就是力量 - Highcharts / Vue 建立圖表

經過連續五天的實作練習,相信大家應該對於製作 Highcharts 圖表暸若指掌了,不過現在使用前端框架已是網頁開發的主流,Highcharts 是否有因應的方...

鐵人賽 Modern Web DAY 25

技術 資視就是力量 - Highcharts / 金字塔圖表

本章節範例:https://codepen.io/max-lee/pen/wvGVGyR 相信大家在學生時期都有在課本中看過人口金字塔,而今天我們就是要用臺...

鐵人賽 Modern Web DAY 24

技術 資視就是力量 - Highcharts / 雙Y軸複合圖表

本章節範例:https://codepen.io/max-lee/pen/mdPZaRr 複合圖表和複數座標軸在前面的章節其實都有介紹過,不過今天我們要結合...

鐵人賽 Modern Web DAY 23

技術 資視就是力量 - Highcharts / 下鑽圖表

本章節範例:https://codepen.io/max-lee/pen/oNxrMRr 今天要來實作的是「下鑽圖表」,原文是 DrillDown Char...

鐵人賽 Modern Web DAY 22

技術 資視就是力量 - Highcharts / 雙層圓餅圖

本章節範例:https://codepen.io/max-lee/pen/vYGqGJj 今天要延續昨天「公司部門年齡分佈與人數佔比」的主題,把昨天需要點擊...

鐵人賽 Modern Web DAY 21

技術 資視就是力量 - Highcharts / 圖表連動

本章節範例:https://codepen.io/max-lee/pen/JjXqYyz 經過前面各種設定屬性與 Method 的轟炸後,我們先來個簡單的小...

鐵人賽 Modern Web DAY 20

技術 資視就是力量 - Highcharts / 其他實用 Method

Highcharts 的方法(Method)當然不止昨天介紹的「資料更新」這種類型,還有很多方便好用的 Method,而且有了它們,我們就可以在頁面的其他程式邏...

鐵人賽 Modern Web DAY 19

技術 資視就是力量 - Highcharts / 資料更新 Method

本章節範例:https://codepen.io/max-lee/pen/qBZvgGv 在 Highcharts 中呢,除了五花八門的設定屬性之外,還有不...

鐵人賽 Modern Web DAY 18

技術 資視就是力量 - Highcharts / 事件屬性

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

鐵人賽 Modern Web DAY 17

技術 資視就是力量 - Highcharts / 響應式設定

本章節範例:https://codepen.io/max-lee/pen/NWNeevP 近年來響應式網站已成為主流,尤其當網站需要支援行動裝置的使用時,R...

鐵人賽 Modern Web DAY 16

技術 資視就是力量 - Highcharts / 主題設定

本章節範例:https://codepen.io/max-lee/pen/Vwaqvab 昨天在介紹到「語言設定」時有提到 Highcharts.setOp...

鐵人賽 Modern Web DAY 15

技術 資視就是力量 - Highcharts / 日期座標軸&語言設定

本章節範例:https://codepen.io/max-lee/pen/GRZwKjW 今天要又要來填坑了,在座標軸設定時有說會特別介紹「日期座標軸」,因...

鐵人賽 Modern Web DAY 13

技術 資視就是力量 - Highcharts / 顏色屬性

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

鐵人賽 Modern Web DAY 12

技術 資視就是力量 - Highcharts / 繪圖區設定

本章節範例:https://codepen.io/max-lee/pen/ExKRLGP 如果前面幾個圖表元素的設定介紹你都有跟到的話,你可以想想看繪圖區設...

鐵人賽 Elastic Stack on Cloud DAY 10
ELKibana 系列 第 10

技術 Day[-20] 如何開始你的Kibana Visualize - 了解你的資料型態

hi 各位 原本今天是要說明選擇適合的圖表或文字呈現你的圖表 不料昨天發完之後有人詢問了我一些問題 問題大概是想問說 昨天提到的流量平均要達到100人 這兩途的...

鐵人賽 Modern Web DAY 11

技術 資視就是力量 - Highcharts / 數據點設定

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

鐵人賽 Elastic Stack on Cloud DAY 9
ELKibana 系列 第 9

技術 Day[-21] 如何開始你的Kibana Visualize

之前介紹Kibana Visualize裡面的一些比較特別一些的視覺化方法 現在我們要回來講一些傳統選擇視覺化呈現方法的邏輯 有時候再看一些dashboard作...

鐵人賽 Modern Web DAY 10

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

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

鐵人賽 Modern Web DAY 9

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

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

鐵人賽 Modern Web DAY 8

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

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

鐵人賽 Modern Web DAY 7

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

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

鐵人賽 Modern Web DAY 6

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

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

鐵人賽 Modern Web DAY 5

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

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

鐵人賽 Modern Web DAY 4

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

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

鐵人賽 Modern Web DAY 3

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

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