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
- dynamically update the scale type of chartjs graph
- How to move the x-axis values and line points to the middle of two x-axis lines using chartjs?
- Chartjs Array.join
- How to place extra text on canvas (not using HTML) beside chart?
- Vue Chart 3 - Doughnut Charts with Text in the Middle (Trouble registering a plugin)
- charts.js chart showing old data on hover
- My canvas/graph jumps to left after creating the object
- Last value not showing in bar graph of charts.js-library
- How can I add background color of length bars in chart (chartJS)?
- Horizontal bar with two yaxes chart js
- how to change x-axis line style in chartjs?
- how to creat a dynamic datasets and new dynamic multi yAxes
- charts.js - custom event using tooltip data (line chart)
- Chartjs React Typescript moving x axis labels above chart
- chartjs : uncaught exception: 0 and X are too far apart with stepSize of Y
- Charts.js how to fix the height with more than 50 horizontal bars
- How to draw a chart like below using chart js
- Make a chart clickable when placed under another SVG <View>
- chartJS, how to disable user from clicking on legend names and changing the graph?
- ChartJS canvas not displaying colors in edge browser
- How to use Angular-Charts JS?
- How to plot Firebase data with Chartjs in angular
- How to create a stacked graph using ChartJS
- How can i change tick val to title in ChartJS
- Edge browser does not render chart using chart js
- Ionic2: Use chartjs inside ion-segment
- How to change the display of an axis Chart.js
- chart.js time graph for Full day
- How to check chart type on Chart.js
- ChartJs doesn't work on a local downloaded page of Circular Gauge chart example