Catégories

Générateur de Barre de Progression

Générer des barres de progression personnalisables à partir de données, parfait pour montrer le statut d'achèvement, les classements ou les valeurs comparatives

Données pour les barres de progression. Supporte le tableau JSON ou le format texte simple étiquette:valeur

Titre qui sera affiché au-dessus du graphique

Couleurs pour les barres de progression (couleurs hex séparées par des virgules). Laissez vide pour les couleurs par défaut.

Hauteur des barres horizontales ou largeur des barres verticales en pixels

Valeur maximale pour l'échelle de progression (laissez vide pour l'échelle automatique)

Valeur minimale pour l'échelle de progression

Valeur cible à afficher comme ligne de référence

Couleur de fond pour le conteneur du graphique

Afficher les valeurs de pourcentage sur les barres de progression

Afficher les valeurs réelles sur les barres de progression

Animer les barres de progression lorsqu'elles se chargent

Utiliser des coins arrondis pour les barres de progression

Afficher une ligne de référence pour la valeur cible

Points clés

Catégorie
Data Visualization
Types d’entrée
textarea, text, select, number, color, checkbox
Type de sortie
html
Couverture des échantillons
4
API disponible
Yes

Vue d’ensemble

Le Générateur de Barre de Progression permet de transformer rapidement vos données brutes en graphiques visuels clairs et personnalisables, idéaux pour illustrer des taux d'achèvement, des classements ou des comparaisons de performances.

Quand l’utiliser

  • Pour visualiser l'avancement d'un projet ou d'une tâche par rapport à un objectif défini.
  • Pour comparer les performances de plusieurs catégories ou individus au sein d'un classement.
  • Pour intégrer des indicateurs visuels simples et efficaces dans vos rapports ou présentations.

Comment ça marche

  • Saisissez vos données au format JSON ou sous la forme 'étiquette:valeur'.
  • Personnalisez l'apparence en choisissant l'orientation, le style de barre et les couleurs.
  • Ajustez les paramètres optionnels comme la valeur cible, les échelles min/max et les options d'affichage.
  • Générez instantanément votre graphique prêt à être utilisé.

Cas d’usage

Suivi hebdomadaire des objectifs de vente par équipe.
Visualisation du taux de complétion de sondages ou de formulaires.
Comparaison des scores de satisfaction client entre différents départements.

Exemples

1. Suivi des objectifs de vente

Responsable commercial
Contexte
Le responsable doit présenter les résultats de 4 régions à la direction.
Problème
Les chiffres bruts sont difficiles à comparer rapidement lors d'une réunion.
Comment l’utiliser
Saisir les données de vente, définir une valeur cible de 100 000 et activer l'affichage de la ligne cible.
Configuration d’exemple
chartData: [{"label": "Nord", "value": 85000}, {"label": "Sud", "value": 95000}, {"label": "Est", "value": 70000}], targetValue: 100000, showTarget: true
Résultat
Un graphique clair montrant la progression de chaque région par rapport à l'objectif commun.

2. Progression des tâches de projet

Chef de projet
Contexte
Plusieurs phases d'un projet informatique sont en cours simultanément.
Problème
Besoin d'un indicateur visuel simple pour le tableau de bord de l'équipe.
Comment l’utiliser
Utiliser le format JSON pour lister les tâches et appliquer un style dégradé pour une meilleure lisibilité.
Configuration d’exemple
barStyle: "gradient", showPercentage: true, rounded: true
Résultat
Des barres de progression modernes et arrondies affichant le pourcentage exact d'achèvement pour chaque phase.

Tester avec des échantillons

json, text

Hubs associés

FAQ

Quels formats de données sont acceptés ?

L'outil accepte un tableau JSON structuré ou une liste simple au format 'étiquette:valeur' (une paire par ligne).

Puis-je personnaliser les couleurs des barres ?

Oui, vous pouvez spécifier des codes hexadécimaux séparés par des virgules dans le champ dédié pour adapter le design à votre charte graphique.

L'outil supporte-t-il les barres verticales ?

Absolument, vous pouvez basculer entre une orientation horizontale et verticale via le menu déroulant des options.

Comment afficher une ligne de référence ?

Activez l'option 'Afficher la ligne cible' et renseignez la valeur souhaitée dans le champ 'Valeur Cible'.

Les barres sont-elles animées ?

Oui, vous pouvez activer l'option 'Progression animée' pour créer un effet visuel dynamique lors du chargement du graphique.

Documentation de l'API

Point de terminaison de la requête

POST /fr/api/tools/progress-bar-generator

Paramètres de la requête

Nom du paramètre Type Requis Description
chartData textarea Oui Données pour les barres de progression. Supporte le tableau JSON ou le format texte simple étiquette:valeur
chartTitle text Non Titre qui sera affiché au-dessus du graphique
orientation select Non -
barStyle select Non -
barColors text Non Couleurs pour les barres de progression (couleurs hex séparées par des virgules). Laissez vide pour les couleurs par défaut.
barHeight number Non Hauteur des barres horizontales ou largeur des barres verticales en pixels
maxValue number Non Valeur maximale pour l'échelle de progression (laissez vide pour l'échelle automatique)
minValue number Non Valeur minimale pour l'échelle de progression
targetValue number Non Valeur cible à afficher comme ligne de référence
backgroundColor color Non Couleur de fond pour le conteneur du graphique
showPercentage checkbox Non Afficher les valeurs de pourcentage sur les barres de progression
showValues checkbox Non Afficher les valeurs réelles sur les barres de progression
animated checkbox Non Animer les barres de progression lorsqu'elles se chargent
rounded checkbox Non Utiliser des coins arrondis pour les barres de progression
showTarget checkbox Non Afficher une ligne de référence pour la valeur cible

Format de réponse

{
  "result": "
Processed HTML content
", "error": "Error message (optional)", "message": "Notification message (optional)", "metadata": { "key": "value" } }
HTML: HTML

Documentation de MCP

Ajoutez cet outil à votre configuration de serveur MCP:

{
  "mcpServers": {
    "elysiatools-progress-bar-generator": {
      "name": "progress-bar-generator",
      "description": "Générer des barres de progression personnalisables à partir de données, parfait pour montrer le statut d'achèvement, les classements ou les valeurs comparatives",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=progress-bar-generator",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Vous pouvez chaîner plusieurs outils, par ex.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, max 20 outils.

Si vous rencontrez des problèmes, veuillez nous contacter à [email protected]