分類坐標軸顯示數值指標

1.1 應用場景

有時候我們需要對圖表的分類坐標軸設定具體的指標，以便了解當前工作的實際進度，效果如下圖所示：

1.2 實現思路

自訂 X 軸的軸標籤格式，透過API函式FR.remoteEvaluate( formula )和內建報表函式VALUE(tableData,targetCol,orgCol,element)實現。

2.1 資料準備

1）建立普通報表，建立內建資料集 ds1，如下圖所示：

2）建立內建資料集 ds2，其中的 percents 欄位是各銷售員銷量佔總銷量的佔比，如下圖所示：

2.2 插入圖表

合併一片區域儲存格，插入柱形圖，如下圖所示：

2.3 綁定資料

綁定柱形圖資料，用於顯示每個銷售員每種產品的銷量情況，如下圖所示：

2.4 自訂軸標籤

點選「樣式>坐標軸>X軸」，軸標籤格式處點選「自訂」按鈕，填入 JavaScript 程式碼後，要選擇「使用html解析正文內容」，如下圖所示：

JavaScript 程式碼如下：

function(){ 
        //value函式傳回百分比資料，傳回經過計算的公式的結果
        var a=(FR.remoteEvaluate("value('ds2',2,1,'" + this+ "')")*100).toFixed(1); 
        //軸標籤同時顯示分類名和百分比，且韓文和張武的軸標籤為紅色
        if(this=='韓文'||this=='張武'){
        return "<font color='red'>"+this+"："+a+"%"+"</font>"     }else{
        return this+"："+a+"%";
    }
}

2.5 效果預覽

2.5.1 PC端

儲存範本，點選分頁預覽，如下圖所示：

2.5.2 行動端

同時支援 App 端和 H5 端，效果如下圖所示：

點選下載範本：分類坐標軸顯示數值指標.cpt

預覽範本，如果出現彈窗“此呼叫存在安全風險，如需使用請在安全管理中修改腳本呼叫公式限制”，且資料出現“NaN%”，如下圖所示：

那麼需要登入數據決策系統，點選管理系統>安全管理>安全防護>腳本呼叫公式限制，關閉該功能，如下圖所示：