Bonjour,

Dans mon projet j'utilise le plugin "highcharts" pour avoir des bons graphes. Le probléme que j'arrive pas a changer l'intervalle y £ [0 ..4500] vers l'intervalle suivant y £ [0..4 ] et comment changer la taille ,la police et la couleur des barres?.
http://jsfiddle.net/tsu2sb2o/

Merci de m'aider,

10 réponses


Bonjour,

Pour l'intervalle :

        yAxis: {
            tickInterval: 1000
        }

Pour la couleur :

        colors: [
            '#ff0000', 
            '#00ff00', 
            '#0000ff'
         ]

http://jsfiddle.net/tsu2sb2o/3/

Voila la doc pour plus d'infos : http://api.highcharts.com/highcharts/

emile01
Auteur

Super Herox , merci beaucoup pour ton aide.
Mais petite question y-t-il possible de supprimer les sous bars pour chaque catégorie?
Donc chaque catégorie doit avoir un seul barre avec couleur (laisser les 3 couleurs ) spéifique.

Par exemple : la catégorie "Africa" dépasse 1 donc son couleur (un seule bar en couleur bleu) est bleu comme tu as mis. Mais la catégorie "Europe" est inférieur à 1 donc son couleur est rouge (un seule bar en couleur rouge).

Merci encore de consacrer le temps pour m'aider ,

Bonjour,

Je n'ai pas compris ce que tu veux faire donc je peux pas plus t'aider.

emile01
Auteur

bonjour,

Dans ce graphe on constate que chaque catégorie contient 3 bars (couleurs :rouge, vert et bleu).
J'ai besoin de changer ceci, c'est a dire que chaque catégorie contient un seule bar avec n'importe couleur et les autres catégories ont des bars avec des couleurs différentes.
Exemple:

Merci,

Bonjour,

Alors si je comprends bien c'est ça que tu veux faire : http://jsfiddle.net/tsu2sb2o/4/

Si c'est le cas alors il faut faire ça :

series: [{
  name: 'Year 2012',
  colorByPoint: true,
  data: [1052, 954, 4250, 740, 38]
}]
emile01
Auteur

Merci Herox,

Exactement çà ce que je cherche , mais concernant les couleurs des bars comment le mettre dans la légende ?

Bonjour,

J'ai vu ton autre message sur le forum, pour la légende elle sert à rien vu que ne tu n'as qu'une donnée qui est la note.

http://jsfiddle.net/rssc0uo7/

$(function () {
    $('#container').highcharts({
        chart: { type: 'bar' },
        title: { text: 'Graphe Conformité ISO 27002' },
        exporting: { enabled: false },
        legend: { enabled: false },
        credits: { enabled: false },
        xAxis: { type: 'category' },
        yAxis: { title: { text: 'Note' }, tickInterval: 1 },
        plotOptions: { series: {dataLabels: { enabled: true }}},
        series: [{
            name: 'Note',
            colorByPoint: true,
            data: [{
                name: 'A.5 - Politique de sécurité de l\'information',
                y: 2
            }, {
                name: 'A.6 - Organisation de la sécurité de l\'information',
                y: 1.87
            }, {
                name: 'A.7 - La sécurité des ressources humaines',
                y: 3
            }, {
                name: 'A.12 - Sécurité liée à l\'exploitation',
                y: 1
            }]
        }]
    });
});
emile01
Auteur

oui comment tu as dit j'ai seulement le chapitre et son note. Mon encadrant ma dit qu'il faut spécifier trois couleurs selon les notes chapitres dans la légende (contient 3 couleurs: rouge, orange et vert) dont le but de spécifier l'intervalle des notes/chapitres .

Par exemple: pour le chapitre "A.5 - Politique de sécurité de l'information" a une note "2" donc son couleur est "orange".

Ce pour cela que j'ai besoin de la légende.

Bonjour,

Tu peux faire comme ça : http://jsfiddle.net/rssc0uo7/5/, après la légende je sais par comment faire.

data: [
  {
    name: 'A.5 - Politique de sécurité de l\'information',
    y: 2,
    color: 'orange'
  }, {
    name: 'A.6 - Organisation de la sécurité de l\'information',
    y: 1.87,
    color: 'orange'
  }, {
    name: 'A.7 - La sécurité des ressources humaines',
    y: 3,
    color: 'green'
  }, {
    name: 'A.12 - Sécurité liée à l\'exploitation',
    y: 1,
    color: 'red'
  }
]
emile01
Auteur

Un énorme merci mon ami Herox pour ton aide. J'ai résolu plus que la moitié de mes problémes.

Merci infiniment :)