BI 範本螢幕自適應插件

1.1 版本

1.2 應用場景

富正文、指標卡、圖表標籤、組件標題等的字體大小在不同決議度下都是固定字號顯示，不能自適應。做好的儀表板在不同尺寸裝置上看效果會很大偏差，會出現字體串行、捲軸（非整體自適應）、或者字體和圖表展示比例失衡。

筆記本做好的儀表板投屏示範時，使用 BI 範本螢幕自適應插件，儀表板內各個元素將自動根據新螢幕尺寸大小縮放，優化儀表板的查看效果。

1.3 功能介紹

BI範本螢幕自適應插件提供了使用者在切換螢幕查看儀表板時，根據螢幕決議度等比例自適應儀表板顯示，進而避免出現在不同決議度下的儀表板多捲軸顯示情況。

例如製作儀表板時是決議度為1000*800（5:4），當查看儀表板螢幕變成400*400，使用該等比例適應插件後，預覽下等比縮減為400 * 320（5:4）。

注：BI範本螢幕自適應插件在編輯狀態無效。

2.1 插件安裝

點選下載插件：BI範本螢幕自適應插件

插件安裝方法參照：插件安裝

2.2 操作方法

安裝插件後在預覽介面勾選並設定等比自適應即可。

3.1 設定等比自適應

以化工與金屬行業產品計劃達成儀表板為例，示範在不同決議度下使用BI範本螢幕自適應插件的效果。

1）插件安裝成功後，在儀表板預覽介面，頁面最上方會增加一個等比自適應按鈕（預設為勾選狀態），並且可以透過下拉框調整比例， 如下圖所示：

2）若在決議度較小的螢幕上查看該儀表板，由於儀表板中字體均為固定大小，將出現字體被擋住的問題，如下圖所示：

3）此時在預覽儀表板前提下，為該儀表板勾選等比自適應按鈕，並選擇對應的適應比例，則儀表板中各元素均按照當前螢幕決議度自行縮放適應，如下圖所示：

注：如果是在大螢幕下編輯好佈局後，由大螢幕切換到小螢幕後，在小螢幕下編輯了儀表板，導致佈局發生變化，這時候自適應是根據小螢幕下編輯時的佈局進行自適。

3.2 取消勾選等比自適應

除了手動點選取消，還可以透過在預覽介面增加 URL 參數?adaptive=false取消勾選，如下圖所示：

在某個螢幕編輯後，會按照該螢幕的佈局去進行自適應，若同一張儀表板，更換其他螢幕，會展示之前編輯的螢幕的自適應佈局。

若需要按照更換螢幕後的自適應佈局顯示，需要點選儀表板的「編輯」按鈕，如下圖所示：