Vue-chart Multiple Instance Initialization

I would like to have multiple vue-chart.js graphs, each one refreshing (adding a new data point) every 5s. Value comes from a sensor and it is passed with props (I am writing UI fo

Solution 1:

chartSetting object is the same for all component instances because it's defined once when component module is evaluated.

The reason data is factory function is that it returns a new data object for each instance that isn't shared between instances.

It should be:

data() {
    const chartSetting = ...

    return {
      myChart: null,
      chartSetting: chartSetting,
    };
  }