百度开源的ECharts有样式丰富且美观的报表类型可供选用,可以将其集成至EBS请求输出的Html报表中,这其实就是一个生成Html数据的过程。
定义输出类型为HTML的请求我就不在此处赘述。
 
我们以ECharts中最简单的报表举例http://echarts.baidu.com/examples/editor.html?c=line-simple
其完整的html内容如下:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ECharts</title>
<!-- 引入 echarts.js -->
<!-- <script src="echarts.min.js"></script> -->
<!-- -->
<script src="http://echarts.baidu.com/dist/echarts.min.js"></script>
</head>
<body>
<!-- 为ECharts准备一个具备大小(宽高)的Dom -->
<div id="main" style="width: 600px;height:400px;"></div>
<script type="text/javascript">
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('main')); // 指定图表的配置项和数据
var option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line'
}]
}; // 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>
使用fnd_file.put_line(fnd_file.output, p_msg)其集成至EBS输出;
此处p_msg即完整的html内容。
此例子只是一个简单的sample。
 
注意:
1.代码中的js引用源为百度官网的js,如果你所在的环境不允许连接外网,则可以利用内网环境构建自己的js服务。
2.ECharts报表重要的无非就两个方面,设计好样式以及生成相应的option内容对应的json数据。
所以:样式部分交由专人处理,option内容建议不要直接使用数据库生成,而是做成Restful API服务,这样方便以后做成外部报表系统是可以直接使用该服务,plsql中使用utl_http包调用该服务获取相应的option内容
3.html的各种标签建议写成公共包来处理。
4.由于ECharts本身的原因,好像对IE浏览器的兼容不够友好,请使用兼容性较好的浏览器。

EBS 请求输出Html报表集成Echarts的更多相关文章

  1. EBS 查看输出HTML报表问题总结

    问题一: 请求输出格式为HTML(如下图,默认浏览器输出),希望 查看输出 的时候能够实现excel输出. 解决方法: 路径:系统管理员/安装/浏览器选项 注:维护如下记录 文件格式:HTML    ...

  2. 在OAF页面中集成ECharts以及highcharts用于显示图表

    历史博文中有讲解在请求中输出基础图表的方式,见地址:EBS 请求输出Html报表集成Echarts 本文讲述在OAF中集成这两类图表. 集成的基本思路:在OAF页面中加入一个rawText组件,在ra ...

  3. EBS中 EXCEL 格式报表输出的公用API

    http://blog.itpub.net/10359218/viewspace-752601/ 最近的项目上写了一个公用的API,很久以前就用EXCEL发布过报表,但从没想过写API来简化...   ...

  4. 5.把报表集成到Web应用程序中-生成网页和导出两种方式

    转自:https://wenku.baidu.com/view/104156f9770bf78a65295462.html 第四部分,把报表集成到Web应用程序中 用MyEclipse新建一个Web ...

  5. Oracle EBS Report 输出字符字段前部"0"被Excel自动去掉问题

    Oracle  EBS 提供多种报表的开发和输出形式,由于MS Excel在处理数据方面的优势明显,报表输出用Excel打开是很常见的开发项. 但是正是由于Excel的"过于智能而不智能&q ...

  6. 11月23日《奥威Power-BI报表集成到其他系统》腾讯课堂开课啦

    听说明天全国各地区都要冷到爆了,要是天气冷到可以放假就好了.想象一下大冷天的一定要在被窝里度过才对嘛,索性明天晚上来个相约吧,相约在被窝里看奥威Power-BI公开课如何?        上周奥威公开 ...

  7. xBIM IFC 输出 Excel 报表

    目录 xBIM 应用与学习 (一) xBIM 应用与学习 (二) xBIM 基本的模型操作 xBIM 日志操作 XBIM 3D 墙壁案例 xBIM 格式之间转换 xBIM 使用Linq 来优化查询 x ...

  8. vue-cli +echarts-amap集成echarts和高德地图TypeError: Cannot read property 'dataToPoint' of null解决方案

    由于项目的需求,需要做一种迁徙效果, 最后我们采用了组件化开发,可以说这个坑自己一个人踩,有点累,但也收获不少. vue-cli +echarts-amap集成echarts和高德地图,出现报错,错误 ...

  9. vuejs集成echarts的一些问题

    最近在做Beetlex的数据分析平台,在开发这个产品过程中涉及到大量的数据图表展示功能:由于产品前端使用的是vuejs开发,所以在集成echarts或多或少会碰到一些问题,在这里主要讲解一下碰到的问题 ...

随机推荐

  1. 15.1-uC/OS-III资源管理(锁调度器)

    1.大部分独占资源的方法都是创建临界段:1) 关中断方式2) 锁调度器方式3) 信号量方式4) mutex方式 2.独占共享资源的最快和最简单方法是关中断 然而,关/开中断是和CPU相关的操作,其相关 ...

  2. JDBC连接MySQL与Oracle

    JDBC连接MySQL .JDBC连接Oracle (跳转) JDBC连接MySQL import org.junit.Test; import java.sql.*; /** * JDBC连接MyS ...

  3. app优化篇

    UIImageView高效加个圆角 一般通过clipsToBounds和layer.cornerRadius会强制Core Animation提前渲染屏幕的离屏绘制,影响性能. 通过贝塞尔曲线切割图片 ...

  4. CoreData 执行executefetchrequest卡死解决办法

    在大量使用GCD和block以后发现程序会卡死在executefetchrequest执行. 反复测试无果.添加锁也无效.想来想去没发现问题. 容忍了就当人品问题.2天以后实在忍无可忍. 替换perf ...

  5. 如何用VSCode手动编译Ace Editor

    对于习惯微软VS的用户,可能很不习惯开源社区兴起的前端开发流程.随着NodeJs的兴起,JavaScript已经成为Github上开源项目最多的语言.使用微软提供的VSCode可以很好地利用这些开源项 ...

  6. Spring框架第二天

    ## Spring框架第二天 ## ---------- **课程回顾:Spring框架第一天** 1. 概述 * IOC和AOP 2. 框架的IOC的入门 * 创建applicationContex ...

  7. C# Newtonsoft.Json JsonSerializerSettings 全局序列化设置

    Newtonsoft.Json.JsonSerializerSettings setting = new Newtonsoft.Json.JsonSerializerSettings(); JsonC ...

  8. wingIDE Pro6 破解教程

    亲测wingIDE pro6.0.6-1激活成功 算号器下载 激活的时候选择第三项 打开算号器,获得license id 把算号器里的license id输入到第一步的输入框里 continue得到r ...

  9. CentOS 7 搭建CA认证中心实现https取证

    CA认证中心简述 CA :CertificateAuthority的缩写,通常翻译成认证权威或者认证中心,主要用途是为用户发放数字证书 功能:证书发放.证书更新.证书撤销和证书验证. 作用:身份认证, ...

  10. zw量化交易·实盘操作·系列培训班

    参见: <zw量化交易·实盘操作·系列培训班> http://blog.sina.com.cn/s/blog_7100d4220102w0q5.html