Kibana:使用 AI Chat 及 MCP 轻松创建 AI 原生仪表板

最近,我们发布了几篇文章来让我们通过人类自然语音的方式来创建在 Kibana 中可用的仪表盘或者可视化。这些文章如下:

这些文档都很好,但是它们里面没有可用的数据,展示的示例可能你也没法在你的地方来重现。今天我们就以 Kibana 中的数据集来最一个简单的展示。目的在于让大家有一个 touch and feel。

安装

首先这些功能在最新的版本中才出现的。我现在安装最新的 9.4 版本。你如果还是不知道如何安装 Elasticsearch 的话,请参考我之前的文章:

对于一些还不是很熟悉安装 Elastic Stack 的开发者来说,为了起用 AI 相关的功能,建议大家在 Kibana 的命令行打入如下的命令:

复制代码
$ pwd
/Users/liuxg/elastic/kibana-9.4.0
$ ./bin/kibana-encryption-keys generate

我们把生成的 keys 添加到 Kibana 的配置文件中:

等配置完毕后,我们需要重新启动 Kibana。这样我们的 Kibana 将来即便换到另外一个 wifi 的环境中,也可以启动起来。

对于还没有起用白金试用功能的开发者,请打开白金试用:

另外,你需要配置好自己的 LLM 连接器:

你可以使用自己喜欢的连接器,并在 Agents 中选中它:

对于中国的开发者,你可以选择 DeepSeek 这样的模型。

装载数据集

我们可以安装在 Kibana 中的已有的数据集 flights:

这样我们熟悉的数据集就安装好了。

在 AI builder 里创建 Dashboard

如文章 "Kibana 中的 AI Chat 现在可以原生渲染仪表",我们可以直接在 Agents 里通过自然语言创建我们想要的 Dashboard:

我们打入如下的一个句子:

复制代码
请创建一个监督 flights 的仪表盘

这样我们就创建了我们的第一个仪表。我们点击上面的 Preview 进行查看:

是不是很奇妙。我们的第一个仪表盘就创建好了。我们可以点击上面的 Save 按钮来进行保存:

我们可以从 Dashboards 中进行查看:

很显然,这个就是我们刚才创建的仪表盘。

我们目前虽然没有做任何的处理,但是我们得到了一个令人深刻的仪表盘。我们接下来想知道从中国到美国的最低机票是什么。我们想对这个仪表盘进行修改:

复制代码
请添加一个可视化:从中国到美国的最低机票是多少钱?并标明出发城市和目的城市。我想要有最低的6个机票,请用一个表格表示出来。

点击上面的 Preview

很显然,我们得到了我们想要的结果。我们从最下面的表格里可以查看到最低的价格表。同样我们点击上面的 Save 按钮保存即可。

在 Claude Desktop 里创建 Dashboard

很多开发者说,你这个只能在 AI Builder 里创建吗?能否在其它的工具,比如 Claude Desktop 里进行操作呢?答案是肯定的。我们可以参考文章 "Elastic MCP Apps 入门:安装与试用" 或者文章 "描述它,不要画它:通过 MCP 和 ES|QL 实现 AI-native Kibana dashboards"。

安装

我们需要创建一个 API key 给配置:

我们进入 github 仓库:Releases · elastic/example-mcp-dashbuilder · GitHub。下载最新的代码。

复制代码
git clone https://github.com/elastic/example-mcp-dashbuilder/

等下载完毕后,我们来安装相应的包:

复制代码
$ node -version
node: bad option: -version
$ node --version
v22.14.0
$ pwd
/Users/liuxg/nodejs/example-mcp-dashbuilder
$ npm install
⠹(node:33202) Warning: Setting the NODE_TLS_REJECT_UNAUTHORIZED environment variable to '0' makes TLS connections and HTTPS requests insecure by disabling certificate verification.
(Use `node --trace-warnings ...` to show where the warning was created)
npm warn deprecated glob@10.5.0: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me

我们然后去设置:

复制代码
$ npm run setup

> setup
> npm run build --workspace=setup && node setup/dist/cli.js


> @mcp-dashboards/setup@0.1.0 build
> tsc


🚀 MCP Dashboards Setup

This wizard will configure your Elasticsearch and Kibana connection.

📄 Configuration:

  ○ .env file: not found

✔ Connection type › Local
✔ Elasticsearch URL ... https://localhost:9200
✔ Auth type › API Key
✔ API Key ... ************************************************************
✔ Kibana URL ... http://localhost:5601
✔ Accept self-signed certificates? ... yes
⠋ Testing connection...(node:39440) Warning: Setting the NODE_TLS_REJECT_UNAUTHORIZED environment variable to '0' makes TLS connections and HTTPS requests insecure by disabling certificate verification.
(Use `node --trace-warnings ...` to show where the warning was created)
✔ Connected! (cluster: elasticsearch)

  Saved to /Users/liuxg/nodejs/example-mcp-dashbuilder/.env

我们可以查看 .env 里的内容:

复制代码
CONNECTION_TYPE=local
ES_NODE=https://localhost:9200
ES_API_KEY=QXE0OGlKNEJLMnYxWTVYTDMtSmY6dHpjQmJzVjVOWFpqb0ZNWDlqdEpNUQ==
KIBANA_URL=http://localhost:5601
UNSAFE_SSL=true

因为我们是自签名 Elasticsearch 集群,所以,我们需要设置 UNSAFE_SSL=true

我们同时还需要针对 Claude Desktop 进行配置:

复制代码
{
  "mcpServers": {
    "elastic": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "http://localhost:5601/api/agent_builder/mcp",
        "--header",
        "Authorization:${AUTH_HEADER}"
      ],
      "env": {
        "AUTH_HEADER": "ApiKey U1BxcHJad0JzYzNfZy1nWG4xZXg6TG95MWw1X25NRTdxSTlPa3FMNlpzQQ=="
      }
    },
    "example-mcp-dashbuilder": {
      "command": "/Users/liuxg/nodejs/example-mcp-dashbuilder/start-server.sh"
    },
    "elasticsearch-mcp-server-fastmcp": {
      "command": "/Users/liuxg/python/elastic-property-mcp/.venv/bin/uv",
      "args": [
        "run",
        "--with",
        "mcp[cli]",
        "mcp",
        "run",
        "/Users/liuxg/python/elastic-property-mcp/elastic_mcp_server.py"
      ]
    },
    "elasticsearch-rag-mcp": {
      "command": "node",
      "args": [
        "/Users/liuxg/nodejs/typescript-elasticsearch-mcp/dist/index.js"
      ]
    }
  },
  "coworkUserFilesPath": "/Users/liuxg/Claude",
  "preferences": {
    "coworkScheduledTasksEnabled": true,
    "ccdScheduledTasksEnabled": true,
    "sidebarMode": "chat",
    "bypassPermissionsGateByAccount": {
      "13ac96b4-c513-45b0-9889-dea6db5ee20b": false,
      "6f220bdd-aed4-4cb7-9e55-8d631b408e08": false
    },
    "coworkWebSearchEnabled": true,
    "remoteToolsDeviceName": "liuxgn-local",
    "epitaxyPrefs": {
      "starred-local-code-sessions": [],
      "starred-cowork-spaces": [],
      "starred-session-groups": [],
      "dframe-local-slice": {
        "pinnedOrder": [],
        "customGroupAssignments": {},
        "customGroupOrder": {}
      }
    }
  }
}

请注意上面的 example-mcp-dashbuilder 部分

复制代码
"example-mcp-dashbuilder": {
      "command": "/Users/liuxg/nodejs/example-mcp-dashbuilder/start-server.sh"
 },

配置完毕后,我们需要重新启动 Claude Desktop。启动后检查:

从上面,我可以看到 example-mcp-dashbuilder 连接器已经连接成功。我们接下来看看它能否帮我们创建 Dashboard。

创建模版

我们使用如下的方法来创一个模版:

复制代码
Please create a dashboard to monitor flights for kibana_sample_data_flights index

从上面,我们可以看出来它已经创建了非常漂亮的 Dashboard。

既然生成了 Dashboard,那么我们是否可以把它保存到我们的 Kibana 的 Dashboard 中去呢?答案是肯定的。我们打入如下的命令:

复制代码
Export this dashboard to Kibana

我们直接点击上面的链接即可:

很显然,我们已经把生成的 Dashboard 导出并写入大 Kibana 中去了。

有关配置 Claude Desktop

在我们的上面,我们使用了如下的配置:

复制代码
"example-mcp-dashbuilder": {
      "command": "/Users/liuxg/nodejs/example-mcp-dashbuilder/start-server.sh"
 },

我们可以使用如下的命令来 build:

复制代码
$ pwd
/Users/liuxg/nodejs/example-mcp-dashbuilder
$ npm run build

$ pwd
/Users/liuxg/nodejs/example-mcp-dashbuilder
$ ls server/dist/
app.d.ts              http-server.d.ts      index.d.ts            server.d.ts           tools
app.js                http-server.js        index.js              server.js             types.d.ts
app.test.d.ts         http-server.test.d.ts integration-tests     server.test.d.ts      types.js
app.test.js           http-server.test.js   resources             server.test.js        utils

我们可以看到目录下的 index.js 文件。我们也可以这样配置:

复制代码
    "example-mcp-dashbuilder": {
      "command": "node",
      "args": ["/Users/liuxg/nodejs/example-mcp-dashbuilder/server/dist/index.js"]
    },

这样我们的 Claude Desktop 的配置如下:

复制代码
{
  "mcpServers": {
    "elastic": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "http://localhost:5601/api/agent_builder/mcp",
        "--header",
        "Authorization:${AUTH_HEADER}"
      ],
      "env": {
        "AUTH_HEADER": "ApiKey U1BxcHJad0JzYzNfZy1nWG4xZXg6TG95MWw1X25NRTdxSTlPa3FMNlpzQQ=="
      }
    },
    "example-mcp-dashbuilder": {
      "command": "node",
      "args": ["/Users/liuxg/nodejs/example-mcp-dashbuilder/server/dist/index.js"]
    },
    "elasticsearch-mcp-server-fastmcp": {
      "command": "/Users/liuxg/python/elastic-property-mcp/.venv/bin/uv",
      "args": [
        "run",
        "--with",
        "mcp[cli]",
        "mcp",
        "run",
        "/Users/liuxg/python/elastic-property-mcp/elastic_mcp_server.py"
      ]
    },
    "elasticsearch-rag-mcp": {
      "command": "node",
      "args": [
        "/Users/liuxg/nodejs/typescript-elasticsearch-mcp/dist/index.js"
      ]
    }
  },
  "coworkUserFilesPath": "/Users/liuxg/Claude",
  "preferences": {
    "coworkScheduledTasksEnabled": true,
    "ccdScheduledTasksEnabled": true,
    "sidebarMode": "chat",
    "bypassPermissionsGateByAccount": {
      "13ac96b4-c513-45b0-9889-dea6db5ee20b": false,
      "6f220bdd-aed4-4cb7-9e55-8d631b408e08": false
    },
    "coworkWebSearchEnabled": true,
    "remoteToolsDeviceName": "liuxgn-local",
    "epitaxyPrefs": {
      "starred-local-code-sessions": [],
      "starred-cowork-spaces": [],
      "starred-session-groups": [],
      "dframe-local-slice": {
        "pinnedOrder": [],
        "customGroupAssignments": {},
        "customGroupOrder": {}
      }
    }
  }
}

我们需要重新启动 Claude Desktop:

使用 .mcpb 来进行安装

我们首先删除上面有关 example-mcp-dashbuilder 部分的配置。

我们在 https://github.com/elastic/example-mcp-dashbuilder/releases 下载最新的发布。下载最新的 MCP Bundle (v1.1.0)。我们点击下载后的 example-mcp-dashbuilder.mcpb 文件:

我们的安装已经完成了。我们接下来试一下:

很显然我们的配置是成功的。

相关推荐
MartinYeung52 小时前
[论文学习]LLM 与其他 AI 模型的隐私考量:输入与输出隐私框架方法
人工智能·学习
Thomas_YXQ3 小时前
Unity无GC读取图片与网格完整方案
大数据·人工智能·unity·微信·产品运营
qcx233 小时前
【AI Daily】AI日报 2026-06-02
人工智能·产品设计·ai agent
搭贝3 小时前
低代码+AI赋能文化传媒财务结算:搭贝平台技术架构与实战解析
人工智能·低代码·架构
杨云龙UP3 小时前
Oracle Health Check巡检脚本使用SOP V2.0:从HTML原始报告→生成Word专业巡检报告→交付客户_2026-06-03
linux·运维·数据库·sql·oracle·报告·巡检
城事漫游Molly3 小时前
AI赋能质性研究(一):质性编码全流程 AI Prompt 包
人工智能·prompt·ai for science·定性研究
王牌狮AIen3 小时前
商业重构——当AI开始“自己开会”:品牌智能体的觉醒与超级个体的崛起
人工智能·重构
Database_Cool_3 小时前
Hudi 湖仓一体架构:阿里云 AnalyticDB MySQL 原生集成最佳实践
数据库·mysql·阿里云
汤姆yu3 小时前
原生一体化多模态大模型技术研究
ai·大模型·多模态·智能体