2017-05-01 19 views
5

प्रस्तुत नहीं करता है डैशबोर्ड को 10 तत्वों के साथ डेटा सरणी chdata संपत्ति के रूप में प्राप्त करती है। नए आइटम के साथ प्रत्येक 0.5s सरणी अद्यतन। मैं देख सकता हूं, डेटासेट में डेटा बदल रहा है, लेकिन चार्ट नहीं दिख रहा है।वू चार्ट.जेएस घटक

होवर होने पर यह त्रुटि Uncaught TypeError: Cannot read property 'skip' of undefined भी प्राप्त हो रही है।

//LineChart.vue 
<script> 
import { 
    Line, 
    mixins 
} from 'vue-chartjs' 
export default Line.extend({ 
    mixins: [mixins.reactiveData], 
    props: ["options"], 
    data() { 
     return { 
      chartData: { 
       labels: ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'], 
       datasets: [{ 
        label: 'Data One', 
        borderColor: '#e67e22', 
        pointBackgroundColor: '#e67e22', 
        borderWidth: 1, 
        pointBorderColor: '#e67e22', 
        backgroundColor: 'transparent', 
        data: this.$root.$data.chdata 
       }] 
      }, 

     } 
    }, 


    mounted() { 
      this.renderChart(this.chartData, { 
      responsive: true, 
      maintainAspectRatio: false, 
      animation: false, 
      //Boolean - If we want to override with a hard coded scale 
      scaleOverride: true, 
      //** Required if scaleOverride is true ** 
      //Number - The number of steps in a hard coded scale 
      scaleSteps: 20, 
      //Number - The value jump in the hard coded scale 
      scaleStepWidth: 10, 
      //Number - The scale starting value 
      scaleStartValue: 0 
     }); 
    }, 
    watch: { 
     chartData: function() { 
      this._chart.destroy() 
      this.renderChart(this.data, this.options) 
      // this._chart.update() 
     } 
    } 


}); 
</script> 

मैं mounted() में इस बनाया:

var self = this; 
     self.set = setInterval(function() { 
      self._chart.update() 
     }, 200); 

और मैं इसके साथ खुश नहीं हूँ।

+0

"अगर (this.data) {" क्या है? और आप chdata कैसे अपडेट कर रहे हैं? मेरा उत्तर यहां देखें: https://stackoverflow.com/questions/43728332/vue-chart-js-chart-is-not-updating-when-data-is-changing/43728989#43728989 यह देखने के लिए कि –

+0

मदद करता है, नहीं, नहीं काम नहीं करता – stsdc

उत्तर

1

समस्या यह है कि आप लेबल अपडेट नहीं कर रहे हैं। आप अपने लेबल सरणी में 10 आइटम परिभाषित करते हैं। यह 10 डेटा प्रविष्टियों के लिए काम करता है।

यदि आप अपने डेटा सरणी में एक नई प्रविष्टि दबाते हैं, तो आपको एक नया लेबल भी जोड़ना होगा। अन्यथा chart.js इस त्रुटि को फेंक देगा।

संबंधित मुद्दे