I have a selected list where i want different charts to appear, but when i hover the new chart the old chart is bugging in and out. I have tryed to delete the chart but im not sure what to do. I have added new values to the array stat using the if and selectedIndex. Would really appreciate someone helping me:). I have see other people saying to use . destroy(); but i cant make it work.
var item = document.getElementById("item");
var ctx = document.getElementById("chart");
var btn = document.getElementById("btn");
var stat = [];
function check() {
var Index = item.selectedIndex;
if(Index === 1){
stat = [3,15.3,21.8,1.4,4.1,0.8,15.2,26.8,4.1];
tabell();
}else if(Index === 2){
stat =[1.4,5.5,16.6,1.4,7.5,1.2,30.3,28.9,4.2];
tabell();
}
}
function show() {
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["player1", "player2", "player3", "player4", "player5", "player6","player7", "player8","player9"],
datasets: [{
label: 'table thing',
data:stat ,
backgroundColor: ['#650012', '#a80014', '#e10028', '#b0e13e', '#23b121', '#ccd535', '#248e26', '#3c96bc', '#1721bc'],
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}
btn.onclick = function () {
check();
};
var item = document.getElementById("item");
var ctx = document.getElementById("chart");
var btn = document.getElementById("btn");
var stat = [];
function check() {
var Index = item.selectedIndex;
if(Index === 1){
stat = [3,15.3,21.8,1.4,4.1,0.8,15.2,26.8,4.1];
tabell();
}else if(Index === 2){
stat =[1.4,5.5,16.6,1.4,7.5,1.2,30.3,28.9,4.2];
tabell();
}
}
function show() {
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["player1", "player2", "player3", "player4", "player5", "player6","player7", "player8","player9"],
datasets: [{
label: 'Av 100 stemmer',
data:stat ,
backgroundColor: ['#650012', '#a80014', '#e10028', '#b0e13e', '#23b121', '#ccd535', '#248e26', '#3c96bc', '#1721bc'],
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}
btn.onclick = function () {
check();
};