bonjour,

je souhaite afficher les données de mon graph en temps réel, mais d'après mon script je récupère à chaque fois toutes les valeurs dans mon graph. Comment faire pour n'afficher que les nouvelles en plus des anciennes du coup. J'ai regardé avec la fonction shift() mais bon...

Merci.

var ' . $var1 . ' = [];
		var ' . $var2 . ' = [];
		var data = {
			labels: '.$var1.',
			datasets: [{
				label: "data",
				data: '.$var2.',
				backgroundColor: "#0156AC",
				pointStyle: "circle",
				pointRadius: 5,
				pointHoverRadius: 10
			}]
		};
		
		var config = {
			type: "line",
			data: data
		};
		
		var myChart = new Chart (
			document.getElementById("myChart"),
			config
		);
					
		setInterval(function() {
  const newLabel = (Math.random() + 1).toString(36).substring(7);
  const newData = Math.floor(Math.random() * (10 - 1 + 1)) + 1;
  addData(myChart, newLabel, newData);
}, 1000);

 je ne parviens pas a remplacer newData et newLabel

-
Edité par Nicos1235 5 décembre 2023 à 13:09:02

Bonjour à tous,

je me casse la tête sur ce graphique de ChartJs.

En effet, je ne sais pas comment afficher les nouvelles données dans le graph.

Mon code "fonctionne", mais j'affiche l'ensemble des données répétées toutes les 2 secondes. C'est pas bien lol !

Je cherche à avoir mes données déjà présentes, les afficher une fois et dès qu'un nouvel avis entre dans la table de base de données, ce nouvel enregistrement j'ajoute au graph en temps réel.

var date_insert = [];
                        var count = [];
 
     
 
        const ctx = $("#myChart");
         
        const data = {
            labels: date_insert,
            datasets: [{
                label: "Student Marks",
                data: count,
                backgroundColor: "#0156AC",
                pointStyle: "circle",
                pointRadius: 5,
                pointHoverRadius: 10
            }]
        };
        const config = {
            type: "line",
            data: data
        };
        const myChart = new Chart (
            ctx,
            config
        );
        function addData(chart, label, data) {
            chart.data.labels.push(label);
            chart.data.datasets.forEach((dataset) => {
                dataset.data.push(data);
            });
            chart.update();
        }
    
         
         setInterval(function() {
             
         
             
            jQuery.ajax({
                    type: "GET",
                    dataType: "json",
                    url: "page.php",
                    success: function(data) {
 
                             
                        for(var i in data) {
                            date_insert.push("" + data[i].date_insert);
                            count.push(data[i].count);
                        }myChart.update();
                        }
                     
                     
                 
                         
                         
                     
                });
             
        }, 2000);

Je ne parviens pas à utiliser la fonction addData non plus.

Il me semble que je ne suis pas loin.

Merci beaucoup

-
Edité par Nicos1235 20 décembre 2023 à 9:51:29