儀表板佈局

1.1 版本

1.2 應用場景

對於已經製作好的視覺化儀表板，希望儀表板能自由設定佈局，並可以進行佈局的美化。

1.3 功能說明

FineBI 的儀表板佈局方式包含網格佈局、自由佈局。

預設即為網格佈局，可設定組件間是否有間隙；自由佈局透過設定組件懸浮實現。

• 網格佈局

• 自由佈局

網格佈局只支援縱向延伸，不支援橫向延伸。網格佈局把平面按規則劃分成多個儲存格，每個組件佔據一定數量的儲存格，當螢幕大小發生變化時，隨着螢幕實際寬高劃分儲存格，組件相對整個螢幕的比例不變。

在預設佈局方式下，組件之間有間隙，可調整為無間隙，始終吸頂放置，組件之間不能重疊放置。

2.1 設定組件間隙

進入儀表板編輯介面，預設網格佈局中，組件間都是有固定間隙的，如下圖所示：

點選儀表板樣式>自訂，在儀表板>組件間隙處，可以設定組件間隙，例如設定間隙為「2」，組件間隙會變小，效果如下圖所示：

2.2 調節組件大小

• 可以透過拖曳自由調節組件大小，如下圖所示：、

• 若是希望快速設定組件尺寸為螢幕寬度的固定佔比 ，可以直接使用「設定寬度」功能。

比如使用者希望三個過濾組件寬度相同，且填滿螢幕，可設定過濾組件的寬度為螢幕的 1/3。點選下拉，選擇「設定寬度」，如下圖所示：

自由佈局透過設定組件懸浮實現，為組件勾選懸浮後，可自由拖動擺放位置及大小，支援設定組件疊放時的順序調整。

3.1 設定組件懸浮

若想要儀表板佈局自由設定，自由拖曳組件之間的順序與位置，可選中組件，下拉設定「懸浮」，如下圖所示：

3.2 調整組件位置

懸浮後，該組件可以隨意拖曳至任何位置，可隨意設定組件大小，不受網格佈局平面劃分規則的限制。如下圖所示：

3.3 設定組件疊放順序

兩個同時設定懸浮的組件可以透過設定順序：置於頂部/置於底部，來調整組件顯示，如下圖所示：

3.4 調節組件大小

懸浮組件調節大小方式和網格佈局相同，詳情請參見本文 2.2 節。