Discussion :

[syrine01]

Bonsoir,

Je suis entrain d'afficher des charts graphiques avec des données dynamiques dans mon projet. J'ai fais des recherches sur google et je trouve le "highCharts".
Donc j'ai l'intégré étape par étape dans mon projet.
L'encadrant de ce projet a choisi le type de charte suivant : ICI

En effet, Je cherche a créer un graphe statistique(barChart) avec les données suivantes:



Le code de ma vue:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
 
<script type="text/javascript">
        $(function () {
            $('#container').highcharts({
                chart: {
                    type: 'bar'
                },
                title: {
                    text: 'Graphe Conformité ISO 27002'
                },
                colors: [
                    '#eb0600',
                    '#ff7a09',
                    '#008b3a'
                ],
                xAxis: {
                    categories:
                     [
 
                         {% for st in stat %}
 
                             '{{ st.prefixe }}.{{ st.nom_chapitre }}',
 
                         {% endfor %}
                     ],
                    title: {
                        text: null
                    }
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: ' [0..4]',
                        align: 'high'
                    },
                    labels: {
                        overflow: 'justify'
                    },
                    tickInterval: 1000
                },
                tooltip: {
                    valueSuffix: '  Note'
                },
                plotOptions: {
                    bar: {
                        dataLabels: {
                            enabled: true
                        }
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -40,
                    y: 80,
                    floating: true,
                    borderWidth: 1,
                    backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
                    shadow: true
                },
                credits: {
                    enabled: false
                },
                series:
                 [
                   //***ici le probléme***
                     {% set previous ="" %}
                     {% for note in stat %}
 
                     {% if note.noteChp in range(0, 0,99) or previous in range(0, 0,99) %}
 
                        {
                         name: 'Faible',
                         data: [ {{ note.noteChp|round(2,'floor') }} ]
                        },
                     {% set previous = note.noteChp|round(2,'floor') %}
 
                     {% elseif note.noteChp >=1 and  note.noteChp <= 1.99 or ( previous >=1 and  previous <= 1.99) %}
 
                         {
                         name: 'Moyen',
                         data: [ {{ note.noteChp|round(2,'floor') }} ]
                         },
                     {% set previous = note.noteChp|round(2,'floor') %}
                     {% else %}
 
                       {
                         name: 'haute',
                         data: [ {{ note.noteChp|round(2,'floor') }} ]
                       }
                     {% endif %}
 
                   {% endfor %}
 
                 ]
            });
        });
    </script>

le probléme toujours proviens d’après la variable "data" de script car dans ce cas j'ai 2 variables (2 et 3) appartiennent au même intervalle v £ [2 ..4].

Voilà ce que j'obtiens . Il n'affiche pas tous les données du tableau que j'ai montré en haut.



merci de m'aider pour avoir graphe complète ,