Bonjour à tous,

Tout d'abord merci pour votre aide.
Je souhaite afficher grâce à la bibliothèque Chart.js trois graphiques, dont les données proviennent d'un fichier .csv, dont j'ai ultérieurement extrait les données (tout cela en javascript bien sûr).
Voici donc mon code : (Pardonnez-moi si c'est mal codé, je suis débutant en Javascript)

"```"
drawChart();
drawChart1();
drawChart2();

async function drawChart() {
const datapoints = await getData();
const data = {
labels: datapoints.label,
datasets: [{
label: 'Valeur observée x',
borderColor: 'red',
backgroundColor: 'rgba(255, 0, 0, 0.5)',
data: datapoints.valeurx,
}],
};
const config = {
type: 'line',
data: data,
options: {
plugins: {
title: {
display: true,
text: 'Valeur observée x',
align: 'center',
position: 'top',
},
},
scales: {
yAxes: [{
type: 'linear',
position: 'left',
}],
},
},
};
var SimpleChart = new Chart(document.getElementById('SimpleChart'),config);
};
async function drawChart1() {
const datapoints1 = await getData();
const data1 = {
labels: datapoints1.valeur,
datasets: [{
label: 'Nomit de x',
borderColor: 'red',
backgroundColor: 'rgba(255, 0, 0, 0.5)',
data: datapoints1.nomit
,
}],
};
const config1 = {
type: 'line',
data: data1,
options: {
scales: {
xAxes: [{
type: 'linear',
scaleLabel: {
display: true,
labelString: 'Valeur observée x',
},
}],
yAxes: [{
type: 'linear',
position: 'left',
}],
},
},
};
var SimpleChart1 = new Chart(document.getElementById('SimpleChart1'),config1);
}
async function drawChart2() {
const datapoints2 = await getData();
const data2 = {
labels: datapoints2.valeur,
datasets: [{
label: 'Probabilité instantanée',
borderColor: 'red',
backgroundColor: 'rgba(255, 0, 0, 0.5)',
data: datapoints2.proba_,
}],
};
const config2 = {
type: 'line',
data: data2,
options: {
tooltips: {
mode: 'index',
},
scales: {
xAxes: [{
type: 'linear',
scaleLabel: {
display: true,
labelString: 'Valeur observée x',
},
}],
yAxes: [{
type: 'linear',
position: 'left',
}],
},
},
};
var SimpleChart2 = new Chart(document.getElementById('SimpleChart2'),config2);
};

async function getData() {
const valeur_x = [];
const nomit = [];
const proba = [];
const label = [];

const response = await fetch('donnees.csv');
const tabledata = await response.text();

const table = tabledata.replaceAll(',','.').replaceAll(';',',').split('\n').slice(1);
table.forEach(row => {
    const column = row.replace('\r','').split(',')
    const var_valeur_x = column[0];
    const var_nomit = column[3];
    const var_proba = column[4];
    valeur_x.push(var_valeur_x);
    nomit.push(var_nomit);
    proba.push(var_proba);
    label.push('');
});
const set_valeur_x = new Set(valeur_x);
const set_nomit = new Set(nomit);
const set_proba = new Set(proba);
let valeur = Array.from(set_valeur_x);
let nomit_ = Array.from(set_nomit);
let proba_ = Array.from(set_proba);

return{valeur_x,valeur,nomit_,proba_,label};

}
"```"

J'aimerais donc que les trois graphiques s'affichent avec les données à l'intérieur (c'est ce qu'on attend d'un graphique en général).

Les trois graphiques s'affichent bien, or seulement le premier affiche la droite des données. J'ai tenté de trouvé l'erreur dans mon code, mais rien n'y fait. Je comprends tout simplement pas pourquoi mon premier graphique (ID du graphique : SimpleChart) affiche bien les données, mais que les deux suivants non (IDs des graphiques : SimpleChart1 et SimpleChart2).

Encore merci d'avance à tous ceux qui me viendront en aide.

Aucune réponse