Sujet Précédent Sujet Suivant

Problème avec chartJs (Pie)

Résolu/Fermé
iMedbeMi Messages postés 4 Date d'inscription mercredi 15 juillet 2015 Statut Membre Dernière intervention 28 décembre 2016 - 31 août 2016 à 12:49
iMedbeMi Messages postés 4 Date d'inscription mercredi 15 juillet 2015 Statut Membre Dernière intervention 28 décembre 2016 - 31 août 2016 à 15:36
Bonjour,
j'ai un problème avec chartJs, en effet je voudrais concevoir un graphe circulaire (pie)

j'ai des doutes avec les src des scripts que j'ai insérés tout en haut de la page ... dans la balise <head> ... se sont des sources online

le plus étrange c'est que hier ça a bien marché ! j'ai eu un bon résultat , mais je ne sais plus d'ou vient le problème après !

en utilisant f12 -> Console j'ai l'erreur suivante :

jQuery.Deferred exception: (intermediate value).Pie is not a function TypeError: (intermediate value).Pie is not a function

at HTMLDocument.<anonymous> (http://127.0.0.1/chartjs/pieChart2.html:17:31)

at j (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29568)

at k (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29882) undefined

jquery.min.js:2 Uncaught TypeError: (intermediate value).Pie is not a function

mon code est comme suit : 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>C.H.A.R.T.JS</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.2.2/Chart.min.js"></script>
</head>

<body>
<canvas id="myChart" width="400" height="400"></canvas>
<script>
$(function()
{
//$('body').css({'background':'red'});
var ctx = $("#myChart").get(0).getContext("2d");

var data = [
				{
					value :270,
					color :'Dodgerblue',
					heightLight: 'Lightskyblue',
					label :'Imed1'
				},
				{
					value :50,
					color :'Red',
					heightLight: 'Lightskyblue',
					label :'Imed2'
				},
				{
					value :40,
					color :'yellow',
					heightLight: 'Lightskyblue',
					label :'Imed3'
				}
		  ];
var pieChart = new Chart(ctx).Pie(data);
}); // fin jQuery


</script>

</body>
</html>


a noter aussi que bar graph marche bien (sur un autre fichier) contrairement a celui ci (pie)
Merci de votre aide

A voir également:

1 réponse

Réponse 1 / 1
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 525
31 août 2016 à 15:08
Salut,

D'après la doc, il semble que la syntaxe pour instancier un chart de type Pie ait changée : 
// For a pie chart
var myPieChart = new Chart(ctx,{
    type: 'pie',
    data: data,
    options: options
});


https://www.chartjs.org/docs/#doughnut-pie-chart

Bonne journée,
2
iMedbeMi Messages postés 4 Date d'inscription mercredi 15 juillet 2015 Statut Membre Dernière intervention 28 décembre 2016
31 août 2016 à 15:36
Merci Pitet ... oui c'est ça
j'ai du alors changer le code ... j'utilisait une structure de données relativement ancienne (CDN1) de ChartJs1 alors que j'appelle (via src de la balise script ) celle de chartJs2 (CDN2)
mon code js devient ainsi : 
$(function()
{

var ctx = $("#myChart").get(0).getContext("2d");

var data = {
    labels: [
        "Red",
        "Blue",
        "Yellow"
    ],
    datasets: [
        {
            data: [300, 50, 100],
            backgroundColor: [
                "#FF6384",
                "#4BC0C0",
                "#FFCE56"
            ],
            label: 'My dataset'
        }]
};
var myPieChart = new Chart(ctx,{
    type: 'pie',
    data: data,
	options: {responsive: false}
});
}); // fin jQuery

Problème résolu !
0