score:1
Accepted answer
Every time you update it, you're sort of like, creating a new chart over it. What you need to do is to destroy the chart before updating it.
myChart.destroy()
I updated your javascript code:
var chartList = [5,6];
var myChart;
function chart(){
var ctx = document.getElementById("myChart").getContext('2d');
if (myChart != undefined && typeof myChart == 'object' && typeof myChart.destroy == 'function') myChart.destroy()
myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["Red", "Blue"],
datasets: [{
label: '# of Votes',
data: chartList,
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
],
borderColor: [
'rgba(255,99,132,1)',
'rgba(54, 162, 235, 1)',
],
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}
chart();
function addData(){
var i = 4;
var o = 8;
chartList = [];
chartList.push(i);
chartList.push(o);
chart();
}
Source: stackoverflow.com
Related Query
- Handling data over lapping in chart.js
- Mouse over on line chart data active other data-set in Chart.js
- Angular-chartjs Data labels over bar chart
- Chart.js Mouse Over Show Old Chart Data
- Hovering over line chart shows old chart data issue in chart.js
- How do I destroy/update Chart Data in this chart.js code example?
- getting additional value fields from data source for dx.chartjs doughnut chart
- Charts with previous data appear when hovering the cursor over the chart in Chart.js
- Data label over stacked bar chart
- Is there a way to display legend's data over the chart in chart.js?
- Chartjs Bar Chart showing old data when hovering
- Chartjs random colors for each part of pie chart with data dynamically from database
- Moving vertical line when hovering over the chart using chart.js
- ChartJS - Draw chart with label by month, data by day
- line chart with {x, y} point data displays only 2 values
- Chart JS data labels getting cut
- chartjs show dot point on hover over line chart
- Detecting hover events over parts of a chart using Chart.js
- ChartJs line chart repaint glitch while hovering over
- chart js tooltip how to control the data that show
- Chart.js Timeseries chart - formatting and missing data values
- Chart JS show multiple data points for the same label
- Add all data in the tooltip of Chart JS
- How to display data labels outside in pie chart with lines in ionic
- ng2-charts customize data and whole html content of tooltip displayed when hovering on bar chart
- Show data dynamically in line chart - ChartJS
- Chartjs - data format for bar chart with multi-level x-axes
- ChartJS: Draw vertical line at data point on chart on mouseover
- Chart js data to start at zero
- Why can I not see a data value when hovering over a point on the radar chart?
More Query from same tag
- ChartJs doesn't display the line item legend
- How to get rid of the line on top of every point on a line chart (Chart.js)
- How to get the X position at a specified chart item index?
- How to set Custom tooltip event with Chartjs version 2.X
- React - How can I pass API data from one component to another in a different js file?
- Pie Chart Legend - Chart.js
- Hiding spaces with zero values in bar chart with chart.js
- data in charts of charts.js is changing when I click in the line chart
- How to remove numbering on PolarArea circles?
- How to draw multiple color bars in a bar chart along a Horizontal Line using chart.js
- How to change position from absolute to relative in charts in ChartJS
- Issue While Passing Dynamic Datas in React Chart Js 2
- Visual Studio 2013 IIS web site - problems with JS files
- how can we use function of one component into another js file
- Changing the background of a ChartJS on node js
- How to set vue3-chartjs fixed height?
- ChartJS - legends and tooltips options
- Avoid data resetting when toggling series
- ChartJS 2.7.0 updating and exporting as png
- Chart js data to start at zero
- Custom dataset object not setting chart.js bar chart colors in Angular 6
- Make 2 charts using chart js
- angular 5 chart.js Failed to create chart
- how can i grab a property from an array of JSON objects to use the values of that property as a labels in my chart?
- What happened to generateLegend() in chartjs 3.0?
- Javascript not populate chart after retrieve json data
- Many Flots using ChartJS and Ajax get data values
- How to get unique variables from nested object?
- Customization of Data Labels in doughnut chart ng2-charts
- Chartjs - Dataset colors are getting overloaded with angular-chartjs