資料重新整理後圖表排序自動重新整理

1.1 版本

1.2 問題描述

使用圖表排序API進行排序，當資料源是變動的，資料重新整理之後圖表不會自動排序。如下圖所示：

1.3 解決方案

開啟圖表特效的監視重新整理功能，併為圖表新增初始化後事件。

2.1 報表設計

1）建立決策報表，並建立資料查詢，SQL語句為：SELECT * FROM 銷量 limit ${int(rand()*5+4)}。

2）在 body 中新增報表塊，併合並 A1~H18 儲存格，新增柱形圖，如下圖所示：

2.2 設定圖表資料

設定柱形圖資料，選擇「儲存格元素>資料」，資料來源選擇「資料集資料」，資料集為 ds1，分類為「銷售員」，系列名使用「欄位名」，欄位名和系列名為「銷量」，匯總方式為「求和」，如下圖所示：

2.3 設定圖表特效

選中圖表，選擇「儲存格元素>特效」，開啟動畫特效，開啟後台檢查，時間間隔為 2 秒，如下圖所示：

2.4 新增初始化後事件

傳回 body，選擇 Report0，選擇「事件」，新增初始化後事件，如下圖所示：

JS 程式碼如下：

注：此方案頻繁重新整理圖表，圖表交互可能存在異常，如效果圖中每次重新整理的時間間隔有細微差別。

setTimeout(function() {
		var chart = FR.Chart.WebUtils.getChart("A1").vanCharts.charts[0]; 
		// var chart=FR.Chart.WebUtils.getChart("A1","report0").getChartWithIndex(0);//獲取報表塊中圖表物件的另一種寫法
		chart.sortChart();
		function sortChartAfterRefresh(chart, sortType) {
			chart._update = chart._update || chart.update;
			chart.update = function() {
				chart._update.call(chart);
				chart.sortChart(sortType);
				chart.sortChart(sortType);
			}
		}
		sortChartAfterRefresh(chart, 1);

	},
	1000)
顯示程式碼
显示代码

2.5 效果預覽

儲存報表，選擇 PC 端預覽，效果如下圖所示：

注：不支援行動端。

點選下載範本：資料重新整理後自動排序.frm