提示點獲取儲存格資料

1.1 版本

1.2 預期效果

圖表提示除了顯示圖表使用到的資料，還希望能顯示其他圖表未使用到的資料，例如一個展示每月金額佔比的環形餅圖，希望還可以展示同比。如下圖所示：

1.3 實現思路

方法一：若資料存在於資料集中，可參考文檔 提示點獲取資料集資料，直接獲取資料集資料展示即可。

方法二：可自訂提示獲取儲存格中的資料。

那麼本文將介紹方法二的設定步驟。

2.1 範本設計

點選設計器左上角「檔案>建立普通報表」，選擇範本主題為「清爽科技」。建立內建資料集，名稱修改為「Monthlydata」，表設計如下圖所示：

注：資料僅用作範例，無實際意義。

2.2 設計報表

2.2.1 設計表格

將資料集中的欄位拖入 A2~C2 儲存格，表格樣式如下圖所示：

將 A2 儲存格的「資料設定」修改為「列表」，若是分組，存在相同資料時可能會導致取數錯誤。

2.2.2 插入圖表

先選中一片儲存格區域，點選上方工具欄「合併儲存格」按鈕，再點選「插入圖表」按鈕，選擇「餅圖」。如下圖所示：

2.2.3 綁定資料

選中圖表，點選右側屬性面板「儲存格元素>資料」，綁定資料集資料，分類為無，系列名使用欄位值，系列名選擇「月份」，值選擇「佔比」。如下圖所示：

2.2.4 設定圖表樣式

1）取消標題和圖例

選中圖表，選擇「儲存格元素>樣式>標題」，取消勾選「標題可見」；選擇「圖例」，取消勾選「圖例可見」。如下圖所示：

2）設定系列

選擇「樣式>系列」，關閉漸變風格，將內徑佔比設定為 80% 。如下圖所示：

3）設定標籤

選擇「樣式>標籤」，勾選「使用標籤」。本例不設定值標籤，將值標籤的正文內容取消勾選即可；設定分類標籤為「自訂」，輸入程式碼：

function(){ return "每月金額佔比同期比";}

並設定字元樣式，將標籤位置「置中」。如下圖所示：

4）設定提示

選擇「樣式>提示」，內容選擇「自訂」，輸入程式碼如下：

function() {
{  
//獲取A2擴展所有值
var a = []; 
//i<14 需要提前知道儲存格擴展出來有多少值，這裏有12個值，又是從A2儲存格開始，故最大的儲存格行號為13，需設定i小於14
for (i = 1; i < 14; i++) { 
var str = "A"; 
var id1 = str + i; 
var value1 = _g().getCellValue(id1); 
a.push(value1); 
} 
//獲取B2擴展所有值
var b = []; 
for (i = 1; i <14; i++) { 
var str = "B"; 
var id2 = str + i; 
var value2 = _g().getCellValue(id2); 
b.push(value2); 
} 
//獲取C2擴展所有值
var c = []; 
for (i = 1; i < 14; i++) { 
var str = "C"; 
var id3 = str + i; 
var value3 = _g().getCellValue(id3); 
c.push(value3); 
} 
var len = a.length; 
for (i = 0; i < len; i++) { 
//判斷A2擴展出的值是否等於系列名，等於則傳回提示
if (this.seriesName == a[i]) 
{ return '月份：'+a[i]+' 佔比：'+b[i]+' 同比：'+c[i]; } }}
}
显示代码

注：this.seriesName 是獲取當前資料點所在的系列名，若需要修改為分類名，可修改為 this.category 。

如下圖所示：

2.2.5 隱藏表格

完成報表設計後，選中表格所在行，在行序號處按滑鼠右鍵，選擇「隱藏」將表格隱藏。如下圖所示：

2.3 效果預覽

儲存報表，點選「分頁預覽」，效果如 1.2 節預期效果所示。

注：不支援行動端。

2.4 FVS視覺化看板範例

在 FVS 中引用表格儲存格資料時，程式碼中獲取儲存格的API寫法需要改變。變化如下：

var value3 =duchamp.getWidgetByName("表格1_頁面1").getCellValue(i,3); 

其次循環取值的方式也不一樣，完整程式碼範例如下：

function() {
{  
//獲取A2擴展所有值
var a = []; 
//i<14 需要提前知道儲存格擴展出來有多少值，這裏有12個值，又是從A2儲存格開始，故最大的儲存格行號為13，需設定i小於14
for (i = 1; i < 14; i++) { 
var value1 =duchamp.getWidgetByName("表格1_頁面1").getCellValue(i,1); 
a.push(value1); 
} 
//獲取B2擴展所有值
var b = []; 
for (i = 1; i <14; i++) { 
var value2 =duchamp.getWidgetByName("表格1_頁面1").getCellValue(i,2); 
b.push(value2); 
} 
//獲取C2擴展所有值
var c = []; 
for (i = 1; i < 14; i++) { 
var value3 =duchamp.getWidgetByName("表格1_頁面1").getCellValue(i,3); 
c.push(value3); 
} 
var len = a.length; 
for (i = 0; i < len; i++) { 
if (this.seriesName == a[i]) 
{ return '月份：'+a[i]+' 佔比：'+b[i]+' 同比：'+c[i]; } 
}
}
}
显示代码

2.5 決策報表範例

在決策報表中引用報表塊儲存格資料時，程式碼中獲取儲存格的API寫法需要改變。變化如下：

var value1 = _g().getCellValue(id1)  需 修改為 var value1 = _g().getWidgetByName("report0").getCellValue(id1)

其餘程式碼寫法均相同，完整程式碼範例如下：

function() {
{  
var a = []; 
for (i = 1; i <14 ; i++) { 
var str = "A"; 
var id1 = str + i; 
var value1 = _g().getWidgetByName("report0").getCellValue(id1); 
a.push(value1); 
}  
var b = []; 
for (i = 1; i <14 ; i++) { 
var str = "B"; 
var id2 = str + i; 
var value2 = _g().getWidgetByName("report0").getCellValue(id2); 
b.push(value2); 
} 
var c = []; 
for (i = 1; i <14 ; i++) { 
var str = "C"; 
var id3 = str + i; 
var value3 = _g().getWidgetByName("report0").getCellValue(id3); 
c.push(value3); 
} 
var len = a.length; 
for (i = 0; i < len; i++) { 
if (this.seriesName == a[i]) 
{ return '月份：'+a[i]+' 佔比：'+b[i]+' 同比：'+c[i]; } 
}
}
}
显示代码

詳情請下載範本自行查看。

點選下載範本：

提示點獲取單元格數據.cpt

提示點獲取報表塊資料.frm

提示點獲取單元格數據.fvs