企業(yè)中不同角色的人在看數(shù)據(jù)時(shí),關(guān)心的詳盡程度往往各有不同,管理者更關(guān)注粗粒度、如每個(gè)月的表現(xiàn),一線(xiàn)運(yùn)營(yíng)人員則會(huì)希望看到每一天的表現(xiàn)。那么分析師應(yīng)該如何只用一張報(bào)表來(lái)同時(shí)滿(mǎn)足不同用戶(hù)的需求呢?
下面的做法將幫助您解決動(dòng)態(tài)維度轉(zhuǎn)換,通過(guò)腳本函數(shù)的編寫(xiě),實(shí)現(xiàn)餅圖上下鉆取、圖表動(dòng)態(tài)綁定維度列、多維能力指數(shù)分析等功能場(chǎng)景,隨心所欲替換展示不同需求。
01 餅圖下鉆
內(nèi)容描述:
通過(guò)超鏈接進(jìn)行頁(yè)面刷新并傳參,在全局腳本中的變化時(shí)運(yùn)行進(jìn)行判斷是下鉆效果還是上鉆效果,并改變餅圖綁定參數(shù)列。
圖片展示:
效果描述:
通過(guò)點(diǎn)擊總銷(xiāo)量中的某省份部分餅圖,跳轉(zhuǎn)到省份下各市所對(duì)應(yīng)的數(shù)據(jù)餅圖,再次點(diǎn)擊餅圖跳轉(zhuǎn)回總銷(xiāo)量圖。
腳本部分:
if (param["省份"]==x) //設(shè)置判斷所在層參數(shù) {param["省份"]=null} if (isNull(param["省份"])) //判斷實(shí)現(xiàn)效果是上鉆或下鉆 {var x=param["省份"] //上鉆設(shè)置 var bcol = new BCol("省份", STRING, true); //初始化維度列 var qcol = new ChartDimCol(bcol); 圖表1.binding.markCol["Sum_銷(xiāo)量"].colorField = qcol; //設(shè)置標(biāo)記組中顏色綁定的列 圖表1.binding.markCol["Sum_銷(xiāo)量"].textField = qcol; //設(shè)置標(biāo)記組中標(biāo)簽綁定的列 圖表1.xtitle.title='總銷(xiāo)量'} //設(shè)置組件標(biāo)題 else {var x=param["省份"] //下鉆設(shè)置 var bcol = new BCol("地市", STRING, true); var qcol = new ChartDimCol(bcol); 圖表1.binding.markCol["Sum_銷(xiāo)量"].colorField = qcol; 圖表1.binding.markCol["Sum_銷(xiāo)量"].textField = qcol; 圖表1.xtitle.title=param["省份"]+'銷(xiāo)量'} |
02 圖標(biāo)動(dòng)態(tài)綁定
內(nèi)容描述:
該報(bào)告通過(guò)列表參數(shù)對(duì)柱狀圖的維度與度量的動(dòng)態(tài)綁定分別作了示例。
圖片展示:
效果描述:
通過(guò)右側(cè)的列表參數(shù)動(dòng)態(tài)綁定不同的維度與度量,實(shí)現(xiàn)不同指標(biāo)的多維展示。
腳本部分:
//變化時(shí)運(yùn)行 //維度動(dòng)態(tài)綁定 var arr = 列表參數(shù)1.getSelectedObjects(); //獲取列表參數(shù)的所選項(xiàng)存入數(shù)組arr中 function test(chart){ chart.binding.clearXCols(); //清空綁定維度 for(var i = 0; i < arr.length; i++){ //通過(guò)循環(huán)將所選項(xiàng)維度依次進(jìn)行綁定 var bcol = new BCol(arr[i],STRING,true); //創(chuàng)建一個(gè)底層字段 var dimCol = new ChartDimCol(bcol); //創(chuàng)建圖表所用的維度字段 chart.binding.addXCol(i,dimCol); //綁定維度字段 } } test(圖表1); //度量動(dòng)態(tài)綁定 var arr2 = 列表參數(shù)2.getSelectedObjects(); //獲取列表參數(shù)的所選項(xiàng)存入數(shù)組arr2中 function test2(chart2){ chart2.binding.clearYCols(); //清空綁定度量 for(var j= 0; j < arr2.length; j++){ //通過(guò)循環(huán)將所選項(xiàng)度量依次進(jìn)行綁定 var bcol2 = new BCol(arr2[j],DOUBLE,false); //創(chuàng)建一個(gè)底層字段 var measureCol2 = new ChartMeasureCol(SUM,bcol2); //創(chuàng)建圖表所用的度量字段 chart2.binding.addYCol(j,measureCol2); //綁定度量字段 } } test2(圖表2); |
03 多維能力指數(shù)分析
內(nèi)容描述:
該報(bào)告主要由三部分組成,企業(yè)對(duì)比選擇、指標(biāo)展示選擇、能力圖展示。通過(guò)列表參數(shù)組件通過(guò)選擇不同的選項(xiàng)動(dòng)態(tài)綁定雷達(dá)圖的維度與度量,實(shí)現(xiàn)不同能力不同公司的對(duì)比。
圖片展示:
效果描述:
通過(guò)左側(cè)的企業(yè)對(duì)比選擇動(dòng)態(tài)綁定不同的維度,實(shí)現(xiàn)不同企業(yè)或公司的對(duì)比,通過(guò)右側(cè)的指標(biāo)展示選擇動(dòng)態(tài)綁定不同的度量,實(shí)現(xiàn)不同指標(biāo)的多維展示。
腳本部分:
裝載時(shí)運(yùn)行: |
//創(chuàng)建設(shè)置變量 var arr1 = new Array(); var brr1 = new Array(); var list_total_len = 0; var index_1_len = index_1.getSelectedObjects().length; var index_2_len = index_2.getSelectedObjects().length; var index_3_len = index_3.getSelectedObjects().length; //將指標(biāo)選項(xiàng)寫(xiě)入數(shù)組arr1,并將選擇個(gè)數(shù)計(jì)入list_total_len if(index_1_len > 0){ for(i=0;i<index_1_len;i++){ arr1[i]=index_1.getSelectedObjects()[i] }; list_total_len = index_1_len }; if(index_2_len > 0){ for(i=0;i<index_2_len;i++){ arr1[i+list_total_len] = index_2.getSelectedObjects()[i]; } list_total_len = list_total_len + index_2_len; }; if(index_3_len > 0){ for(i=0;i<index_3_len;i++){ arr1[i+list_total_len] = index_3.getSelectedObjects()[i]; } list_total_len = list_total_len + index_3_len; }; //創(chuàng)建度量列,綁定度量列 if(list_total_len > 0){ 圖表1.binding.clearYCols(); //清空綁定度量 for(k=0;k < list_total_len;k++){ var acol = new BCol(arr1[k],DOUBLE, false); //初始化創(chuàng)建綁定列 var bcol = new ChartMeasureCol(NONE,acol,null); //創(chuàng)建圖表所用的度量字段 brr1[k] = bcol; //將創(chuàng)建好的度量字段綁定到brr1數(shù)組中 } var ld_col = new RadarMarkCol(brr1); //創(chuàng)建雷達(dá)字段 //給圖表的行軸增加字段,用戶(hù)需要指定增加字段的位置以及字段名 圖表1.binding.addYCol(1,ld_col); var ccol=new BCol("公司",STRING,true); var dcol=new ChartDimCol(ccol); //給圖表的分組增加字段,用戶(hù)需要指定增加字段的位置以及字段名 圖表1.binding.addGrpCol(1,dcol) 圖表1.binding.markCol[toString(arr1[0])].colorField=dcol; //綁定指標(biāo)字段 }; //保存變量 param['company_list_len']=company_total_len; param['index_list_len']=list_total_len; |
變化時(shí)運(yùn)行: |
//除了標(biāo)紅字段不同,其他部分與裝載時(shí)運(yùn)行一致 var arr1 = new Array(); var brr1 = new Array(); var list_total_len = 0; var index_1_len = index_1.getSelectedObjects().length; var index_2_len = index_2.getSelectedObjects().length; var index_3_len = index_3.getSelectedObjects().length; if(index_1_len > 0){ for(i=0;i<index_1_len;i++){ arr1[i]=index_1.getSelectedObjects()[i] }; list_total_len = index_1_len }; if(index_2_len > 0){ for(i=0;i<index_2_len;i++){ arr1[i+list_total_len] = index_2.getSelectedObjects()[i]; } list_total_len = list_total_len + index_2_len; }; if(index_3_len > 0){ for(i=0;i<index_3_len;i++){ arr1[i+list_total_len] = index_3.getSelectedObjects()[i]; } list_total_len = list_total_len + index_3_len; }; if(list_total_len > 0){ 圖表1.binding.clearYCols(); for(k=0;k < list_total_len;k++){ var acol = new BCol(arr1[k],toString(arr1[k]),DOUBLE, false); //創(chuàng)建綁定列 var bcol = new ChartMeasureCol(NONE,acol,null); brr1[k] = bcol; } var ld_col = new RadarMarkCol(brr1); 圖表1.binding.addYCol(1,ld_col); var ccol=new BCol("公司",STRING,true); var dcol=new ChartDimCol(ccol); 圖表1.binding.addGrpCol(1,dcol); 圖表1.binding.markCol[toString(arr1[0])].colorField=dcol; }; param['company_list_len']=company_total_len; param['index_list_len']=list_total_len; |
通過(guò)對(duì)以上三種使用場(chǎng)景的學(xué)習(xí)了解,相信各位數(shù)據(jù)分析師又豐富了自己的分析手段和能力,當(dāng)遇到用戶(hù)希望在一個(gè)組件中實(shí)現(xiàn)多維度轉(zhuǎn)換分析的時(shí)候,大家就可以使用以上腳本來(lái)實(shí)現(xiàn)用戶(hù)的需求。








暫無(wú)數(shù)據(jù)