第一張行動端大屏

1. 在進行行動端決策報表設計之前，需要先基本瞭解決策報表的功能和設計方法，建議閱讀： 儀表盤。

2. 目前手機的主流尺寸在 4.7 寸及以上，手機的邏輯像素寬度爲 375 像素及以上。因此在製作手機端報表的時候需要優先考慮決策報表畫布的大小。

3. 本文主要介紹製作簡單的行動端決策報表的操作步驟。

1

創建決策報表。

1. 點擊【檔案】→【新增決策報表】，新建一張決策報表。

2. 選擇【範本】→【行動端屬性】，將範本設置爲手機端專屬範本，默認畫布大小爲 375*560，寬375px爲固定數值，不可改變。

2

拖入組件。

1. 我們需要在決策報表中添加一個報表塊，一個圖表塊，3 個元件。

2. 參數組件：

   從工具欄中將參數界面拖拽至決策報表主體中。

   將三個元件：文字元件、下拉框元件和查詢按鈕拖拽至參數界面中，如下圖1。

   設置文字元件的元件值爲：CategoryID，如下圖2。

3. 空白塊組件:

   這裏以報表塊爲例進行介紹。從工具欄中將報表塊拖拽至決策報表主體中，如下圖3。

   選中報表塊，在行動端中，會默認設置豎屏爲橫向自我調整，如下圖3。

4. 圖表組件：

   再從工具欄中將折綫圖組件拖曳至報表塊組件的下方，如下圖4。

3

元件綁定資料。

1. 新建資料庫查詢：

   新建資料集查詢ds1、使用以下SQL語句：

   參數CategoryID的默認值爲 1。

2. 下拉框元件：

   選擇下拉框元件，點擊右側【屬性】標籤，點擊，設置資料字典。

   【類別設定】選擇【資料庫表】,【資料庫】選擇【FRDemoTW】,【選擇資料庫表】選擇【產品】,【實際值】與【顯示值】均設置爲【類別ID】。

   將下拉框元件的名稱設置爲CategoryID。

SELECT 產品名稱, 庫存量 from 產品 
WHERE 類別ID='${CategoryID}'

4

報表塊設計。

1. 點擊報表塊的【編輯】按鈕，編輯報表塊。

2. 在A1:B1中輸入產品名稱、庫存量。

3. 將ds1中的資料列拖入A2:B2。

4. 給報表添加外框線，設置居中。

5

圖表塊設計。

1. 點擊【資料】標簽。

2. 【資料來源】選擇【資料集資料】，【資料集】選擇【ds1】，【分類】選擇【產品名稱】。

3. 【系列名使用】選擇默認的【欄位名】。點擊添加【欄位名】，添加資料欄【庫存量】。【系列名】分別設置為庫存量。

4. 將圖的標題設置爲：產品庫存量。

6

行動端效果預覽。

1. 行動端預覽決策報表，效果如下圖所示。

2. 在行動端預覽時，參數查詢與表報界面分開顯示，點擊可選擇下拉框中的資料作爲參數。

3. 點擊最下方的可返回參數查詢界面。