Elysia Tools Docs
FR
Langue
ZHESPTRUFRDEEN
Retour au site
Parcourir les outils

Data Visualization

Graphique d'Anneau de Progrès

Créer de beaux indicateurs de progrès circulaires avec des animations, parfaits pour afficher des pourcentages, des taux d'achèvement et des métriques de progrès

html· Résultat HTMLOuvrir l'outil

Démarrage rapide

Appelez cet outil depuis votre code en trois langages.

cURL
curl -X POST 'https://api.elysiatools.com/fr/api/tools/progress-ring-chart' \
  -H 'Content-Type: application/json' \
  -d '{"progressData":"JSON format:\n[{"label": "Project A", "value": 75},\n{"label": "Project B", "value": 90},\n{"label": "Project C", "value": 45}]\n\nor text format:\nProject A:75\nProject B:90\nProject C:45\n\nor single values:\n75\n90\n45","chartTitle":"Entrez le titre du graphique...","ringSize":"200","ringThickness":"15","startAngle":"-90","colorScheme":"default","customColors":"#3b82f6,#10b981,#f59e0b","animationDuration":"1000","backgroundColor":"#ffffff","showPercentage":true,"showLabel":true,"animated":true}'

© 2026 Elysia Tools. Documentation développeur.

Retour au siteParcourir les outils

Référence de l'API

Envoyez une requête POST avec vos entrées en JSON. Les paramètres de type fichier nécessitent un upload préalable.

Point d'accès

HTTP
POST https://api.elysiatools.com/fr/api/tools/progress-ring-chart

Paramètres

NomTypeRequisDescription
progressDatatextareaOuiValeurs de progrès (0-100). Supporte le tableau JSON avec étiquettes, paires simples étiquette:valeur ou juste des valeurs
chartTitletextNonTitre qui sera affiché au-dessus du graphique
ringSizenumberNonTaille de chaque anneau de progrès en pixels
ringThicknessnumberNonÉpaisseur du trait de l'anneau de progrès
startAnglenumberNonAngle de départ en degrés (-90 = haut, 0 = droite, 90 = bas, 180 = gauche)
colorSchemeselectNon—
customColorstextNonCouleurs personnalisées pour les anneaux de progrès (couleurs hex séparées par des virgules)
animationDurationnumberNonDurée de l'animation de progrès en millisecondes
backgroundColorcolorNonCouleur de fond pour le conteneur du graphique
showPercentagecheckboxNonAfficher la valeur de pourcentage au centre de chaque anneau
showLabelcheckboxNonAfficher l'étiquette sous chaque anneau de progrès
animatedcheckboxNonAnimer les anneaux de progrès lorsqu'ils se chargent

Format de réponse

Résultat HTML

JSON
{
  "result": "<div>Processed HTML content</div>",
  "error": "Error message (optional)",
  "message": "Notification message (optional)",
  "metadata": {
    "key": "value"
  }
}

Intégration MCP

Ajoutez cet outil à votre serveur Model Context Protocol pour que les agents IA puissent le lister et l'appeler.

Configuration du serveur

Ajoutez ce bloc à la configuration de votre client MCP :

mcp.json
{
  "mcpServers": {
    "elysiatools-progress-ring-chart": {
      "name": "progress-ring-chart",
      "description": "Créer de beaux indicateurs de progrès circulaires avec des animations, parfaits pour afficher des pourcentages, des taux d'achèvement et des métriques de progrès",
      "baseUrl": "https://api.elysiatools.com/mcp/sse?toolId=progress-ring-chart",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Lister les outils disponibles

Après connexion au point d'accès SSE, listez les outils exposés :

tools/list
{
  "jsonrpc": "2.0",
  "id": 1,
  "method": "tools/list"
}

Appeler cet outil

Appelez l'outil par son id ; les arguments sont construits à partir de ses paramètres :

tools/call
{
  "jsonrpc": "2.0",
  "id": 2,
  "method": "tools/call",
  "params": {
    "name": "progress-ring-chart",
    "arguments": {
  "progressData": "JSON format:\n[{&quot;label&quot;: &quot;Project A&quot;, &quot;value&quot;: 75},\n{&quot;label&quot;: &quot;Project B&quot;, &quot;value&quot;: 90},\n{&quot;label&quot;: &quot;Project C&quot;, &quot;value&quot;: 45}]\n\nor text format:\nProject A:75\nProject B:90\nProject C:45\n\nor single values:\n75\n90\n45",
  "chartTitle": "Entrez le titre du graphique...",
  "ringSize": "200",
  "ringThickness": "15",
  "startAngle": "-90",
  "colorScheme": "default",
  "customColors": "#3b82f6,#10b981,#f59e0b",
  "animationDuration": "1000",
  "backgroundColor": "#ffffff",
  "showPercentage": true,
  "showLabel": true,
  "animated": true
}
  }
}
Chaînez plusieurs outils dans une session avec une liste toolId séparée par des virgules, ex. /mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp (20 max).

Des questions ou un problème ? Contactez [email protected]

Parcourir les outils
Ouvrir l'outil