跳转到主要内容

Documentation Index

Fetch the complete documentation index at: https://openyida.ai/docs/llms.txt

Use this file to discover all available pages before exploring further.

OpenYida 支持使用 create-reportappend-chart 命令创建宜搭报表并添加图表,实现数据可视化。

功能概述

报表创建

通过自定义图表配置创建宜搭报表。

图表追加

向现有报表追加多种类型的图表。

数据绑定

自动绑定表单数据源,实时展示数据。

图表类型

支持柱状图、折线图、饼图、表格等多种图表。

创建报表

基本用法

openyida create-report <appType> "报表名称" '<图表定义JSON或文件路径>'
第三个参数可以是内联 JSON 字符串或 JSON 文件路径。

示例:创建销售报表

openyida create-report APP_XXXXXX "Sales Dashboard" '{
  "charts": [
    {
      "type": "bar",
      "title": "Monthly Sales",
      "cubeCode": "FORM_XXXXXX",
      "xField": "month",
      "yField": "amount"
    }
  ]
}'

从文件加载图表定义

openyida create-report APP_XXXXXX "Annual Report" ./charts-config.json

向报表追加图表

openyida append-chart <appType> <reportId> '<图表定义JSON或文件路径>'

示例

openyida append-chart APP_XXXXXX REPORT_XXXXX '{
  "type": "line",
  "title": "Growth Trend",
  "cubeCode": "FORM_XXXXXX",
  "xField": "month",
  "yField": "growth_rate"
}'

筛选器配置

报表支持添加筛选器,实现与图表的联动过滤。你可以在图表定义 JSON 中使用 filters 数组来配置筛选器。

带筛选器的完整配置

{
  "filters": [
    {
      "title": "项目筛选",
      "placeholder": "请选择项目",
      "cubeCode": "FORM_XXXXXX",
      "valueField": {
        "fieldCode": "selectField_xxx",
        "aliasName": "项目值",
        "dataType": "STRING"
      },
      "labelField": {
        "fieldCode": "selectField_xxx",
        "aliasName": "项目名称",
        "dataType": "STRING"
      },
      "linkTo": [0, 1]
    }
  ],
  "charts": [
    {
      "type": "bar",
      "title": "柱状图",
      "cubeCode": "FORM_XXXXXX",
      "xField": "name",
      "yField": "value"
    }
  ]
}

筛选器字段说明

字段必填说明
title筛选器标题
placeholder占位提示文本
cubeCode数据源表单 ID(如 FORM_XXXXXX
valueField值字段定义(包含 fieldCodealiasNamedataType
labelField显示字段定义(包含 fieldCodealiasNamedataType
linkTo联动目标图表,数组元素可以是图表索引(数字)或图表标题(字符串)。不指定则联动所有图表
如果未配置 filters,系统会自动为图表中的 selectField 类型字段生成下拉筛选器。

图表类型

类型说明适用场景
bar柱状图分类比较
line折线图时间趋势
pie饼图部分与整体关系
table数据表格详细数据查看
area面积图累积趋势
scatter散点图相关性分析
indicator指标卡关键指标展示
combo柱线混合图双轴对比
pivot交叉透视表多维分析
gauge仪表盘进度或目标跟踪
radar雷达图多维度对比分析
funnel漏斗图阶段转化分析

图表布局尺寸

你可以通过 wh 属性控制报表中每个图表的宽度和高度。报表使用 6 列栅格系统。
  • w — 栅格宽度(1-6 列)。当图表超出当前行剩余空间时,会自动换行。
  • h — 栅格高度(以栅格单位计)。
wh 设置为 0 是有效的。如果省略,则使用以下默认值。
图表类型默认 w默认 h
indicator66
pie322
bar322
line322
combo622
table638
pivot630
gauge218
其他类型322

图表定义格式

柱状图

{
  "type": "bar",
  "title": "Sales by Region",
  "cubeCode": "FORM_XXXXXX",
  "xField": "region",
  "yField": "amount",
  "aggregation": "sum",
  "w": 6,
  "h": 22
}

折线图

{
  "type": "line",
  "title": "Traffic Trend",
  "cubeCode": "FORM_XXXXXX",
  "xField": "date",
  "yField": "visitors",
  "aggregation": "sum"
}

饼图

{
  "type": "pie",
  "title": "Market Share",
  "cubeCode": "FORM_XXXXXX",
  "categoryField": "product",
  "valueField": "share"
}

数据表格

{
  "type": "table",
  "title": "Detail View",
  "cubeCode": "FORM_XXXXXX",
  "columns": [
    { "field": "name", "title": "Name" },
    { "field": "amount", "title": "Amount" },
    { "field": "date", "title": "Date" }
  ]
}

cubeCode 格式

图表定义中的 cubeCode 是报表引擎的数据源标识。它基于表单的 formUuid,但使用下划线分隔而非连字符。
formUuid: FORM-AB4ACB9D-D12C-470D-8204-7E05CDC19166
cubeCode: FORM_AB4ACB9D_D12C_470D_8204_7E05CDC19166
你可以使用 openyida get-schema 获取表单的 formUuid,然后将连字符替换为下划线作为 cubeCode。系统也会自动转换连字符格式。

聚合函数

函数说明
sum求和
avg平均值
count计数
max最大值
min最小值

完整配置示例

sales-report-charts.json

{
  "charts": [
    {
      "type": "bar",
      "title": "Monthly Sales",
      "cubeCode": "FORM_MONTHLY_SALES",
      "xField": "month",
      "yField": "sales_amount",
      "aggregation": "sum"
    },
    {
      "type": "pie",
      "title": "Product Categories",
      "cubeCode": "FORM_SALES",
      "categoryField": "product_category",
      "valueField": "sales_amount"
    },
    {
      "type": "line",
      "title": "Sales Trend",
      "cubeCode": "FORM_DAILY_SALES",
      "xField": "date",
      "yField": "sales_amount",
      "aggregation": "sum"
    },
    {
      "type": "table",
      "title": "Sales Detail",
      "cubeCode": "FORM_SALES",
      "columns": [
        { "field": "order_no", "title": "Order No.", "width": 150 },
        { "field": "customer_name", "title": "Customer", "width": 200 },
        { "field": "product_name", "title": "Product", "width": 200 },
        { "field": "amount", "title": "Amount", "width": 120 },
        { "field": "sales_date", "title": "Date", "width": 150 }
      ],
      "pageSize": 10
    }
  ]
}
创建报表:
openyida create-report APP_XXXXXX "Sales Analysis Report" ./sales-report-charts.json

最佳实践

  1. 合理选择图表类型 - 趋势用折线图、对比用柱状图、占比用饼图
  2. 控制图表数量 - 单个报表建议不超过 6 个图表
  3. 使用数据表格 - 配合图表展示详细数据,方便查看原始值
  4. 设置合适的分页 - 数据表格建议每页 10-20 条