[]
        
在线Demo 免费试用
(Showing Draft Content)

仪表板设计器界面介绍

1. 概述

1.1 功能概述

本节详细介绍仪表板设计器的界面组成及各区域的核心功能,帮助用户快速掌握仪表板设计器的设计与操作。

2. 界面介绍

2.1 仪表板设计器入口

  1. 文档门户单击创建文档image,选择仪表板,然后选择空白仪表板(本文示例)或合适的仪表板模板(详见仪表板模板),通过单击创建按钮或直接双击所选项目即可进入仪表板设计器。

    PixPin_2025-04-23_09-59-32

2.2 仪表板设计器界面布局

仪表板设计器采用直观的五区布局设计:左侧提供可视化组件面板区,中央是画布编辑区,顶部为功能菜单栏,右侧为数据绑定与属性配置区,底部是工具栏,整体布局如下图所示。

PixPin_2025-04-24_10-21-16

核心功能区说明:

区域

名称

功能说明

A

功能菜单栏

提供仪表板的相关操作按钮

B

可视化组件面板

丰富的可视化组件资源

C

画布编辑区

仪表板设计器的核心工作区

D

数据绑定与属性配置区

属性设置区,包括:图表数据绑定、属性配置、整体仪表板属性设置和对话分析

E

底部工具栏

页面操作区,包括:页面管理、画布样式自定义、移动端设计模式切换以及联动关系配置

F

页面显示区

该功能区域仅在编辑仪表板当前使用的数据集或模型时激活

2.3 各区域功能详解

2.3.1 功能菜单栏

菜单栏主要是放置仪表板相关的基础操作按钮,包括:仪表板的撤销、重做、保存、预览按钮以及开始菜单和仪表板菜单。

  • 撤销: 用于取消上一步操作(支持多步连续撤销)

  • 重做: 用于恢复被撤销的操作(需在撤销后使用)

  • 保存: 允许手动保存当前设计变更,首次保存需为仪表板命名(可选分类和修改说明),后续保存可选择性添加修改说明

  • 预览: 单击后可实时查看仪表板的最终展示效果

  • 开始:该菜单提供剪切、复制、粘贴、删除、格式刷以及组件组合、组件层级、组件对齐和组件大小设置,详情请参考设计器基础操作

    PixPin_2025-04-23_11-33-42

  • 仪表板: 该菜单是仪表板的整体属性设置区,包括全局设置、数据绑定及文档主题。

    PixPin_2025-04-23_11-34-03

    • 全局设置: 通过右侧属性面板可配置仪表板整体属性,具体操作详见全局设置

    • 数据绑定: 右侧数据管理面板支持添加或移除数据集,实现数据源的灵活配置。

      PixPin_2025-04-23_11-39-05

    • 文档主题: 提供多种预设主题可供选择,更多个性化设置请参考自定义文档主题

2.3.2 可视化组件面板

左侧可视化组件面板默认折叠,单击分类按钮展开对应组件库:

可视化分类

说明

操作方式

图示

组件

提供标准图表组件(柱状图/折线图等)及筛选器等辅助元素,详情请参考可视化图表的基础图表、高级图表、表格、指标、地图、文本、筛选器和其他组件这几部分的介绍

拖拽所需组件至画布区域即可完成添加,根据组件绑定字段即可查看组件效果。

-单击PixPin_2025-04-24_10-40-20快速搜索组件

-单击PixPin_2025-04-24_10-38-49图标固定/取消固定面板

-单击PixPin_2025-04-24_10-39-12图标切换组件展示方式

PixPin_2025-04-24_11-12-09

拓扑图

提供丰富的图形资源、线条和SVG形状组件,详情请参考拓扑图组件

可视化插件

扩展图表库(支持自定义开发与葡萄城应用市场下载),自定义开发详情请参考可视化插件

组件模板库

保存常用组件配置实现快速复用,保存后和其他可视化组件的使用一样,详情请参考基于仪表板模板创建

组件层级

集中管理仪表板当前页面的所有组件

通过点选快速定位画布中的对应组件,并提供检索和隐藏功能,实现高效的可视化元素管理

PixPin_2025-04-23_14-10-30

智能分析

当您不确定如何选择图表类型时,智能分析向导会根据拖入的字段特性,自动推荐最佳图表方案,详情请参考使用智能分析向导

拖拽字段至向导面板自动生成推荐图表,可修改图表类型

PixPin_2025-04-23_13-55-35

2.3.3 画布编辑区

画布区域是仪表板设计器的核心工作区,支持对可视化组件进行布局等一系列的设置。

PixPin_2025-04-23_14-48-12

2.3.4 数据绑定与属性配置区

数据绑定与属性配置面板支持折叠功能,单击PixPin_2025-04-24_10-28-12图标可收起/展开面板。使用右上角的PixPin_2025-04-24_10-28-42图标可退出仪表板设计器。

数据绑定与属性配置区说明:

分类

操作说明

示例图

图表数据绑定

选中图表组件后,选择需要的数据集或数据模型,拖拽将字段至对应绑定区域,自动生成可视化效果。详情请参考数据绑定与动态计算

PixPin_2025-04-23_17-05-58

图表属性设置

选中图表图表,在右侧属性面板调整组件属性。详情请参考组件外观与属性

PixPin_2025-04-23_17-05-02

仪表板全局设置

单击功能操作栏的「仪表板>全局设置」,在右侧属性面板调整仪表板的全局属性。详情请参考仪表板全局设置

PixPin_2025-04-23_17-06-50

对话分析

通过自然语言对话描述需求,系统将自动生成匹配的可视化图表。详情请参考对话分析

PixPin_2025-04-23_17-07-11

2.3.5 底部工具栏

底部工具栏提供两大核心功能模块:

  • 仪表板页面管理: 多页面创建与配置

  • 画布区域样式管理: 显示效果调整

PixPin_2025-04-23_17-28-30


2.3.5.1 仪表板页面管理

通过底部工具栏可对仪表板页面进行以下管理:

  • 新增页面:

    创建方式

    操作步骤

    效果图示

    新建空白页面

    单击PixPin_2025-04-23_17-29-57,选择“新建空白页面”,即可为您的仪表板新增一个空白设计页面。

    PixPin_2025-04-23_17-56-40

    通过模板创建

    单击PixPin_2025-04-23_17-29-57,选择“通过模板创建”,在弹出的对话框中选择**仪表板模板页面**,即可基于所选模板自动生成新页面。

    PixPin_2025-04-23_18-00-36

  • 页面调整

    • 调整顺序: 拖拽页面标签位置即可直接调整页面顺序。

    • 快速切换页面: 单击页面名称或单击PixPin_2025-04-24_09-47-55图标即可自由切换页面。

  • 高级功能: 单击页面名称旁的PixPin_2025-04-23_17-38-36图标弹出上下文菜单,即可对页面进行高级功能设置

    功能名称

    说明

    图示

    重命名

    修改当前页面名称

    PixPin_2025-04-23_17-41-04

    复制

    生成当前页面副本 (自动命名)

    隐藏

    运行时隐藏 (设计时可见)

    删除

    删除页面 (至少保留1页)

2.3.5.2 设计器画布区域样式指定

通过底部工具栏可对设计器画布区域样式进行以下指定设置:

功能名称

说明

图示

缩放画布区域

缩放画布默认显示比例为100%。可单击缩放按钮调整画布比例,或使用快捷键(Ctrl+滚动滚轮)自由缩放。

PixPin_2025-04-23_18-16-04

联动分析关系设置

管理联动关系,提供灵活的联动关系自定义能力,可随时启用/禁用特定联动,单击关联图标即可精细控制。详情请参考:组件间联动

PixPin_2025-04-24_10-07-31

PixPin_2025-04-23_18-15-16

设置是否开启网格线

显示/隐藏画布区域网格线,默认开启,可辅助组件对齐

PixPin_2025-04-23_18-15-50

设置是否禁用重叠

默认为开启状态,即允许组件重叠。当关闭时,即不允许组件重叠

PixPin_2025-04-23_18-15-33

对齐

设置网格对齐: 默认开启,开启时按网格单位(网格最小为20px)移动,关闭时像素级自由移动

设置自动对齐: 默认开启,开启时组件移动过程中,提供辅助线供用户与其他组件进行对齐;关闭时则不显示辅助线

PixPin_2025-04-24_10-09-14

PixPin_2025-04-23_18-14-32

移动端视图

单击后即可进入移动端视图设计面板,用户可以根据需要进行移动端布局设计,让仪表板在不同的终端上有不同的预览体验。详情请参考:移动端仪表板

PixPin_2025-04-23_18-15-02

2.3.6 页面显示区

该功能区域默认为隐藏状态,仅在编辑仪表板关联的数据集或模型时激活。激活后可单击页面名称或单击PixPin_2025-04-24_10-31-44图标自由切换页面显示

  • 仪表板设计页面: 当前仪表板的设计界面

  • 数据集/模型编辑区域: 打开当前仪表板关联的数据集/数据模型的编辑界面