使用OpenAPI方式进行数据查询时,您可以设置查询结果返回的图表格式(imageFormat参数),本文为您介绍不同类型的图表返回结果如何解析使用。
在数据查询OpenAPI中,您可以设置imageFormat参数设置查询结果的图表格式,支持设置为:
返回图表格式类型 | 返回结果格式说明 | 适用场景 |
|---|---|---|
image_url | 返回的是静态图片的 url 地址。 | PC 端快速消费(无法交互),不做任何二次开发。 |
lark_fragment(推荐) | 飞书格式富文本,返回结果是飞书原生片段格式。 | 飞书端消费,通过卡片等格式消息推送可交互图表,需要较少的二次开发 |
ark_image_key | 飞书图片key,返回结果是飞书静态图片格式。 | 飞书端消费,通过卡片等格式消息推送静态图表图片(无法交互),需要较少的二次开发 |
vchart_schema | 返回结果是 vchart 和 vtable 图表原生格式。 | PC 端消费,需要较多的二次开发 |
运行数据查询OpenAPI后的返回结果中,charts字段即为返回的推荐图表列表,当前最多返回top4图表,即最符合场景的4个图表,优先推荐顺序是从上到下,即第一个是最推荐的。您可以通过设置入参 maxImageNumber 修改返回 topN图表数量。
说明
当前支持的图表类型包括折线图、柱状图、饼图等多种类型,更多关于支持的图表类型和使用实践可参见最佳实践:支持的图表类型与使用实践。
当 OpenApi 传入的入参 imageFormat 为"image_url"时,返回图表为静态图片 url 地址格式,您可直接消费图片链接即可,无需其他处理。
返回结果示例:
当 OpenApi 传入的入参 imageFormat 为"lark_fragment",返回图表为飞书原生片段格式,示例如下:
消费使用:OpenAPI返回的 larkFragment 只是一个飞书原生片段,如果您希望最终展示在飞书应用中是消息卡片的样式,您需要将 OpenAPI 返回的 larkFragment 封装在此结构里。
{ "header": { "template": "blue", "title": { "content": "示例", "tag": "plain_text" } }, "elements": [ charts[0].larkFragment // dataagent OpenApi 返回图表内容 ] }
封装后的展示效果示例:
返回结果示例:
当 OpenApi 传入的入参 imageFormat 为"lark_image_key",返回图表为飞书图片格式,示例如下:
消费使用:OpenAPI返回的 imageLarkKey 只是一个飞书 image_key,如果您希望最终展示在飞书应用中是消息卡片的样式,您需要将 OpenAPI 返回的 larkFragment 封装在此结构里。
{ "header": { "template": "blue", "title": { "content": "lark_image_key 测试", "tag": "plain_text" } }, "elements": [ { "tag": "img", "img_key": charts[0].imageLarkKey, // dataagent OpenApi 返回图表内容 "alt": { "tag": "plain_text", "content": "柱状图" } } ] }
封装后的展示效果示例:
当 OpenApi 传入的入参 imageFormat 为“vchart_schema”,返回图表为 vchart 和 vtable 图表原生格式,业务的前端开发需要根据返回的 chartType,安装 vchart 和 vtable 组件库实现真实渲染。各类图表的示例如下。
图表类型 | OpenAPI返回结果示例 | 消费使用示例 |
|---|---|---|
饼图 |
您可以通过 测试地址 对返回结果进行测试解析,消费结果示例如下。 | |
柱状图 |
您可以通过 测试地址 对返回结果进行测试解析,消费结果示例如下。 | |
指标卡 | 暂无 |
|
折线图 |
您可以通过 测试地址 对返回结果进行测试解析,消费结果示例如下。 | |
双轴图 |
您可以通过 测试地址 对返回结果进行测试解析,消费结果示例如下。 | |
组合图 |
您可以通过 测试地址 对返回结果进行测试解析,消费结果示例如下。 | |
表格 |
您可以通过 测试地址 对返回结果进行测试解析,消费结果示例如下。 |