Tag Chart

把 Chart.js 的創建方法寫成 Composable

vue3-chartjs-composable
最近有點迷上 VUE3 的 composble 寫法,把可以重複利用的程式邏輯抽來變成composbal,要用的時候再匯入使用。今天我試著把 Chart.js 的創建方法抽出來放在 composables 中,沒想到竟然可行,以下整理一下我的作法。

chart.js 在X軸每個區間的長條圖上畫折線圖

js-chartjs5.jpg
經手的幾個專案,echarts 套件改成 Chart.js 的工作在終於告一段落,今天解決的最後一個問題是,在 X 軸的每個區間有三個長條圖,同時在長條圖上要要一個點來跑線圖,結果如下圖。簡單筆記一下作法,順便複習一下今天做的過程。

Vue3 + Vue-Chart.js

Vue3-Vue-Chartjs-bar
上一篇文章有提到公司舊專案使用eChart 做圖表,被掃出有資安風險,現在要改用 Chart.js,我原本沒有要搭配其他把Chart.js 做成元件的套件,但後來因為某些原因還是使用了 Vue-chart.js,在這邊紀錄一下我的作法與踩的坑。

Vue3 + Chart.js 基本使用

Vue3 + Chart.js 基本使用
去年參與的幾個專案有使用的 EChart 這個套件,結果被業主掃出有資安問題。綜合考量之下,決定改用 Chart.js 來取代 EChart。在這邊整理一下 Chart.js 在 Vue3 的使用方法 。