仪表板布局

1.1 版本

1.2 应用场景

对于已经制作好的可视化仪表板，希望仪表板能自由设置布局，并可以进行布局的美化。

1.3 功能说明

FineBI 的仪表板布局方式包含网格布局、自由布局。

默认即为网格布局，可设置组件间是否有间隙；自由布局通过设置组件悬浮实现。

• 网格布局
  

• 自由布局

网格布局只支持纵向延伸，不支持横向延伸。网格布局把平面按规则划分成多个单元格，每个组件占据一定数量的单元格，当屏幕大小发生变化时，随着屏幕实际宽高划分单元格，组件相对整个屏幕的比例不变。

在默认布局方式下，组件之间有间隙，可调整为无间隙，始终吸顶放置，组件之间不能重叠放置。

2.1 设置组件间隙

进入仪表板编辑界面，默认的网格布局中，组件间都是有固定间隙的，如下图所示：

点击仪表板样式>自定义，在仪表板>组件间隙处，可以设置组件间隙，例如设置间隙为「2」，组件间隙会变小，效果如下图所示：

2.2 调节组件大小

• 可以通过拖拽自由调节组件大小，如下图所示：

• 若是希望快速设置组件尺寸为屏幕宽度的固定占比 ，可以直接使用「设置宽度」功能。

比如用户希望三个过滤组件宽度相同，且填满屏幕，可设置过滤组件的宽度为屏幕的 1/3。点击下拉，选择「设置宽度」，如下图所示：

自由布局通过设置组件悬浮实现，为组件勾选悬浮后，可自由拖动摆放位置及大小，支持设置组件叠放时的顺序调整。

3.1 设置组件悬浮

若想要仪表板布局自由设置，自由拖拽组件之间的顺序与位置，可选中组件，下拉设置「悬浮」，如下图所示：

3.2 调整组件位置

悬浮后，该组件可以随意拖拽至任何位置，可随意设置组件大小，不受网格布局平面划分规则的限制。如下图所示：

3.3 设置组件叠放顺序

两个同时设置悬浮的组件可以通过设置顺序：置于顶部/置于底部，来调整组件显示，如下图所示：

3.4 调节组件大小

悬浮组件调节大小方式和网格布局相同，详情请参见本文 2.2 节。