search

victorgarciaesgi / vue-chart-3

📊 A simple wrapper around Chart.js 3 for Vue 2 & 3
https://vue-chart-3.netlify.app/
MIT License
309 stars 106 forks source link

LineChart X-axes data collapses to 0 on update of source data #121

Open nosvalds opened 2 years ago

nosvalds commented 2 years ago

Describe the bug

LineChart X-axes data collapses to 0 on update of data.

To Reproduce

codesandbox

  1. See chart render initially fine with 7 data points along X axis.
  2. Change the select to 3 days, see chart re-render but lose the X axis data.

Things Tried

Manual update as described here

onMounted(() => {
      lineRef.value.update();
});

Has no effect. Also tried onUpdated().

Version of vue-chart-3

v3.1.8

Version of Vue

nosvalds commented 2 years ago

FYI this looks to be related to the use of the parsing option. Removing that and suppling the X-axes value through labels resolves the issue: https://codesandbox.io/s/vue-3-line-chart-reactive-issue-no-parsing-fboke6

justRau commented 2 years ago

Can confirm this issue occurs on: vue@3.2.33 vue-chart-3@3.1.8 chart.js@3.7.1