Aboalsim Graphique

Description

aboalsim-graphique est un package JavaScript conçu pour générer des graphiques interactifs de manière simple et rapide. Il est parfaitement adapté pour visualiser différents types de données sous forme de graphiques à barres, graphiques en lignes, graphiques en secteurs, et bien plus encore. Ce package est idéal pour les projets nécessitant des visualisations dynamiques et personnalisables.

Installation

Pour installer le package via npm, exécutez la commande suivante :

npm install aboalsim-graphique

Utilisation

Importation du Package

Dans votre fichier JavaScript, importez la fonction genererGraphique :

import { genererGraphique } from 'aboalsim-graphique';

Préparation des Données

Le package aboalsim-graphique attend que vos données soient structurées sous un format spécifique. Voici un exemple de données à utiliser pour un graphique :

const data = {
    labels: ['Jan', 'Fév', 'Mar', 'Avr'], // Étiquettes pour l'axe des X
    label: 'Ventes', // Titre de la série de données
    values: [12, 19, 3, 5] // Valeurs pour chaque étiquette
};

Intégration dans le Projet

Pour afficher un graphique, il vous faut insérer un élément dans votre fichier HTML. Ce canevas servira de conteneur pour le graphique :

<canvas id="monCanvas" width="400" height="200"></canvas>

Génération du Graphique

Ensuite, vous pouvez générer le graphique en appelant la fonction genererGraphique une fois que la page est complètement chargée. Cette fonction prend en entrée l'ID du canevas et les données à afficher :

window.onload = () => {
    genererGraphique('monCanvas', data);
};