Catégories

← View All Tools

Générateur de Graphique en Marches d'Escalier

Créer des graphiques en marches d'escalier avec visualisation de données style escalier, parfait pour montrer les changements discrets dans le temps

Points de données comme tableau JSON avec propriétés x, y et libellé optionnel

Titre qui sera affiché au-dessus du graphique en marches

Étiquette pour l'axe X

Étiquette pour l'axe Y

Couleur de la ligne en marches

Largeur de la ligne en marches en pixels

Couleur des points de données

Taille des points de données en pixels

Afficher les points de données sur la ligne en marches

Afficher les étiquettes de valeur sur les points de données

Afficher les lignes de grille de fond

Remplir la zone sous la ligne en marches avec de la couleur

Couleur pour le remplissage de zone (si activé)

Couleur des lignes de grille

Couleur de fond du graphique

Largeur du graphique en pixels

Hauteur du graphique en pixels

Taille de police pour les étiquettes et le texte

Taille de police pour le titre du graphique

Famille de police pour les éléments de texte

Animer le graphique au chargement

Durée de l'animation en millisecondes

Points clés

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

Vue d’ensemble

Le Générateur de Graphique en Marches d'Escalier permet de transformer vos données discrètes en visualisations claires et précises, idéales pour illustrer des changements par paliers au fil du temps.

Quand l’utiliser

  • •Pour visualiser l'évolution des niveaux de stock qui changent par étapes.
  • •Pour représenter des changements de prix ou des tarifs fixes sur des périodes données.
  • •Pour illustrer des étapes de progression ou des seuils atteints dans un projet.

Comment ça marche

  • •Saisissez vos points de données au format JSON en spécifiant les coordonnées x et y.
  • •Choisissez le style de marche (avant, après ou milieu) pour adapter la forme de la courbe.
  • •Personnalisez l'apparence avec les options de couleur, de largeur de ligne et d'affichage de la grille.
  • •Générez votre graphique instantanément et ajustez les paramètres de police ou d'animation selon vos besoins.

Cas d’usage

Suivi des variations de prix d'un produit sur une année.
Visualisation des niveaux de stock en entrepôt après chaque livraison.
Représentation des paliers de progression d'un abonnement ou d'un service.

Exemples

1. Suivi des variations de prix

Analyste financier
Contexte
Un analyste doit présenter l'évolution du prix d'un abonnement logiciel qui a changé à trois reprises durant l'année.
Problème
Un graphique linéaire classique ne montre pas clairement que le prix est resté fixe entre les dates de changement.
Comment l’utiliser
Saisir les dates en X et les montants en Y, puis sélectionner le style 'Marche Avant'.
Configuration d’exemple
[{"x": "Jan", "y": 20}, {"x": "Avr", "y": 25}, {"x": "Juil", "y": 30}, {"x": "Oct", "y": 30}]
Résultat
Un graphique en escalier montrant visuellement les périodes de stabilité tarifaire entre chaque hausse.

2. Niveaux de stock en temps réel

Gestionnaire de stock
Contexte
Le gestionnaire souhaite montrer comment le stock d'un article diminue par lots après chaque commande client.
Problème
Les données sont discrètes et ne suivent pas une tendance linéaire continue.
Comment l’utiliser
Utiliser le format JSON pour lister les niveaux de stock et activer l'option 'Remplir la zone sous la ligne'.
Configuration d’exemple
stepStyle: 'step-after', fillArea: true
Résultat
Une visualisation claire des baisses de stock par paliers, facilitant l'identification des points de réapprovisionnement.

Tester avec des échantillons

json, text
Exemples de Communication Temps Réel WebRTC
Exemples complets WebRTC pour communication audio/vidéo P2P, canaux de données, partage d'écran et serveur de signalisation
preferred input family json
json
Exemples PDF
Exemples PDF generes par les outils du 2026-02-01 au 2026-02-10
preferred input family json
json
Exemples Avancés d'Application Grafana
Exemples complets de Grafana couvrant le design avancé de tableaux de bord, la configuration d'alertes, l'intégration de sources de données et le développement de plugins
preferred input family json
json
Exemples JWT
Exemples complets de JWT de la structure de base des tokens aux implémentations de sécurité avancées
preferred input family json
json

Hubs associés

Outils Json pour Generate
Découvrez 33 outils json pour des workflows de generate et comparez rapidement des utilitaires proches.
Outils Json pour Convert
Découvrez 100 outils json pour des workflows de convert et comparez rapidement des utilitaires proches.
Outils Text pour Convert
Découvrez 80 outils text pour des workflows de convert et comparez rapidement des utilitaires proches.
Outils Json
Découvrez 43 outils json pour des workflows de utility et comparez rapidement des utilitaires proches.

FAQ

Qu'est-ce qu'un graphique en marches d'escalier ?

C'est un type de graphique qui relie les points de données par des lignes horizontales et verticales, créant un effet d'escalier idéal pour les données qui restent constantes entre deux changements.

Quel format de données est requis ?

Vous devez fournir un tableau JSON contenant des objets avec les propriétés 'x' (axe horizontal) et 'y' (valeur numérique).

Puis-je personnaliser les couleurs ?

Oui, vous pouvez définir la couleur de la ligne, des points de données, de la grille et même de la zone sous la courbe.

Quels sont les différents styles de marches ?

Vous avez le choix entre 'Marche Avant' (horizontal puis vertical), 'Marche Après' (vertical puis horizontal) ou 'Marche Milieu' pour centrer les paliers.

Le graphique est-il interactif ?

Le générateur propose une option d'animation au chargement pour rendre la présentation de vos données plus dynamique.

Documentation de l'API

Point de terminaison de la requête

POST /fr/api/tools/step-chart-generator

Paramètres de la requête

Nom du paramètre Type Requis Description
chartTitle text Non Titre qui sera affiché au-dessus du graphique en marches
dataPoints textarea Oui Points de données comme tableau JSON avec propriétés x, y et libellé optionnel
xAxisLabel text Non Étiquette pour l'axe X
yAxisLabel text Non Étiquette pour l'axe Y
stepStyle select Oui -
lineColor color Non Couleur de la ligne en marches
lineWidth number Non Largeur de la ligne en marches en pixels
pointColor color Non Couleur des points de données
pointSize number Non Taille des points de données en pixels
showDataPoints checkbox Non Afficher les points de données sur la ligne en marches
showLabels checkbox Non Afficher les étiquettes de valeur sur les points de données
showGrid checkbox Non Afficher les lignes de grille de fond
fillArea checkbox Non Remplir la zone sous la ligne en marches avec de la couleur
areaColor color Non Couleur pour le remplissage de zone (si activé)
gridColor color Non Couleur des lignes de grille
backgroundColor color Non Couleur de fond du graphique
chartWidth number Non Largeur du graphique en pixels
chartHeight number Non Hauteur du graphique en pixels
dataLabelFormat select Non -
fontSize number Non Taille de police pour les étiquettes et le texte
titleSize number Non Taille de police pour le titre du graphique
fontFamily text Non Famille de police pour les éléments de texte
animationEnabled checkbox Non Animer le graphique au chargement
animationDuration number Non Durée de l'animation en millisecondes

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-step-chart-generator": {
      "name": "step-chart-generator",
      "description": "Créer des graphiques en marches d'escalier avec visualisation de données style escalier, parfait pour montrer les changements discrets dans le temps",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=step-chart-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]