Data Visualization
Créer des graphiques thermomètre verticaux parfaits pour la visualisation des objectifs de collecte de fonds, des progrès de projet et des atteintes d'objectifs
Appelez cet outil depuis votre code en trois langages.
curl -X POST 'https://api.elysiatools.com/fr/api/tools/thermometer-chart' \
-H 'Content-Type: application/json' \
-d '{"thermometerData":"JSON format:\n[{"label": "Fundraising Goal", "current": 75000, "target": 100000},\n{"label": "Project Progress", "current": 85, "target": 100}]\n\nor text format:\nFundraising Goal:75000:100000\nProject Progress:85:100\n\nor just current values:\n75000\n85\n1200","chartTitle":"Entrez le titre du graphique...","thermometerWidth":"60","thermometerHeight":"300","mercuryColor":"#ef4444","tubeColor":"#e5e7eb","animationDuration":"1500","scaleStyle":"none","backgroundColor":"#ffffff","showPercentage":true,"showTarget":true,"showCurrentValue":true,"showScale":true,"animated":true}'Envoyez une requête POST avec vos entrées en JSON. Les paramètres de type fichier nécessitent un upload préalable.
POST https://api.elysiatools.com/fr/api/tools/thermometer-chart| Nom | Type | Requis | Description |
|---|---|---|---|
| thermometerData | textarea | Oui | Données thermomètre avec valeurs actuelles et cibles. Supporte JSON avec étiquette/actuel/cible, simple étiquette:actuel:cible, ou seulement les valeurs actuelles |
| chartTitle | text | Non | Titre qui sera affiché au-dessus du graphique |
| thermometerWidth | number | Non | Largeur du tube du thermomètre en pixels |
| thermometerHeight | number | Non | Hauteur du thermomètre en pixels |
| mercuryColor | color | Non | Couleur pour le mercure/remplissage de progression |
| tubeColor | color | Non | Couleur pour le fond du tube du thermomètre |
| animationDuration | number | Non | Durée de l'animation du mercure en millisecondes |
| scaleStyle | select | Non | — |
| backgroundColor | color | Non | Couleur de fond pour le conteneur du graphique |
| showPercentage | checkbox | Non | Afficher les valeurs de pourcentage pour chaque thermomètre |
| showTarget | checkbox | Non | Afficher la ligne de valeur cible et l'étiquette |
| showCurrentValue | checkbox | Non | Afficher la valeur actuelle sur chaque thermomètre |
| showScale | checkbox | Non | Afficher l'échelle de mesure sur le thermomètre |
| animated | checkbox | Non | Animer le mercure lorsque les thermomètres se chargent |
Résultat HTML
{
"result": "<div>Processed HTML content</div>",
"error": "Error message (optional)",
"message": "Notification message (optional)",
"metadata": {
"key": "value"
}
}Ajoutez cet outil à votre serveur Model Context Protocol pour que les agents IA puissent le lister et l'appeler.
Ajoutez ce bloc à la configuration de votre client MCP :
{
"mcpServers": {
"elysiatools-thermometer-chart": {
"name": "thermometer-chart",
"description": "Créer des graphiques thermomètre verticaux parfaits pour la visualisation des objectifs de collecte de fonds, des progrès de projet et des atteintes d'objectifs",
"baseUrl": "https://api.elysiatools.com/mcp/sse?toolId=thermometer-chart",
"command": "",
"args": [],
"env": {},
"isActive": true,
"type": "sse"
}
}
}Après connexion au point d'accès SSE, listez les outils exposés :
{
"jsonrpc": "2.0",
"id": 1,
"method": "tools/list"
}Appelez l'outil par son id ; les arguments sont construits à partir de ses paramètres :
{
"jsonrpc": "2.0",
"id": 2,
"method": "tools/call",
"params": {
"name": "thermometer-chart",
"arguments": {
"thermometerData": "JSON format:\n[{"label": "Fundraising Goal", "current": 75000, "target": 100000},\n{"label": "Project Progress", "current": 85, "target": 100}]\n\nor text format:\nFundraising Goal:75000:100000\nProject Progress:85:100\n\nor just current values:\n75000\n85\n1200",
"chartTitle": "Entrez le titre du graphique...",
"thermometerWidth": "60",
"thermometerHeight": "300",
"mercuryColor": "#ef4444",
"tubeColor": "#e5e7eb",
"animationDuration": "1500",
"scaleStyle": "none",
"backgroundColor": "#ffffff",
"showPercentage": true,
"showTarget": true,
"showCurrentValue": true,
"showScale": true,
"animated": true
}
}
}Des questions ou un problème ? Contactez [email protected]