Décrivez, ne dessinez pas : tableaux de bord Kibana IA natifs via MCP et ES|QL

example-mcp-dashbuilder est une application MCP open source qui transforme un simple prompt de commande en un tableau de bord Kibana interactif et en temps réel, directement dans la fenêtre de chat de votre éditeur. Décrivez le tableau de bord souhaité : l'IA détecte la structure de votre index, génère les agrégations ES|QL appropriées pour chaque visualisation et affiche un aperçu en temps réel. Une fois la configuration terminée, une simple commande permet d'exporter un tableau de bord Kibana entièrement fonctionnel : visualisations Lens, disposition en grille exacte et couleurs personnalisées conservées. Six types de graphiques sont actuellement pris en charge ; l'ensemble des fonctionnalités de Kibana Lens sera intégré ultérieurement.

Qu'est-ce qu'un générateur de tableaux de bord Kibana ?

Et si vous pouviez décrire le tableau de bord que vous souhaitez en langage clair et le voir apparaître, avec des graphiques interactifs, une mise en page par glisser-déposer et une exportation vers Kibana en un clic ?

C'est exactement ce que fait example-mcp-dashbuilder. Il s'agit d'une application open source (Model Context Protocol (MCP)) qui connecte les assistants IA à Elasticsearch, vous permettant de créer des tableaux de bord Kibana complets par chat. Pas besoin de cliquer dans les menus. Pas de configurations de visualisation à écrire manuellement. Il suffit de décrire ce dont vous avez besoin, et l'IA explore vos données, écrit les requêtes en langage de requête Elasticsearch (ES|QL), construit les graphiques et propose un tableau de bord interactif en direct, le tout dans la fenêtre de chat de votre éditeur.

Du prompt au tableau de bord en quelques secondes

Voici à quoi cela ressemble concrètement. Vous tapez quelque chose comme :

"Crée-moi un tableau de bord de trafic web à partir de logstash-* avec le nombre total de requêtes, les nombre d'octets transférés au fil du temps, les principales sources géographiques et une répartition des codes de réponse"

L'IA va alors :

1. Découvre vos données : liste les index, inspecte les mappings de champs.
2. Rédige des requêtes ES|QL : adaptées à votre schéma, utilisant les bonnes agrégations.
3. Crée des visualisations : graphiques à barres, graphiques linéaires, métriques avec sparklines, cartes thermiques, graphiques circulaires.
4. Organise tout : sections pliables, titres compréhensibles, mise en page adéquate.
5. Affiche un aperçu interactif : directement dans le chat, avec des infobulles, un sélecteur de temps et un système de glisser-déposer.

Chaque graphique apparaît en ligne au fur et à mesure qu'il est créé, ce qui vous permet de voir les progrès réalisés en temps réel. Ensuite, view_dashboard affiche le tableau de bord complet avec tous les panneaux disposés dans la grille à 48 colonnes de Kibana.

Aperçu du graphique unique intégré.

Propulsé par ES|QL

Toutes les recherches de données utilisent ES|QL, le langage de requête d'Elasticsearch. L'IA ne se contente pas de traiter les requêtes brutes, elle utilise aussi une connaissance intégrée d'ES|QL ainsi que des informations sur la structure de vos données pour écrire des requêtes correctes et efficaces pour chaque type de visualisation.

Le serveur inclut une référence ES|QL complète en tant que ressource MCP. Avant d'écrire une requête, l'IA lit cette référence pour comprendre les commandes, fonctions et schémas disponibles. Associée à un guide des bonnes pratiques de visualisation de données (également utilisé comme ressource), l'IA sait non seulement comment interroger, mais aussi ce qui génère une bonne visualisation :

• Utilisez BUCKET(@timestamp, 1 day) pour les séries temporelles ; toujours SORT par le champ temporel.
• Limitez les graphiques circulaires à six tranches avec | SORT value DESC | LIMIT 6.
• Choisissez des graphiques à barres pour les comparaisons de catégories, des graphiques linéaires pour les tendances, des métriques pour les indicateurs clés de performance (KPIs).

Exploration de données pilotée par l'IA avec analyse ouverte

Créer un tableau de bord que vous avez déjà imaginé est une chose. Se demander "Qu'y a-t-il d'intéressant dans cet index?" et obtenir une réponse utile est plus difficile ; cela exige que l'IA sache explorer, et pas seulement dessiner.

Example-mcp-dashbuilder propose une ressource analysis://guidelines qui définit un flux d'exploration structuré : profiler les données, effectuer des agrégations ciblées, faire apparaître des schémas dignes d'être étudiés, créer des graphiques pour les résultats les plus intéressants et proposer des requêtes d'exploration que l'utilisateur pourrait souhaiter ensuite. Des expressions déclencheurs, telles que "analyser mes logs" ou "trouver des tendances dans cet index", incitent l'IA à lire le playbook avant toute autre action. Ainsi, une requête ouverte produit une analyse cohérente plutôt qu'une multitude de graphiques aléatoires.

Résultat : vous pouvez fournir à l'IA un index inconnu et obtenir en retour un point de départ : un tableau de bord accompagné d'une courte liste de questions du type "Voici ce que j'ai remarqué, voulez-vous que j'approfondisse certains de ces points ?".

Exportation et importation du tableau de bord Kibana : le processus complet

C'est au niveau de l'exportation/importation que example-mcp-dashbuilder devient réellement utile pour les équipes qui travaillent déjà avec Kibana. example-mcp-dashbuilder est un outil à part entière, une interface de tableau de bord conversationnelle intégrée à votre éditeur, mais qui ne confine pas votre travail à cet éditeur. Les tableaux de bord créés ici peuvent être transférés vers Kibana à votre guise, et inversement, les tableaux de bord Kibana existants peuvent être importés pour une édition assistée par l'IA.

Exporter vers Kibana

Lorsque vous êtes satisfait de votre tableau de bord, une commande permet de l'exporter :

"Exporter ce tableau de bord vers Kibana"

Chaque panneau est traduit en une véritable visualisation Kibana Lens. La traduction préserve :

• Requêtes ES|QL : transférées directement en tant que sources de données Lens ES|QL.
• Positions de la grille : le même système à 48 colonnes que celui utilisé par Kibana, votre mise en page est donc identique.
• Couleurs personnalisées : Palettes de séries, arrière-plans de métriques, rampes de couleurs de carte thermique.

Le résultat est un tableau de bord Kibana entièrement fonctionnel. Pas une capture d'écran. Pas une intégration. Un vrai tableau de bord que vous pouvez partager et continuer à modifier dans Kibana.

Tableau de bord Kibana et tableau de bord dans le chat Cursor côte à côte.

Importer depuis Kibana

L'aller-retour fonctionne également dans l'autre sens :

"Importer le tableau de bord Kibana avec l'identifiant abc-123"

Cette opération récupère un tableau de bord Kibana existant, traduit ses visualisations Lens en configurations de graphiques éditables, préserve la disposition de la grille et les sections, puis charge le tout dans example-mcp-dashbuilder. À partir de là, vous pouvez le modifier en langage naturel et le réexporter.

L'IA devient ainsi un collaborateur de votre workflow Kibana existant, sans le remplacer.

Thèmes et couleurs personnalisés

Vous souhaitez un tableau de bord personnalisé ? Il suffit de demander :

"Créer un tableau de bord à thème rose avec des couleurs personnalisées"

Chaque type de visualisation prend en charge la configuration personnalisée des couleurs :

• Graphiques : palette accepte un tableau de couleurs hexadécimales pour les séries et les tranches.
• Métriques : color définit la couleur de fond.
• Cartes thermiques : colorRamp définit le gradient, des valeurs faibles aux valeurs élevées.

L'IA interprète naturellement les demandes de thème. Par exemple, si vous dites "Thème Océan", elle choisira des bleus et des turquoises. Si vous dites "Respecter les couleurs de notre marque" et fournissez les valeurs hexadécimales, elles seront automatiquement intégrées à Kibana lors de l'exportation.

Un tableau de bord thématique avec des couleurs personnalisées.

Fonctionnement de example-mcp-dashbuilder : architecture MCP

example-mcp-dashbuilder est basé sur MCP, la norme ouverte permettant de connecter les assistants IA à des outils et données externes. Voici l'architecture générale :

Le serveur MCP expose 25 outils directement accessibles à l'IA, permettant notamment l'exécution de requêtes ES|QL et l'exportation de tableaux de bord. Il propose également quelques outils internes "application uniquement", utilisés par l'aperçu intégré pour récupérer des données, enregistrer les modifications de mise en page et détecter les champs temporels. Trois ressources sont disponibles : un guide des bonnes pratiques de visualisation des données, une documentation de référence ES|QL et un playbook d'analyse approfondie, déclenché par des prompts ouverts ("analyse mes logs", "qu'y a-t-il d'intéressant dans cet index"). Le serveur fonctionne via les E/S standard (stdio) ou HTTP. Le protocole HTTP prend en charge les réponses par flux et la gestion des sessions, permettant ainsi à plusieurs clients de se connecter simultanément.

L'application MCP est l'aperçu interactif. Elle est développée avec React, Elastic Charts, et l'interface utilisateur Elastic, le tout intégré dans un seul fichier HTML autonome. Lorsque l'IA appelle view_dashboard ou crée un graphique, l'hôte affiche ce HTML dans une iframe en sandbox. L'application communique avec le serveur exclusivement via le protocole MCP Apps, en utilisant callServerTool() sur postMessage pour récupérer les données, enregistrer les mises en page et détecter les champs temporels. Il n'y a pas de serveur local, pas de port à configurer, aucune dépendance réseau externe.

Cela signifie qu'il fonctionne avec n'importe quel client compatible MCP : Cursor, Claude Desktop, Claude.ai, VS Code avec Copilot et bien d'autres.

Quels sont les types de graphiques pris en charge par example-mcp-dashbuilder ?

Au moment de la rédaction de cet article, six types de graphiques couvrant les scénarios de tableaux de bord les plus courants sont pris en charge :

Les tableaux de bord prennent en charge les sections pliables pour l'organisation, un sélecteur temporel avec détection automatique des champs temporels, ainsi que la possibilité d'enregistrer et de basculer entre plusieurs tableaux de bord ; les sessions de chat parallèles restent isolées les unes des autres via un dashboardId intégré à chaque appel d'outil.

Comment installer et exécuter example-mcp-dashbuilder

example-mcp-dashbuilder est open source et prêt à être utilisé. Vous aurez besoin de Node.js 22+, d'une instance Elasticsearch (locale ou Elastic Cloud) et d'un client compatible MCP.

Claude Desktop : téléchargez la dernière version .mcpb depuis GitHub Releases, et double-cliquez dessus. Claude Desktop vous demandera vos identifiants Elasticsearch.

Cursor/Claude Code/VS Code Copilot : indiquez à votre configuration MCP l'emplacement de l'archive tar publiée ; pas de clone, pas de npm install :

Définissez ES_NODE, ES_API_KEY (ou ES_USERNAME / ES_PASSWORD) et KIBANA_URL comme variables d'environnement. Si vous préférez travailler à partir de la source, clonez le dépôt et exécutez npm run setup pour lancer un assistant interactif qui gère à la fois Elasticsearch local et Elastic Cloud (Cloud ID + clé API).

Et commence à créer :

"Explorer l'index des logs et me créer le tableau de bord le plus pertinent possible ?"

L'IA prend le relais. 😉

Roadmap : nouveautés à venir concernant example-mcp-dashbuilder

Il s'agit d'une version préliminaire, et nous travaillons activement à son développement. Voici quelques axes sur lesquels nous nous concentrons :

• Autres types de graphiques : jauge, diagramme en anneau, arborescence, table de données et nuage de tags pour correspondre à toutes les capacités de Lens.
• Transférez les tableaux de bord vers Git : inscrivez les configurations des tableaux de bord dans un référentiel pour le contrôle des versions et les workflows de révision du code.
• Meilleure expérience utilisateur en cas d'erreur : commentaires plus détaillés en cas d'échec des requêtes ES|QL, avec des suggestions de solutions courantes.
• Flux d'analyse plus riches : extension du playbook d'analyse approfondie pour couvrir davantage de formes de données (logs, métriques, traces).

Nous serions ravis de savoir ce que vous allez en faire. Essayez-le, signalez les problèmes et faites-nous savoir quelles visualisations et quels workflows seraient les plus utiles pour votre équipe.

GitHub : elastic/example-mcp-dashbuilder

Remerciements

Merci à Walter Rafelsberger et Tim Schnell pour leurs contributions à la mise en œuvre.

FAQ

Qu'est-ce que example-mcp-dashbuilder ? example-mcp-dashbuilder est une application MCP (Model Context Protocol) open source qui connecte les assistants IA à Elasticsearch. Il vous permet de décrire un tableau de bord Kibana en langage clair, de générer automatiquement des requêtes ES|QL, de créer des visualisations et de diffuser un tableau de bord interactif en direct dans la fenêtre de chat de votre éditeur.

Quel langage de requête example-mcp-dashbuilder utilise-t-il pour récupérer les données ? Toutes les récupérations de données utilisent ES|QL, le langage de requête canalisé d'Elasticsearch. Le serveur MCP inclut une référence ES|QL intégrée que l'IA lit avant d'écrire toute requête, garantissant une syntaxe correcte et des agrégations efficaces pour chaque type de visualisation.

Puis-je exporter vers Kibana des tableaux de bord créés avec example-mcp-dashbuilder ? Oui. L'exécution de "Exporter ce tableau de bord vers Kibana" traduit chaque panneau en une véritable visualisation Kibana Lens, préservant les requêtes ES|QL, la mise en page de la grille à 48 colonnes, les couleurs personnalisées et les palettes de séries. Le résultat est un tableau de bord Kibana entièrement fonctionnel, et non une capture d'écran ou une intégration.

Puis-je importer un tableau de bord Kibana existant dans example-mcp-dashbuilder pour une édition assistée par l'IA ? Oui. Il suffit de fournir l'identifiant du tableau de bord Kibana pour le récupérer, convertir ses visualisations Lens en configurations de graphique modifiables et les charger dans example-mcp-dashbuilder. Vous pouvez ensuite modifier le tableau de bord en langage naturel et le réexporter vers Kibana.

Quels sont les clients MCP compatibles avec example-mcp-dashbuilder ? example-mcp-dashbuilder fonctionne avec n'importe quel client compatible MCP, y compris Cursor, Claude Desktop, Claude.ai, et VS Code avec Copilot. Il prend en charge les protocoles stdio et HTTP, sans aucun serveur local ni configuration de port nécessaire.

Quels sont les types de graphiques pris en charge par example-mcp-dashbuilder ? La version actuelle prend en charge six types de graphiques : à barres, linéaire, à aires, en camembert, métriques (avec sparkline) et cartes thermiques. Les ajouts prévus incluent les graphiques à jauge, en anneau, arborescents, tables de données et nuages de tags afin de correspondre à l'ensemble des fonctionnalités de Kibana Lens.

De quoi ai-je besoin pour exécuter example-mcp-dashbuilder ? Vous avez besoin de Node.js 22 ou version ultérieur, d'une instance Elasticsearch (locale ou Elastic Cloud) et d'un client compatible MCP. Définissez les variables d'environnement ES_NODE, ES_API_KEY (ou ES_USERNAME/ES_PASSWORD) et KIBANA_URL. Pour Claude Desktop, téléchargez le fichier .mcpb depuis les versions GitHub et double-cliquez dessus pour l'installer.