更新时间:2024-11-15 GMT+08:00
分享

使用在线构建新建卡片

在线构建支持新建图表卡片新建表单卡片

新建图表卡片

支持无模板在线构建新建卡片,也支持基于使用在线构建的图表卡片模板新建卡片。

  1. 在开天集成工作台界面中,选择左侧导航栏中的“业务可视化 > 我的卡片”。
  2. 选择卡片分类,单击“新建卡片”。
  3. 选择卡片创建方式。在“创建方式”下单击“在线构建”

    支持在线构建、模板构建、上传卡片方式。

    • 创建方式:自定义在线构建卡片模板。
      • 在线构建:构建图表类或表单类卡片。
      • 模板构建:使用卡片模板构建卡片。
    • 上传卡片:通过上传卡片源文件创建卡片。

  4. (可选)在界面右上方,单击“选择模板”,在卡片模板列表通过搜索选择需要的卡片模板,单击“确定”。

    仅使用模板新建卡片时,操作此步骤。

  5. 在左侧“组件库”下,拖拽组件至中间画布中。

    图表卡片:为图形和表格组成的卡片。

    组件库包含基础组件、图表组件、高级组件,单击对应组件名称,即可查看该组件内的全部组件。

    画布上显示标尺,在画布最下方,可设置画布的宽高、背景图片及颜色、置空背景、放大、缩小、自适应、缩略图导航、组件对齐方式,也可以手动输入画布的缩放比例,撤销与恢复在画布中对组件的操作。

  6. 在左侧“图层”下,为组件设置显示效果,操作图标解释请参考表1

    表1 图层操作图标释义

    图标

    含义

    展示/收起组合的组件。

    复制组件。

    组件上移一层。

    组件下移一层。

    组件组合。

    拆分组合。

    锁定/解锁组件。

    删除组件。

    显示/隐藏组件。

  7. 在右侧设置数据服务,数据服务设置请参考表2

    表2 图表卡片数据服务参数说明

    参数

    说明

    数据源类型

    选择数据源类型。支持静态数据、Restful、连接器、流。

    静态数据:在JSON编辑器中,编辑静态数据。
    • :数据校验,校验JSON文件数据格式正确性。
    • :复制,复制JSON文件。

    数据服务URL

    “数据源类型”值为“Restful”时,才有此参数。

    数据服务的URL。

    请求类型

    “数据源类型”值为“Restful”时,才有此参数。

    在下拉框中选择请求类型。支持GET、POST。

    认证

    “数据源类型”值为“Restful”时,才有此参数。

    在下拉框中选择认证方式。支持No auth、BasicAuth、Token。

    • No auth:Restful API不对SVE进行鉴权。
    • BasicAuth:Restful API会对SVE进行BasicAuth认证,此时,还需要填写鉴权用户名和密码。
    • Token:Token方式,会自动获取当前登录开天集成工作台的用户对应的Token。

    请求头

    “数据源类型”值为“Restful”时,才有此参数。

    单击,填写Key和Value的值。

    请求参数

    “数据源类型”值为“Restful”时,才有此参数。

    单击,填写Key和Value的值。

    连接器

    “数据源类型”值为“连接器”时,才有此参数。

    在下拉框中选择连接器。单击,可以查看连接器的详情信息。

    这里的连接器为“连接器 > 我的连接器”列表中的连接器。

    执行动作

    “数据源类型”值为“连接器”时,才有此参数。

    在下拉框中选择连接器的执行动作。

    连接

    “数据源类型”值为“连接器”时,并且该连接器需要连接时,才有此参数。

    在下拉框中选择连接器的连接。

    “数据源类型”值为“流”时,才有此参数。

    在下拉框中选择流。单击,可以查看连接器的详情信息。

    这里的流为“流编排 > 我的流”列表中的流。

    参数

    “数据源类型”值为“连接器”“流”时,才有此参数。

    输入连接器或流的数据,支持JSON和表格视图。具有参数的连接器或流,才显示表格视图参数。

    请求间隔(秒)

    “数据源类型”值为“Restful”“连接器”“流”时,才有此参数。

    设置请求时间间隔。

    查看数据/服务返回结果

    数据源信息配置完成后,单击“查看数据/服务返回结果”,进入“数据响应结果”页面,进行数据影射如图1所示,配置完成后自动保存。如果不配置,则在“组件属性 > 基础属性 > 绑定数据”下拉框中选择不到数据。

    • 编辑:可以编辑映射的名称。
    • 新增:新增映射,支持同一个数据集映射多个组件。
    • 删除:删除新增映射。
    图1 配置映射

  8. 在右侧设置组件属性。不同组件显示的组件属性不同具体以界面显示为准。这里以“图表组件 > 折线图”为例,请参考表3

    • 编辑:编辑状态才可以设置组件属性。
    • 查看:查看状态不能设置组件属性。
    表3 图表卡片组件属性参数说明

    参数

    说明

    基础属性

    • 绑定数据:绑定数据源,在下拉框中设置。数据源在7的“查看数据/服务返回结果”中进行设置。
    • 组件样式:设置组件的宽高及XY轴的值。

    特有属性

    常规配置

    设置组件上下左右的边距。

    轴线配置

    • 折线属性:设置折线类型、粗细,根据需求开启曲线、折叠、阶梯型开关。
      • :表示关闭。
      • :表示开启。
    • 标记:设置标记点的类型、大小。
    • 标线/最大值/最小值/区域:根据需求开启并设置。

    数值标签

    根据需求开启并设置。

    坐标轴

    设置是否显示X/Y/Z轴,以及X/Y/Z轴的文本样式、位置、轴线样式、刻度样式、分割线样式、指示器的颜色及透明度。

    系列

    “坐标轴”设置显示Z轴时,选择折线展示的基准轴线。

    样式属性

    图例

    根据需求开启图例,设置文本样式、尺寸、标记、间距、排列方式、位置、是否滚动。

    提示框

    根据需求开启提示框,设置文本样式、背景颜色、边距。

    主题

    选择主题信息,根据需求开启自定义颜色。

  9. 在右侧设置卡片信息,请参考表4

    表4 卡片信息参数说明

    参数

    说明

    名称

    必填项。

    自定义卡片的名称。由1~64个字符组成,包含中文、字母、数字及下划线。

    版本

    卡片的版本信息,不可修改。

    样式分类

    卡片的分类,不可修改。

    卡片分类

    必选项。

    在下拉框中选择卡片的分类名称。默认显示第一个分类名称。

    描述

    必填项。

    自定义卡片的描述信息。

    封面图

    卡片的封面图。

    • 自动截图:单击“截屏”,自动获取画布中的图片。
    • 上传封面:单击“添加图片”,在弹出界面,单击,选择本地准备好的图片,裁剪出符合要求的尺寸后,单击

  10. 在界面右上方单击“保存”,系统自动弹出“保存”页面,确认卡片信息,单击“保存”。
  11. (可选)在界面右上角单击“预览”,预览配置效果。
  12. 预览无误后,在界面右上角单击“发布”。

    返回“我的卡片”界面,发布后的卡片,默认显示在“我的卡片”所选择的卡片分类列表下。

新建表单卡片

支持无模板在线构建新建卡片,也支持基于使用在线构建的表单卡片模板新建卡片。

  1. 在开天集成工作台界面中,选择左侧导航栏中的“业务可视化 > 我的卡片”。
  2. 选择卡片分类,单击“新建卡片”。
  3. 选择卡片创建方式。在“创建方式”下单击“在线构建”

    支持在线构建、模板构建、上传卡片方式。

    • 创建方式:自定义在线构建卡片模板。
      • 在线构建:构建图表类或表单类卡片。
      • 模板构建:使用卡片模板构建卡片。
    • 上传卡片:通过上传卡片源文件创建卡片。

  4. 进入“在线构建”页面,单击“表单卡片”,在“消息提示”对话框单击“确认”。
  5. (可选)在界面右上方,单击“选择模板”,在卡片模板列表通过搜索选择需要的卡片模板,单击“确定”。

    仅使用模板新建卡片时,操作此步骤。

  6. 在左侧“组件库”下,拖拽组件至中间画布或模板中。

    表单卡片:为纯表格卡片。

    组件库包含布局组件、装饰组件、输入组件、选择组件,单击对应组件名称,即可查看该组件内的全部组件。

  7. 在右侧设置公共属性,请参考表5

    表5 表单卡片公共属性参数说明

    参数

    说明

    基础属性

    • 栅格间隔:组件的宽度。可以手动输入,也可以单击+/-调节。取值范围为0~100,缺省值为15。
    • 组件尺寸:组件尺寸大小。包含中等、较小和迷你,缺省值为较小。
    • 标签对齐:组件标签的对齐方式。包含左对齐、右对齐、顶对齐,缺省值为右对齐。
    • 禁用组件:开启后则无法编辑该组件。
    • 标题:为表单设置标题。
    • 显示标题:设置是否显示表单标题。

    数据属性

    为了使卡片的数据能够正常提交存入数据库,必须配置数据属性。

    • 编辑器展开:展开JSON编辑器,编辑数据。
      • :数据校验,校验JSON文件数据格式正确性。
      • :复制,复制JSON文件。
      • :数据应用,使JSON文件生效。
    • 编辑器收起:折叠JSON编辑器。
    • 模型名称:卡片数据模型名称。单击后自动填充,不可编辑。
    • 组件字段:单击后,在下拉框中选择导入JSON文件中的组件字段。

      选择“组件字段”后,单击“一键生成卡片”

      说明:

      生成卡片会清空已导入组件。

    业务规则

    单击,新增业务规则,配置组件之间的交互规则。

  8. 在右侧设置组件属性,不同组件显示的组件属性不同具体以界面显示为准。这里以无模板“装饰组件 > 静态文字”为例,请参考表6

    • 编辑:编辑状态才可以设置组件属性。
    • 查看:查看状态不能设置组件属性。
    表6 表单卡片组件属性参数说明

    参数

    说明

    基础属性

    • 绑定数据:绑定数据源,在下拉框中设置。绑定的数据从7的“数据属性”中获取。
    • 文本内容:输入文字。
    • 栅格占据的列数:组件所占列数。可以手动输入,也可以单击+/-调节。取值范围为1~12,缺省值为12。

    特有属性

    • 跳转地址:填写需要跳转的链接。
    • 打开方式:根据需求设置链接的打开方式。
    • 千位分割:根据需求开启数字的分隔符。
      • :表示关闭。
      • :表示开启。

    样式属性

    这里是文本内容的样式属性。

    • 文本:设置外形、对齐方式、字体及颜色、文本大小及单位。

      文本大小设置后,在屏幕中文本大小会根据屏幕分辨率自适应。

    • 外形:设置文字的背景颜色、边框颜色、边框类型及圆角单位、边框宽度、边框圆角、阴影颜色、阴影方向、阴影X偏移、阴影Y偏移、阴影模糊半径、阴影扩散半径、背景不透明度。

  9. 在右侧设置卡片信息,请参考表7

    表7 卡片信息参数说明

    参数

    说明

    名称

    必填项。

    自定义卡片的名称。由1~64个字符组成,包含中文、字母、数字及下划线。

    版本

    卡片的版本信息,不可修改。

    样式分类

    卡片的分类,不可修改。

    卡片分类

    必选项。

    在下拉框中选择卡片的分类名称。默认显示第一个分类名称。

    描述

    必填项。

    自定义卡片的描述信息。

    封面图

    卡片的封面图。

    • 自动截图:单击“截屏”,自动获取画布中的图片。
    • 上传封面:单击“添加图片”,在弹出界面,单击,选择本地准备好的图片,裁剪出符合要求的尺寸后,单击

  10. 在界面右上方单击“保存”,系统自动弹出“保存”页面,确认卡片信息,单击“保存”。
  11. (可选)在界面右上角单击“预览”,预览配置效果。
  12. 预览无误后,在界面右上角单击“发布”。

    返回“我的卡片”界面,发布后的卡片,默认显示在“我的卡片”所选择的卡片分类列表下。

相关文档