FVS查詢面板

適用場景：安裝了「FineVis資料視覺化」插件的使用者，可參考本文了解 FineVis 的相關功能。

1.1 版本

1.2 應用場景

FVS 範本中，使用參數元件查詢資料時，需將元件直接新增到畫布使用。

但有些情況下，使用者希望元件查詢面板可以收縮展開使用，而不是直接展示在範本中，尤其是行動端查看範本的場景。

V2.3.0 及之後版本，則可以透過「啟動查詢面板」實現這類場景。效果如下圖所示：

注：查詢面板元件內元件不受畫布中元件影響，即使同名元件，查詢面板內元件也無聯動效果。

2.1 功能入口

查詢面板設定是所有分頁共用的，設定入口在畫佈下方分頁區。點選「查詢面板設定」按鈕，彈出設定框。

在設定框中勾選「啟動查詢面板」，即可新增元件，設定查詢面板樣式。預設未勾選。如下圖所示：

啟動查詢面板並新增元件後，範本預覽時，頁面左下角顯示查詢按鈕。若範本有多個分頁時，顯示在分頁切換按鈕左側。

注：若啟動查詢面板，但未新增任何元件，預覽時查詢按鈕不顯示。

2.2 內容

點選「新增元件」，點選下拉選項中的元件類型，將其新增到列表中，新增後即可在右側設定元件內容。

注：查詢面板中的元件不支援設定字元樣式。

列表中支援拖曳調整元件順序，該列表中的順序，即範本預覽時元件的顯示順序。

2.3 樣式

樣式設定中，支援設定是否「啟動自動查詢」。

勾選後，首次預覽範本或範本重新整理時，查詢面板預設不展開，自動觸發元件查詢並展示範本所有內容。

取消勾選，首次預覽範本或範本重新整理時，查詢面板預設展開，範本內容不展示，需點選查詢面板「查詢」按鈕後展示。

注：查詢面板及元件整體樣式會受 FVS範本主題 影響。

3.1 準備範本

1）點選設計器左上角「檔案>建立視覺化看板」，建立一張空白看板。

2）建立資料庫查詢 ds1 ，輸入 SQL 查詢語句 SELECT * FROM 銷量 where 地區='${area}' 。

給參數 area 設定預設值為「華東」，即預設獲取華東地區的銷量資料。

3.2 新增柱形圖

點選組件區「圖表>柱形圖」，將柱形圖組件新增到頁面，給柱形圖綁定含有 area 參數的資料集中資料。如下圖所示：

3.3 設定查詢面板

點選畫佈下方「查詢面板設定」，勾選「啟動查詢面板」。點選「新增元件」新增一個下拉框元件。

設定元件名稱為 area ；

數字字典選擇類型為「資料庫表」，選擇 FRDemo 中銷量表的「地區」欄位；

預設值輸入「華東」。

查詢面板樣式預設勾選「啟動自動查詢」，這裏保持預設即可。

3.4 效果預覽

3.4.1 PC 端

點選右上角「儲存」，點選「預覽」，在範本左下角有一個篩選按鈕，點選展開查詢面板。如下圖所示：

3.4.2 行動端

預覽方式請參考 FVS行動端預覽 ，效果如下圖所示：

點選下載範本：FVS查詢面板示例.fvs