采集指标动态图像的处理方法技术

技术编号:3799172 阅读:274 留言:0更新日期:2012-04-11 18:40
采集指标动态图像的处理方法,综合使用Flash、JavaScript、XML技术来架构一个模型-视图-控制MVC数据展示模型,其中Flash充当视图层,JavaScript充当控制层,XML充当模型层。本发明专利技术采用了发展强大的Flash技术、XML技术、加上Ext技术,Ext为最新JavaScript类库,通过MVC架构生成采集指标动态图像的处理方法,寻找到最合理的集成方式,对各技术的优点充分融合,展示界面美观、能动态实时获取数据、无需刷新页面用户体验好。

【技术实现步骤摘要】

本专利技术涉及浏览器-服务器B/S架构下的数据图形化展示和动态交互,具体为一种。
技术介绍
浏览器-服务器B/S架构下的图形化技术有Adobe的SVG和Flash、MicroSoft的VML。 SVG是Adobe公司研发的,并且是W3C推荐的矢量图形标准,使用类似于XML的语法来描述矢量图形。优点是存储空间小,便于网络传输。缺点是SVG技术在浏览器端的绘图要求用户安装插件,而且由于Adobe公司从去年开始停止了对SVG插件的升级,这项技术应用前景不太明朗。 VML是Microsoft公司推出的矢量图形技术,优点是由IE浏览器直接支持,不需要用户安装插件。缺点是只有IE浏览器支持这项技术,其它浏览器无法查看VML描绘的图形。另一方面,Microsoft在IE5之后也已经停止了对这一技术的更新。 Adobe收购MacroMedia公司后大力推行Flash技术,这项技术结合目前Adobe的Flex,成为RIA(网络富客户端应用)的一支重要的力量。优点是图形表现力强,用户满意度高。缺点是技术相对比较复杂,学习周期长,与其他的技术融合性不强。 在业务支撑网管系统项目中,已用到的展示技术有SVG (Scalable VectorGraphics) 、 VML、 XML和Ext技术。 由于以上技术都存在各自不同的缺点,无法完全满足客户的需求,这些缺点对于采集指标动态图像处理方案的实现造成了很大的阻力。 在采集指标动态图像处理方面,目前没有专业的产品级解决方案,基本都是融合多项技术形成的综合体。业内比较常用的有塞瓦的twaver,优点是展现效果非常绚丽,交互性比较强;缺点是客户端资源消耗严重,无法支撑大量的图形。另外,交互方式采用服务器端全局刷新的方式,对服务器端也有很大压力。
技术实现思路
本专利技术要解决的问题是目前采集指标动态图像处理上,没有专业的解决方案,所用的技术代码量太多,因为是脚本和标签的混合技术,所以代码量比较大;存在很多不符合规范的语法,不易封装;另外还有交互性不强、运行效率低下、代码调试跟踪不方便、表现力不强的缺点,各种技术组成的综合体资源消耗大,无法支撑大量的图形。 本专利技术的技术方案为,综合使用Flash、JavaScript、XML技术来架构一个模型_视图_控制MVC数据展示模型,其中Flash充当视图层,JavaScript充当控制层,XML充当模型层;对于需要动态展示的采集指标对象,首先使用Flash技术开发所需的动态矢量指标图像,然后指定该采集指标对象所要用到的动态矢量指标图像,通过JavaScript向该动态矢量指标图像传递采集指标对象所要展示的采3集指标参数及该动态矢量指标图像展示所需的其他参数,并向动态矢量指标图像传递刷新周期和数据请求地址,由动态矢量指标图像在内部定时去请求数据来实现指标数据采集的动态性和实时性,其中动态矢量指标图像的数据源格式为XML格式。 对于指针旋转式的动态图象,首先将获得的数据值转化成角度值,计算目标角度与当前角度的差值,根据差值的符号决定旋转的方向是顺时针还是逆时针,使用定时器,每隔设定的周期让指针向目标角度旋转一个设定的角度,指针向目标角度旋转,每次移动的角度为角度差a的自然对数loga。 对于曲线绘制式的动态图象,首先根据整个图形的宽度width计算x轴能绘制的数据最大范围xMax,通过width/xMax计算x轴归一化的像素数,使用两个数组xValues和yValues来模拟一个先进先出FIFO队列,用以存放当前点的x、y坐标值;开始绘制曲线时,先取得各数组第一个值xO、y0,然后探测相应的下一个值xl、yl是否有值,如果有值,将x0、y0与xl、yl连接成一段小线段,再取下面的值继续相同步骤,直至没有值可取,通过得到的小线段绘制出整个曲线;在动态获取数据时,如果曲线所占宽度超过整体图形宽度,切去最先绘制的部分,曲线整体向曲线更新方向的相反方向位移,将最新的数据增加到曲线末尾,呈现动态更新效果。 对于温度计式的动态图象,根据获得的数据,其中的计量线按比例动态升降;同时设定一个以上的告警阀值,由告警阈值划分出的不同段采用不同的颜色。 对于数码管式的动态图象,采用数字显示器的形式进行显示。 本专利技术采用了发展强大的Flash技术、XML技术、加上Ext技术,Ext为最新JavaScript类库,通过MVC架构生成,寻找到最合理的集成方式,对各技术的优点充分融合,展示界面美观、能动态实时获取数据、无需刷新页面用户体验好。本专利技术还具有以下优点 (1)、编码效率提高 SVG与VML没有专业的开发工具,编码效率比较差,而Flash有Adobe提供的企业级开发工具Flash CS4以及FlexBuilder,无论是编码还是跟踪调试都很方便; (2)、执行效率提升 由于flash是经过编译之后的swf文件,它的执行效率比vml和SVG这种解释型脚本执行效率好很多;Vml和SVG在动态创建对象时对资源的消耗比较严重,客户端CPU和内存占用很大,swf文件在这方面有大幅的性能提升,同等情况下粗略统计,CPU占用情况能提升l倍以上; (3)、融合flash与javascript 由于Flash的安全限制以及浏览器的沙箱模型,Flash与JavaScript脚本之间的互相调用非常繁琐,用户需要通过一系列的安全配置来更改浏览器的"安全级别"。这种做法显然不够有好。因此,本专利技术采用开源组件SwfObject来脚本化flash。通过两种方式来进行html页面与flash进行交互初始化参数由SwfObject传递,其他数据通过flash的URLLoader通过网络进行传递。 这样,避开flash与javascript脚本之间互相调用的安全限制问题。同时,由于有Ext这个脚本库的强大支撑,flash不是固定在网页中的,而是根据页面的需要可以使用javascript来进行浮动显示、随意拖拽、整体縮放等。 另外一方面,由于javascript与浏览器以及DOM融合性很强,这样就可以让页 面中的其它非flash对象与flash进行交互。采用这种方法还可以把flash的开发与 javascript脚本、页面标签的开发分离开来,从而可以进行并行开发。 (4)、紧密封装、松散耦合 指针旋转式的仪表盘、温度计式的数据展示器、动态曲线绘制器、数码管式的数据 展示器,这些组件是互相独立的,只通过URL请求向服务器获取数据,因此撤换或改动其中 的任意一个或多个组件不会对整体视图产生影响。 如果有算法更新或者bug修正,只需要简单地拷贝新的flash覆盖进来即可,无需 改动任何代码。具体实施例方式下面具体说明本专利技术的实现方法。 (1)、总体的参数和数据传递方法 对于需要动态展示的采集指标对象,首先使用Flash技术开发所需的动态矢量指 标图像,然后指定该采集指标对象所要用到的动态矢量指标图像,通过JavaScript向该动 态矢量指标图像传递采集指标对象所要展示的采集指标参数及该动态矢量指标图像展示 所需的其他参数,并向动态矢量指标图像传递刷新周期和数据请求地址,由动态矢量指标 图像在内部定时去请求数据来实现指标数据采集的动态性和实时性,其中动态矢量指标图 像的数据源格式为XML格式。 (2本文档来自技高网
...

【技术保护点】
采集指标动态图像的处理方法,其特征是综合使用Flash、JavaScript、XML技术来架构一个模型-视图-控制MVC数据展示模型,其中Flash充当视图层,JavaScript充当控制层,XML充当模型层;对于需要动态展示的采集指标对象,首先使用Flash技术开发所需的动态矢量指标图像,然后指定该采集指标对象所要用到的动态矢量指标图像,通过JavaScript向该动态矢量指标图像传递采集指标对象所要展示的采集指标参数及该动态矢量指标图像展示所需的其他参数,并向动态矢量指标图像传递刷新周期和数据请求地址,由动态矢量指标图像在内部定时去请求数据来实现指标数据采集的动态性和实时性,其中动态矢量指标图像的数据源格式为XML格式。

【技术特征摘要】

【专利技术属性】
技术研发人员:潘华贾代乾张有根李华梁斌
申请(专利权)人:南京联创科技集团股份有限公司
类型:发明
国别省市:84[中国|南京]

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1