Chart.js νλ¬κ·ΈμΈ κΈ°λ³Έ μ΅μ
μΌλ‘λ
λμ λ§λκ·Έλνμ total κ°μ λνλ΄μ§ μλλ€.
μ΄λ option μ tooltips λ‘ κ°λ¨νκ² κ΅¬ν κ°λ₯νλ€.
tooltips: {
mode: "label",
callbacks: {
footer: function (data) {
var total = 0;
for (var i = 0; i < data.length; i++) {
total += data[i].yLabel; // μΈλ‘λ§λλ yLabel , κ°λ‘λ§λλ xLabel
}
return "Total: " + total;
},
},
},
option λ€μ μ μν λ μ΄ μ½λλ§ μΆκ°νλ©΄ λλ€.
λ§λ κ°λ³ κ°κ³Ό μ΄ ν©μ νμΈ ν μ μλ€.
λ°μν
'Vue.js' μΉ΄ν κ³ λ¦¬μ λ€λ₯Έ κΈ
[Vue.js] Chart.js labels hover μ λ°μ΄ν°(tooltip) 보μ΄κΈ° (1) | 2022.11.04 |
---|---|
[Vue.js] Char.js λΌλ²¨ κ°(value) νμνκΈ° (1) | 2022.10.28 |
[Vue.js] Hot Reload λμ μν λ (0) | 2022.10.18 |
Vue.js(4) Router λ° Axios, async await κ°λ (1) | 2022.10.09 |
Vue.js(3) Vue μΈμ€ν΄μ€ μμ± λ° μ»΄ν¬λνΈ (0) | 2022.10.09 |
λκΈ