# 功能需求
## 图表（以及图表编辑器）
### 用户场景
确定好数据源之后根据数据源创建相应的图表
### 功能描述
按照需求将数据源所提供的数据进行可视化，可为报告与看板提供图表元素
### 入口说明
`创建图表：图表 => 创建图表 => 选择已存在的数据源`

`从数据源快速创建图表: 数据源 =>  点击想要使用的数据源右边的齿轮弹出菜单 => 创建图表`

`修改图表: 图表 => 点击需要修改的图表的卡片预览图部分`

### 业务流程
`选择可视化模式 =>`
`填入相对应的图表设置项 =>`
`选择样式设置标签配置样式 =>`
`选择其他设置配置备注、所属组别、权限 =>`
`在顶部点击标题或者标题旁的编辑按钮编辑标题 =>`
`右上角可点击进行撤销和重做与预览 =>`
`右上角可点击查看列 =>`
`左上角可点击保存或返回图表界面（如果点击返回时尚未保存会提示是否保存） =>`
`左下角有自动刷新开关，开启时每次改动配置都会触发刷新，关闭时会显示按钮点击手动刷新 =>`
`点击图表上方漏斗可进行筛选`

### 界面UI

### 信息要素
| 字段     	| 字段类型    	| 必填项 	| 字段说明                                           	|
|----------	|-------------	|--------	|----------------------------------------------------	|
| 图表名称 	| VARCHAR     	| 是     	| 默认为数据源名称（未命名）                         	|
| 说明     	| VARCHAR     	| 否     	| 展示于图表卡片以简短说明                           	|
| 创建人   	| VARCHAR     	| 否     	| 待用户系统建立后会自动填入                         	|
| 创建时间 	| DATETIME    	| 否     	| 待用户系统建立后会自动填入                         	|
| 图表设置 	| JSON String 	| 是     	| 设置图表的基础参数，不同的可视化模式可设置的项不同 	|
| 样式设置 	| JSON String 	| 否     	| 设置显示图表的样式参数                             	|
| 其他设置 	| JSON String 	| 否     	| 设置图表的其他参数                                 	|

### 界面功能按钮及交互说明
| 按钮 	| 按钮交互说明 	| 按钮功能说明                                                                                                 	| 按钮逻辑                                                                                                           	|
|------	|--------------	|--------------------------------------------------------------------------------------------------------------	|--------------------------------------------------------------------------------------------------------------------	|
|![分组管理器](asset/image/dataSource-Button1.png)      	| 分组管理器   	| 可展开分组管理器以进行分组管理                                                                               	| 点击展开，失焦时收起                                                                                               	|
|![分组选择器](asset/image/dataSource-Button2.png)      	| 分组选择器   	| 可下拉展开一个层级菜单选择显示的分组                                                                         	| 点击展开，选择子项时标签变化为所选子项（如果是子节点会显示为面包屑形式）并收起，失焦时收起                         	|
|![创建图表](asset/image/chart-button1.png)      	| 创建图表     	| 点击后会弹出选择数据源的窗口                                                                                 	| 点击后弹出Modal，单选数据源后点击下一步跳转入图表编辑器                                                            	|
|![纵轴选择器](asset/image/chart-button2.png)       	| 纵轴选择器   	| 点击后展开纵轴选择器，选择数据列后可以选择统计方式；如果已选，可以直接点击显示统计方式的标签直接修改统计方式 	| 点击展开，选择数据列和统计方式后会显示为一个标签和列名，直接点击标签可以修改统计方式，失焦时收起                   	|
|![刷新控件1](asset/image/chart-button3.png)![刷新控件2](asset/image/chart-button4.png)![刷新控件3](asset/image/chart-button5.png)         	| 刷新控件     	| 开启时每次更改图表设置都会刷新图表                                                                           	| 开启时每次更改图表设置都会尝试请求图表数据，然后刷新图表；关闭后则不会自动刷新，并且显示手动刷新按钮，点击后刷新。 	|
|![筛选控件](asset/image/chart-button6.png)       	| 筛选控件     	| 点击后弹出筛选管理器                                                                                         	| 设置好筛选条件后每条筛选条件都会以标签的形式展示，并且可以手动点亮或点灭切换是否启用该筛选条件。                   	|
|![预览按钮](asset/image/chart-button7.png)       	| 预览按钮     	| 点击后将在新窗口打开一个页面单独显示图表                                                                     	|                                                                                                                    	|

### 补充说明