反饋已提交

網絡繁忙

圖表物件API

版本


版本
功能變更
11.0.3新增一個獲取當前展示圖表 chartIndex 的API getCurrentChartIndex()
11.0-


Chart.WebUtils.getChart

方法Chart.WebUtils.getChart(chartID)

獲取圖表塊物件

參數chartIDchartID 為字串類型,表示當前圖表所在圖表塊的唯一標識 ID,在 JS 中書寫時需區分大小寫,與實際組件名稱保持完全一致。
範例

範例1:獲取儲存格中插入的圖表,chartID 為圖表所在儲存格,如:A1

FR.Chart.WebUtils.getChart("A1");

範例2:獲取懸浮元素圖表,chartID 為懸浮元素的名稱,選中懸浮元素,按滑鼠右鍵「設定懸浮名稱」可查看或修改懸浮元素名稱

FR.Chart.WebUtils.getChart("Float1");

範例3:獲取決策報表中的圖表塊,chartID 為組件名稱

FR.Chart.WebUtils.getChart("chart0");

範例4:獲取決策報表的報表塊中儲存格圖表

FR.Chart.WebUtils.getChart("A1","report0");
行動端支援
注意事項

1)該API不支援擴展圖表。

2)上述所有獲取物件的方法在行動端的實現方式跟 PC 端是有差異的,行動端只支援部分 JS 呼叫這些方法。

3)決策報表報表塊內圖表,僅支援行動端 11.0.63 及之後的版本呼叫部分 JS 。

getChartWithIndex

方法getChartWithIndex(chartIndex)獲取圖表物件
參數chartIndex

1)chartIndex 為數字體。

2)預設圖表塊裏面只有一個圖表,這時的 chartIndex 為 0。

3)當設定了圖表切換,即一個圖表塊內有多個圖表時,需要傳入具體的 chartIndex 來獲取具體的圖表物件,這就意味着如果想獲取第 n 個圖表,那麼傳入的 chartIndex 應該為 n-1

範例

圖表切換設定了 3 個圖表,獲取第 3 個圖表物件

FR.Chart.WebUtils.getChart("A1").getChartWithIndex(2);
行動端支援

getCurrentChartIndex()

方法getCurrentChartIndex()

獲取當前展示圖表的chartIndex

多圖表開啟輪播時,不易使用 getChartWithIndex 的方法獲取 chartIndex ,可能導致無法獲取圖表物件,此時需要使用 getCurrentChartIndex() 。

參數--
範例
// 點選圖表塊開啟全螢幕圖表
(.vanchart-cc只是一個範例,具體給哪個元素新增點選事件需根據實際情況決定)
$(".vanchart-cc").click(function({
        var chart = FR.Chart.WebUtils.getChart("chart0");
        var currentChartIndex = chart.getCurrentChartIndex(); 
// 獲取當前展示圖表的chartIndex
        VanCharts.showLightBox(chart.getChartWithIndex(currentChartIndex));
});
行動端不支援行動端

series

方法
series[seriesIndex]

獲取系列物件

需在獲取圖表物件之後使用

參數seriesIndex預設 chart 物件有一個 series 屬性,該物件儲存的是圖表內系列相關的資料資訊,是一個物件陣列。如果想要獲得圖表中某一個具體的系列物件,則需要指定對應的索引 seriesIndex,seriesIndex 從 0 開始計數。
範例

範例1:對於餅圖來說,一個系列就是一個餅圖,例如需要表示第一個餅圖的所有扇形的資料點。

chart.series[0].points;

範例2:假設已獲取到圖表物件 PieChart,現在想要獲取裏面的第 1 個系列物件,那麼使用PieChart.series[0]即可得到,可以在瀏覽器中列印:

var PieChart=FR.Chart.WebUtils.getChart("A1").getChartWithIndex(2);
console.log(PieChart.series[0]);
行動端支援部分行動端呼叫 JS

series.points

方法
series.points[pointIndex]

獲取資料點物件

需在獲取圖表物件之後使用

參數pointIndex

每個 series 物件裏面又有一個 points 的屬性,也是一個物件陣列,這個 points 陣列裏面存放的就是我們想要的 point 資料點物件。

如果需要獲取某個具體的資料點物件,則需要指明該資料點的索引 pointIndex,pointIndex 從 0 開始計數

範例

chart.series[0].points,可獲取第一個系列下的所有資料點集合。那麼如果想拿到圖表下所有資料點的集合該怎麼做呢?只需要一個簡單的遍歷操作便可以完成:

var PieChart=FR.Chart.WebUtils.getChart("A1").getChartWithIndex(2);
var points = [];
PieChart.series.forEach(function (ser){
    points = points.concat(ser.points);
})
console.log(points);
行動端不支援行動端

資料點物件中的屬性

某些場景下,需要的可能只是滿足某一特定條件下的一類資料點集合,這時可以透過 Array.filter 來指定過濾條件,進而篩選出想要的資料點集合。這裏對資料點物件中的某些屬性做一下介紹,編寫過濾條件的時候需要使用:

屬性    含義
point.name資料點的名稱
point.seriesName資料點對應的系列名稱
point.category資料點對應的分類名
point.value資料點的值
point.isVisible判斷資料點是否可見
chart.showTooltip(point)觸發資料點提示

範例:篩選值大於 0.1 的資料點的集合,寫法如下:

var PieChart=FR.Chart.WebUtils.getChart("A1").getChartWithIndex(2);
var points = [];
PieChart.series.forEach(function (ser){
    points = points.concat(ser.points);
})
points = points.filter(function (p)return p.value > 0.1; })


附件列表


主題: 二次開發
  • 有幫助
  • 沒幫助
  • 只是瀏覽
  • 圖片不清晰
  • 用語看不懂
  • 功能說明看不懂
  • 操作說明太簡單
  • 內容有錯誤
中文(繁體)

滑鼠選中內容,快速回饋問題

滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。

不再提示

10s後關閉

獲取幫助
線上支援
獲取專業技術支援,快速幫助您解決問題
工作日9:00-12:00,13:30-17:30在线
頁面反饋
針對當前網頁的建議、問題反饋
售前咨詢
業務咨詢
電話:0933-790886或 0989-092892
郵箱:taiwan@fanruan.com
頁面反饋
*問題分類
不能為空
問題描述
0/1000
不能為空

反馈已提交

网络繁忙