Data

  • {{value}}

Labels

  • {{value}}

Message

  • {{value}}

Data Binding

Key Code



    <body>
    <input v-on:keyup.enter="addData" placeholder="Add a Data" ...>
    <input v-on:keyup.enter="addLabel" placeholder="Add a Label" ...>
    <chartjs-line :labels="labels" :data="data" :bind="true"></chartjs-line>
    ...
    </body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.js"></script>
    <script src="js/vue-charts.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.min.js"></script>
    <script>
        Vue.use(VueCharts);
        const app = new Vue({
            el: '#app',
            data:{
                labels: ["January", "February", "March", "April", "May", "June", "July"],
                data:[65, 59, 80, 81, 56, 55, 40],
            },
        });
    </script>