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是在表点击修改后,实际表的列数(第几列)

补充:这个方法取得值,长度是30,暂未找到解决方法,如果数据大于30行(或分组维度大于30),不建议使用

bd.push('@9');
wd.push('@10')

后缀:   根据业务需求写,可以放在Echarts中试运行 http://echarts.baidu.com/examples/

for(var i = 0;i<bd.length;i++){

   var bdvalue = bd[i].replace(/&nbsp/g,0)  //这里根据输出内容替换成需要的东西(我这里输出的是空格的字符串&nbsp,替换成0

  bdData += parseInt(bdvalue);

}

for(var i = 0;i<wd.length;i++){

   var wdvalue = wd[i].replace(/&nbsp/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>

运行效果:

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
1 目录 1 ORACLE BIEE基础 1 1.1 OBIEE 概述 1 1.1.1 BIEE 历史 1 1.1.2 数据模型 1 1.2 BIEE 安装 2 ... 1.3 配置 7 1.3.1 安装后的目录 7 1.3.2 几个重要的配置文件 7 1.4 预览Demo效果 8 1.4.1 启动BI服务和OC4J 8 1.4.2 打开BIEE仪表盘 8 2 BIEE 开发步骤 10 2.1 数据库 10 2.1.1 安装数据库 10 2.2 创建资料库 10 ... 2.3.4 新建主键和外键 15 2.4 创建逻辑模型 17 2.4.1 创建逻辑层 17 2.4.2 查看逻辑层 18 2.4.3 修改逻辑层 18 2.5 创建展现模型 19 2.5.1 创建展现层 19 2.6 保存资料库 20 ... 2.7.2 重启Oracle BI Server 22 2.8 Answers – 答复 22 2.8.1 登陆BI Dashboards 22 2.8.2 选择主题 23 2.8.3 预览报表 24 2.8.4 新建文件夹 25 2.8.5 保存报表 26 2.9 Dashboards – 仪表盘 26 2.9.1 创建仪表盘 26 ... 3.1 列 30 3.1.1 新建报表 30 3.1.2 列属性 31 3.1.3 fx-编辑属性 31 3.1.4 添加筛选器 32 3.1.5 最终效果 33 3.2 答复 34 3.2.1 Prompts-报表提示 34 3.2.2 Title-标题 34 ... 3.2.7 Chart-图表 39 3.2.8 Pivot Table-数据透视图 40 3.2.9 Gauge-计量表 40 3.2.10 Column Selector-列选择器 42 3.2.11 View Selector-视图选择器 42 4 Dashboard详细介绍 44 4.1 仪表盘设置 44 4.1.1 管理 44 4.1.2 我的账户 44 4.2 仪表盘功能 44 ... 4.2.4 Text-文本 47 4.2.5 Briefing Book-简要簿 48 4.2.6 Folder-文件夹 50 4.2.7 Guided Nav. Link-引导导航 链接 50 4.2.8 Briefing Book Nav. Link-工作簿导航 链接 51 4.2.9 BI Publisher 报表 52 4.2.10 条件显示内容 52 5 Delivers介绍 54 5.1 Scheduler 配置 54 5.1.1 安装计划表 54 5.1.2 配置Job Manager 54 5.1.3 添加用户认证 56 5.1.4 查看Scheduler 57 5.2 Delivers应用 58 5.2.1 编辑我的客户 58 ... 6.1 钻探 64 6.1.1 修改维度表 64 6.1.2 创建维度 66 ... 6.3.1 修改物理层 74 6.3.2 修改连接池 75 6.3.3 创建回写模板 75 ... 等等 -- 说明 该资料可从网络搜索.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值