OBIEE使用Echarts實現圖形效果
背景：使用BI的自帶圖形（下圖）時，度量與切片等不能滿足我們需求時，可以試試Echarts實現
使用其他檢視的敘述整合Echarts
實現過程：
簡單實現一個
字首：
<!DOCTYPE html> <html>
<head> <meta charset="utf-8"> <title>ECharts</title> <!-- 引入 echarts.js --> <script src="/AnalyticsRes/echarts.min.js"></script> </head>
<body> <!-- 為ECharts準備一個具備大小（寬高）的Dom --> <div id="main" style="width: 890px;height:320px;"></div> <script type="text/javascript"> // 基於準備好的dom，初始化echarts例項 var myChart = echarts.init(document.getElementById('main')); var bd = []; var wd= []; var bdData= 0; var wdData= 0;
敘述： 注意：這裡的@9和@10是在表點選修改後，實際表的列數（第幾列）
bd.push('@9');
wd.push('@10')
for(var i = 0;i<bd.length;i++){
var bdvalue = bd[i].replace(/ /g,0) //這裡根據輸出內容替換成需要的東西(我這裡輸出的是空格的字串 ,替換成0
bdData += parseInt(bdvalue);
}
for(var i = 0;i<wd.length;i++){
var wdvalue = wd[i].replace(/ /g,0)
wdData += parseInt(wdvalue);
}
//我用的餅圖
option = { title : { text: '本地/外地', subtext: '地區結構', x:'center' }, tooltip : { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, legend: { orient: 'vertical', left: 'left', data: ['本地','外地'] }, series : [ { name: '來源', type: 'pie', radius : '55%', center: ['50%', '60%'], data:[ {value:bdData, name:'本地'}, {value:wdData, name:'外地'} ], } ] };
// 使用剛指定的配置項和資料顯示圖表。 myChart.setOption(option);
</script> </body>
</html>
執行效果：
