dify显示echart
【摘要】 简介本文说明怎么在dify agent 应用窗口显示echart，本教程里面的数据是固定数据，实际使用的时候需要从文件或者数据库中读取来，然后显示出来。 具体流程工作室创建空白应用应用名称 & 图标 填写 【测试echart】，选择应用类型选择【Chatflow】，点击创建点击直接回复节点，回复数据填写{{#llm.text#}}```echarts { "xAxis": { "...
简介
本文说明怎么在dify agent 应用窗口显示echart，本教程里面的数据是固定数据，实际使用的时候需要从文件或者数据库中读取来，然后显示出来。
具体流程
- 工作室
- 创建空白应用
- 应用名称 & 图标 填写 【测试echart】，选择应用类型选择【Chatflow】，点击创建
- 点击直接回复节点，回复数据填写
{{#llm.text#}}
```echarts
{
"xAxis": {
"type": "category",
"data": ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
},
"yAxis": {
"type": "value"
},
"series": [
{
"data": [120, 200, 150, 80, 70, 110, 130],
"type": "bar",
"showBackground": true,
"backgroundStyle": {
"color": "rgba(180, 180, 180, 0.2)"
}
}
]
}
```
<br/>
其中echarts内为柱状图描述，更多列子参考 https://echarts.apache.org/examples/zh/index.html#chart-type-line
注意配置项名称，如 “xAxis”、“yAxis” 都是带着双引号的，这里不带双引号可能会报错。
- 点击预览，输入消息，回车，得到如下效果
【声明】本内容来自华为云开发者社区博主，不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源（华为云社区）、文章链接、文章作者等基本信息，否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
作者其他文章
评论（0）