暂无图片
暂无图片
暂无图片
暂无图片
暂无图片

在Oracle APEX高级特性分享:AJAX异步动态刷新图表

1776

什么是APEX?  


APEX是Oracle提供的一个”极“速Web开放平台,注意是极速。APEX的web应用搭建速度是秒杀任意开源web框架。


APEX可以做什么?

应用程序构建器(Application Builder)—创建数据库驱动的动态web应用程序。在APEX的源代码库中,几乎包含90%以上的企业办公应用类型。从项目管理,流程管理,事件管理,客户管理,文件库,无所不含。绝大部分页面的开发,可以copy-paste-edit 完成。所有的web开发都是拖拽式的,和用SQL,PL/SQL完成的。当然也提供了编写JS,CSS,以及jquery的调用接口。

SQL工作室(SQL Workshop)—浏览数据库对象,运行SQL查询、PL/SQL程序以及图形化的查询构建器。

实用程序(Utilities)—允许从纯文本和电子表格上载和下载数据。所谓上载数据是指将文本文件或电子表格中的数据导入到数据库中。所谓下载数据是指将数据库中的数据保存到文本文件或电子表格中。


为什么我选择了APEX?

首先我过去是使用J2EE,MVC框架的。在某次个人项目中,我和同事准备创建一个WEB应用,我负责后台应用的开发,我同事使用开源的框架,在4个月以后,同事提交了一个勉强可用的demo。可见在繁忙的工作之余,要掌握全栈工程师的知识,是非常困难的,要熟悉另外一个领域是要花费很多时间的。后来在公司年终分享session前一周,发现demo无法正常运行。于是突然想到用APEX重新开发,其实就是www.dbfine.net这个网站,于是立刻利用APEX 代码库中的文件管理APP,花了30个小时,大于4个人天时间,即完成了网站的开发。大家可用guest/oracle955自由访问该网站。

APEX已经涵盖我所需要的基础构架,包括用户管理,后台管理,WEB框架设计,图表,表单,报表,上传,下载...等绝大部分WEB的功能,我只需要关注我的业务逻辑即可。

从此APEX成为了我自动化工作中,必不可少的工具。

你可能要问既然APEX这么好?为什么国内很少听说呢?


这和我们国内的IT风气有关,APEX在国外是使用非常广泛的技术,在国内总体喜欢追求最有噱头的技术,而不是最实用的技术,什么技术谈得出来风投,忽悠得出来更多的IT预算,就拼命的忽悠某种技术,或者把大厂用的某些技术盲目跟风。现在说到待建WEB平台,肯定要开源,不用10来个框架/库都不好意思出门。其实对企业来说,最适合你的业务的技术,才是最佳的技术。


说了这么多APEX的优点,这里我再说几句APEX的缺点,APEX是一个高度封装后的重数据库WEB应用,这种构架非常的古老,虽然APEX应用也是把war包部署到web server,但是APEX的web框架的定义是存储在数据库层的!!(是不是觉得匪夷所思),现代WEB应用的性能设计的原则一般是减少和数据库的交付,所以在中间层有各种,多级的缓存技术,而APEX是纯粹的比最老式的3层MVC构架,还要重数据库的一种构架。但这样也带来一个极大的优点,数据库管理员仅仅利用SQL, PLSQL即可开发出漂亮的Web应用。

那么APEX是否能适应现代企业呢?答案是Yes,随着硬件性能的突飞猛进的发展,APEX重数据库的这点性能损耗,已经完全被抵消的干干净净,80%以上的企业应用是完全可以使用APEX技术来承载了,一个典型的例子就说Oracle公司自己内部上千个系统,很多都是由APEX创建的,说明APEX在世界500强企业里面运作得非常理想,更别说用于开发自动化运维的系统了。


平心而论,APEX的确不适合大规模的互联网应用。它本来是为企业而生的。


本次分享APEX高级开发中的一个特性,动态异步刷新图表,即可用用APEX实现大部门监控类应用中大屏幕滚动刷新(不刷页面,只刷图表)的核心功能。

以下demo展示了企业120天以前的数据库空间使用总量,点击自动刷新按钮以后,每秒钟减少5天,刷新图表,知道刷新到当前时间。从而动态形象的了解空间的增加情况。

这里我们用到的主要特性为:dynamic action,是APEX提供的AJAX调用(封装后),同时APEX也可以自由实现JS和Jquery的AJAX调用,除非你精通JS,否则使用dynamic action是最便捷有效的异步调用方式。详细内容可以参考APEX USER GUIDE的14章。

创建图表的过程略过不提。我们在图表的基础上,创建第一个按钮用于手工点击演示趋势,该按钮的作用是:点击一次图表时间则变化5天,图表动态异步刷新。为按钮添加事件选择为 dynamic action

在页面放置一个TextFile用于显示日期的变化量

在该按钮上创建三个action

第一个action执行PL/SQL,:P1_HISTDAY是图表SQL的关键时间条件的值,点击一次它自减少5天。从而实现变化。

:P1_HISDAY:=:P1_HISDAY-5;


第二个action,将TEXTFIELD的值设置为P1_HISTDAY,在页面显示

第三个action,调用AJAX异步刷新图表

这样点击按钮“显示趋势” 可以进行手工的异步刷新图表。

下面开始添加自动的图表刷新,这里要利用到JS和Jquery,添加另外一个按钮“自动演示”,设置按钮的action

action为运行JS函数  autorefresh(); 这个函数我们还没有开始定义,下面开始:

点击页面root部份,在属性中找到并编写function和global variable 部分


输入以下代码,代码的意思是每隔1秒触发按钮“显示趋势”的click事件,循环触发20次。也就是说可以演示20秒。每次是递增5天,也就说点击一次自动演示,可以演示100天的趋势,100天演示完成以后,需要重新点击。

利用Jquery选择器,选择按钮“显示趋势”(静态ID为show_trend,可以在页面属性设置,也可以查看源代码看到)

function autorefresh(){

    for(var i=0;i<20;i++){

        (function(i){

            setTimeout(function(){

                $(show_trend).click();

            },(i+1)*1000);

        })(i)

    }

}

保存页面以后,点击自动演示,图表即可“动起来”~

可在APEX中AJAX的实现只是几个拖拽和聊聊数行代码而已。

大家可以利用该特性,去实现更多的酷炫功能!


最后在这里为空间管理服务小小的打个广告,利用APEX将企业几百甚至上千个数据库的数百TB,甚至PB级别的空间都管理起来,实现空间智能管理,冷数据运维,压缩表推荐,空间回收分析,高可用分析,资源状态平方,IO趋势分析等等高级功能,你需要的仅仅是一名的工程师不到一个月的人天服务,即可部署全部功能,定制开发新的需求。



文章转载自西区O记重案实录,如果涉嫌侵权,请发送邮件至:contact@modb.pro进行举报,并提供相关证据,一经查实,墨天轮将立刻删除相关内容。

评论