# 橫向縱向組合動態列分組 >橫向縱向組合動態列：是指`橫向動態渲染`和`縱向動態渲染` >橫向動態渲染：是指我們橫向把相同分類的合并在一起，是動態數據，如表頭：1月到12月，數據可能隨時變化，可能沒有5月，也可能沒有6月，而不是靜態數據（設計頁面寫死的數據） >縱向動態渲染：是指我們縱向把相同分類的合并在一起，與橫向動態渲染一致，都是數據動態改變，而不是靜態數據 >接下來讓我們一起學習如何實現橫向縱向組合動態列分組吧 [TOC] ## **特殊規則注意 重要！重要！** >[danger]特別注意：配置橫向動態分組要素： 1、目前支持多級表頭 ，最多支持3級動態的表頭 2、必須有橫向分組字段：如本示例中`#{area.groupRight(moth)}` 3、橫向分組下必須有`動態列`；動態列數據必須設置成`動態屬性 例如 #{area.dynamic(sales)}` 4、動態列數據之前的列字段必須設置成`縱向分組 例如 #{area.group(region)}` 5、數據中第一條`數據必須完整`；例如：期望展示1-6月數據，則第一條數據1-6月必須都有數據。 ## 效果演示 預覽地址：https://bootapi.jeecg.com/jmreport/index/631296598256996352  ## 設計步驟 ### 創建一個名為`區域銷售統計`的數據報表 > 創建一個區域銷售表，有七個字段：ID、區域、省、月份、銷售額、捐贈、比例  #### 1、為`區域銷售統計`創建一個SQL數據集 >查詢銷售區域所有信息  >部分數據展示  #### 2、將我們需要的字段拖拽到設計器頁面 >[danger] 注意：這里面有一個交叉報表的設置，詳細操作步驟請參考[交叉報表](http://report.jeecg.com/2112709)  #### 3、重點來了->如何配置橫向縱向動態列 ##### 3.1 設置橫向動態列 >點擊`#{area.moth}`，在分組設置中，聚合方式選擇分組  > 我們會發現`#{area.moth}`變成了`#{area.group(moth)}`，并且有向下的箭頭，接下來點擊擴展參數下拉框，選擇橫向分組  ##### 3.2 設置縱向動態列 >點擊`#{area.region}`，在分組設置中，聚合方式選擇分組  >`#{area.region}`變成了`#{area.group(region)}`，并有向下的箭頭，聚合方式為縱向  >再次點擊`#{area.province}`設置成縱向分組  ##### 3.3 將不是分組的單元格設置成動態屬性 >點擊`#{area.sales}`所在的單元格，分組中點擊高級配置，選中動態屬性  >`#{area.sales}`由`#{area.sales}`變成了`#{area.dynamic(sales)}`  >同理將`#{area.gift}`,`area.proportion`也設置成動態屬性  >保存預覽效果展示   #### 數據源格式可參考如下 >SQL數據源  >API數據源 ``` { "data": [ { "region": "華南", "province": "廣東省", "moth":"1月", "sales_1": "1062789", "gift_1": "15346", "proportion_1": "15%" }, { "region": "華南", "province": "廣東省", "moth":"2月", "sales_1": "1062789", "gift_1": "15346", "proportion_1": "15%" }, { "region": "華南", "province": "廣東省", "moth":"3月", "sales_1": "1062789", "gift_1": "15346", "proportion_1": "15%" }, { "region": "華南", "province": "廣東省", "moth":"4月", "sales_1": "1062789", "gift_1": "15346", "proportion_1": "15%" }, { "region": "華南", "province": "廣東省", "moth":"5月", "sales_1": "1062789", "gift_1": "15346", "proportion_1": "15%" }, { "region": "華南", "province": "廣東省", "moth":"6月", "sales_1": "1062789", "gift_1": "15346", "proportion_1": "15%" }, { "region": "華南", "province": "廣西壯族自治區", "moth":"1月", "sales_1": "10000", "gift_1": "1000", "proportion_1": "10%" }, { "region": "華南", "province": "廣西壯族自治區", "moth":"2月", "sales_1": "10000", "gift_1": "1000", "proportion_1": "10%" }, { "region": "華南", "province": "廣西壯族自治區", "moth":"3月", "sales_1": "48887", "gift_1": "3960", "proportion_1": "10%" }, { "region": "華南", "province": "廣西壯族自治區", "moth":"4月", "sales_1": "51484", "gift_1": "7440", "proportion_1": "10%" }, { "region": "華南", "province": "廣西壯族自治區", "moth":"5月", "sales_1": "10000", "gift_1": "1000", "proportion_1": "10%" }, { "region": "華南", "province": "廣西壯族自治區", "moth":"6月", "sales_1": "46388", "gift_1": "4000", "proportion_1": "10%" }] } ```