[WD17] Tutorial rapide – Créer un histogramme

Vincent Lecomte

Comme vous le savez certainement, il est possible de générer des graphiques de plusieurs types : secteurs, courbes, nuages de points, et même histogramme. Nous allons nous intéresser à ce dernier et allons rapidement passer en revue les quelques fonctions utilisées pour remplir notre graphe. Remarque intéressante : il est possible d’utiliser les fonctions de manipulation des graphes sur le système Linux, pour autant que l’on ait installé les librairies Qt au préalable (version minimum : v4.5).

Il est possible de créer des graphes que l’on “dessinera” soit dans une champ de type image, soit directement dans un champ de type “graphe” que l’on aura configuré au minimum lors de sa mise en place dans la fenêtre. Les séries seront ajoutées par programmation et non pas par l’assistant de création.

Le graphique que nous allons donc créer ici va recevoir des quantités de livre vendue sur quatre périodes spécifiques, et pour deux magasins. On va donc tout d’abord définir les libellés des axes X et Y via la description du champ (clic droit, propriétés – ou double clic sur celui-ci).

L’axe des X contiendra donc les périodes, de la plus lointaine à la plus proche. Nous laisserons la graduation se dessiner de manière automatique. L’orientation sera, elle aussi, automatique. Quant à l’axe des Y, on y mettra les quantités vendues. La graduation sera placée à 5 pour obtenir une meilleure vision. Enfin, vous pouvez décider d’afficher le quadrillage horizontal et/ou vertical, selon vos envies. L’onglet suivant, “IHM”, ne nous intéresse pas plus que ça.

Intéressons-nous à l’onglet “Détail”.

Des options par défaut ont été cochées, telles que l’antialiasing, qui permet, comme son nom l’indique, d’adoucir les effets d’escalier dans le dessin. Ainsi, on obtient un graphique plus esthétique. Nous décidons également d’afficher les valeurs au-dessus des séries lorsqu’elles sont dessinées, pour améliorer la visibilité. Enfin, on peut éditer le titre du graphe (éventuellement, le supprimer) et modifier la position de la légende du graphe (si elle est retirée, elle pourra de nouveau être ajoutée par programmation).

L’onglet “Séries” restera vide : on programmera l’ajout des séries et de ses valeurs (source “remplie par programmation”).

Nous voici maintenant avec un graphe vide… Nous allons appeler une procédure qui va chaque fois l’effacer, pour ensuite le recréer entièrement. C’est l’histoire de quelques appels, pas plus, bien sûr, il est possible de réaliser des choses bien plus complexes.

Réinitialiser un graphique

Pour effacer un graphique dans son entièreté, il suffit d’utiliser la fonction grEffaceDessin(). Cette fonction conserve cependant les données dans le cas où vous souhaiteriez réafficher le dessin. La fonction reçoit en paramètre le nom du graphe que l’on manipule, ou bien directement le champ (GRF_xxxx).

Créer un nouveau graphe

Normalement, nous devrions utiliser la fonction grCrée() qui reçoit en paramètre le nom (sous forme de chaine) du graphe, et le type (par exemple : grHisto). En le créant de cette manière, il sera ensuite possible de le dessiner dans un champ image. En revanche, nous possédons déjà un champ dans notre fenêtre qui doit recevoir l’ensemble des données. Nous n’avons nul besoin d’appeler la fonction de création dans ce cas.

Ajouter les données et catégories

Il est maintenant temps d’ajouter nos séries. Étant donné que nous avons appelé la fonction qui efface uniquement le dessin, nous allons supprimer toutes les séries présentes dans le graphique. Il suffit d’utiliser la fonction grSupprimeSérie() sans utiliser de paramètres.

Nous allons ensuite ajouter notre première série et les valeurs (qui constituent les “données”). Dans notre cas, une série représentera en fait un client. Les valeurs pour chacune des périodes (quatre pour rappel) apparaitront avec une couleur différente en fonction de la série. Voici le résultat que nous souhaitons atteindre lorsque toutes les données seront intégrées.

On distingue bien les quatre périodes grâce aux graduations sur l’axe X. Remarquez aussi les couleurs affichées : le violet représente le client 1, tandis que les barres “rosées” représentent le client 2. Sont également affichées les quantités au-dessus de chacune des barres : il s’agit, pour rappel, du nombre de livres vendus.

Le code ci-dessus effectue les opérations suivantes :

  • Il supprime toutes les séries contenues dans le graphe.
  • Il ajoute les données grâce à la fonction grAjouteDonnées(). La fonction est assez simple : il faut lui renseigner le nom du graphique, ou le champ, ensuite l’indice de la série (on va utiliser un chiffre qui se suit à chaque fois), et enfin la valeur, que nous récupérons dans un champ de type “table”. Nous avons quatre périodes à analyser, soit quatre valeurs à ajouter. La première série (indice = 1) représente donc le client numéro 1.
  • On définit les étiquettes des séries grâce à la fonction “grEtiquetteSérie()”, en lui précisant sur quel graphe on travaille, l’indice de la série à manipuler, et le texte qui sera utilisé en tant que légende. Ici, nous récupérons le nom du magasin grâce à une fonction globale d’une classe.
  • Nous répétons l’opération pour la seconde série.
  • Nous affichons la légende dans la partie supérieure du graphique, tout cela grâce à la simple fonction “grLégende()” qui reçoit deux paramètres : le nom du graphique (ou le champ) puis la position.

Les catégories sont des textes qui s’affichent sous l’axe des X. Dans notre exemple, chaque période est considérée comme une catégorie. Le résultat attendu est le suivant :

Le code suivant vous aidera à réaliser cela :

Comme nous avons quatre périodes, nous avons quatre catégories. Elles sont liées à l’indice de la donnée dans la série. A savoir, “P1” est lié à la donnée numéro “4” dans chacune des séries.

Afficher le champ

Il est temps de mettre à jour notre champ en y dessinant le graphique que nous venons de construire. C’est la fonction “grDessine()” qui s’occupe de ça : il suffit de lui préciser le nom du graphe à dessiner (ou le champ). Si le graphe n’est pas destiné à se retrouver dans un champ de la fenêtre, il faudra alors au préalable utiliser l’une des fonctions “grDestinationXXX()” ce qui permettra d’exporter le résultat (en BMP, dans un champ de type “image”, en EMF ou même en WMF).

Résultat final

Nous retrouvons bien les éléments suivants :

  • La légende, située en haut du graphique, avec le nom attribué aux séries.
  • L’axe Y avec la mention “Quantités” (livres vendus).
  • L’axe X avec la mention “Période (de la plus lointaine à la plus proche)”.
  • Les données : une barre représente la quantité vendue (valeur) pour un client (série) ; les couleurs (automatiques) permettent de les différencier. Quatre valeurs ont été ajoutées, pour quatre périodes.
  • Les catégories : cela permet d’afficher la légende pour une valeur spécifique de chaque série. Elles ont été définies par programmation.
  • Les libellés supplémentaires, tels que les valeurs affichées sur chaque barre (option à cocher dans la fenêtre de description de notre champ).
  • Les libellés automatiques, comme la graduation de l’axe Y.

A vous d’expérimenter ces fonctionnalités. La documentation de PC SOFT est bien fournie et vous aidera à avancer dans la bonne direction. Voir la section suivante : les graphes.

2 commentaires sur « [WD17] Tutorial rapide – Créer un histogramme »

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Copy link