《基于SSH框架的NC数据可视化验证系统研究.doc》由会员分享，可在线阅读，更多相关《基于SSH框架的NC数据可视化验证系统研究.doc（4页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、2018 年 1 月 15 日 第 41 卷第 2 期 166 DOI： 10.16652/j.issn.1004373x.2018.02.042 现代电子技术 Modern Electronics Technique Jan. 2018 Vol. 41 No. 2 基于 SSH 框架的 NC 数据可视化验证系统研究 杜景林，喻亚楠 （南京信息工程大学，江苏 南京 210044） 摘 要：为 了增强用户对 WRF 气 象模式数据的直观性认识 ，设计一种基 于 SSH框 架的 NC 数据可视化系统。该系统 允 许用户和数据之间进行交互读 取，使用颜色映射 函数将具体数据值映射成直观的颜色 ，结合
2、 WebGL 绘图技术实现 气象 数据 的形象显示，同时设计以时间、高度为变量的动画展示。利用 NCL 编码语言，对 NC 数据进行二次可视化，将两次可视化结果 进行对比，完成系统验证。实 验结果表明，该系统的可行性 可极大地提高气象工作 人员对 NC 数据动态变化的 直观把握，有 利于其做出相关决策。 关键词： NC 数据； WebGL； SSH 框架；可视化； NCL；系统验证 中图分类号： TN911 34 文献标识码： A 文章编号： 1004 373X（ 2018） 02 0166 04 Research on NC data visualization verification s
3、ystem based on SSH framework DU Jinglin， YU Yanan （ Nanjing University of Information Science & Technology， Nanjing 210044， China） Abstract： In order to enhance the users intuitive understanding of WRF meteorological mode data， an NC data visualiza tion system based on SSH framework is designed. The
4、 system allows interactive reading between users and data. The color map ping function is used to map specific data values into intuitive color elements. The images are displayed on the screen by combining WebGL drawing technology. An animation exhibition which uses time and height as the variables
5、is designed. The NCAR com mand language（ NCL） is adopted to realize the secondary visualization of NC data. The two visualization results are compared to accomplish the system verification. The experimental results shows that the feasibility of the system is proved， and meteorologi cal staff intuiti
6、ve control for dynamic changes in NC data is greatly improved which is conducive to making relevant decisions for meteorological staff. Keywords： NC data； WebGL； SSH framework； visualization； NCL； system verification 0 引 言 统，主要涉及 NC 数据解析读取，存入数据库，设计颜色 映射函数，分析WebGL 绘图技术，调用 NCL 绘图对可视 随着气象领域的发展，气象资料服务的需
7、求日益扩 大。目前，国内主要气象数据都用 NC 格式进行输出存 储管理，同时紧随着 NC数据的广泛使用，诞生了很多 NC 数据的分析处理软件，如 Excel 的插件 NETCDF.xlsmNC， 该插件可以直接读取 NC 数据，但也只能横向地显示数 据值，无法动态地显示数据之间的关联，用户无法直观 地感 受数 据意 义。 还有 一 些专 业的 处理 软件 ，比 如 Graphics，但都需要专业人士满足一定的专业技能才能 使用，用户的体验感不好。 为了提高用户的互操作性，以及对数据的 直观认 识，本文设计了基于 SSH 框架的 NC 数据可视化验证系 收稿日期： 2017 06 21 修回日期
8、： 2017 08 15 化结果进行对比验证，同时为了进一步满足用户的需 求，设计了时间和高度动画，动态地显示不同高度不同 时间的气象要素动态变化特点，有助于相关人员分析研 究。本系统后台采用 Java 语言结合 SSH 框架进行开发， 前端使用 HTML， JQuery， CSS 语言，绘图部分采用 Web GL 3D 绘图标准。 1 相关技术 1.1 NC文件介绍 NC 数据格式是由美国大学大气研究协会下 Unida ta 项目科学家针对科学数据的特点 ，提出的一种结构 基金项目：国家自然科学基金（ 41575155）；国家自然科学基金面上项目（ 60873026） Project Sup
9、ported by National Natural Science Foundation（ 41575155）， General Program of National Natural Science Foundation（ 60873026） 第 2 期 杜景林，等：基于 SSH 框架的 NC 数据可视化验证系统研究 6 167 化数 组数 据 。 NC 数 据全 称为（ Network Common Data 架 ，从职责上分为表示层、业务逻辑层、数据持久层，系 Format），中文译名为 “网络通用数据格式 ”。 NC 数据格 式由于自身的易用性、可追加性、平台无关性、高可用性 等特点
10、而受到气象领域的追捧。它本身的格式不固定， 能够根据使用者自身的需求去定义。一个 NC 数据集 包含维（ dimensions）、变量（ variables）和属性（ attributes） 三种描述类型，每种类型都会被分配一个名字和一个 ID，这些类型共同描述了一个数据 集。变量存储实际数 据，维给出了变量维度信息，属性则给出了变量或者数 据集本身的辅助信息属性 。目前，随着 NC 数据格式的 推广， NC 数据存储格式已经能够用于大气科学，地球物 理，海洋水文等诸多领域 。 1.2 WebGL 绘图 WebGL 是一个用于在 Web上生成三维图形的应用 编 程接 口 。 这 种 绘 图 技
11、 术 标准 允 许 把 JavaScript 和 OpenGL ES 2.0 结合 在一起，通 过增加 OpenGL ES 2.0 的一个 JavaScript 绑定， WebGL 可以为 HTML5 Canvas 提 供硬件 3D 加速渲染，这样 Web 开发人员就可以借助系 统显卡来在浏览器里更流畅地展示 3D 场景和模型 ， 还能创建复杂的导航和数据视觉化。 WebGL 工作流程 图如图 1所示。 图 1 WebGL 工作流程图 Fig. 1 Flow chart of WebGL working 1.3 NCL 绘图验证 NCL（ The NCAR Command Language）是
12、 一 种专 门 为科学数据处理以及数据可视化设计的高级语言，在 气象领 域科研工 作者一般 都选择 NCL 脚 本的绘图 方 法 。其中 NCL 脚本内置了很多用于解决气象领域问 题的调用函数，因此可以方便相关专业人员进行数据操 作，同时也因为它的相对专业性，使得普通用户的操作 体验并不友好。本系统采用 NCL 绘图结果与 WebGL 绘 图形成对比，体现本系统操作的严谨性。在 NCL 语言 编程中，一般使用命令行交互式或者批处理模式对数据 进行操作。以下 是 NCL 编程 5 个主要步骤：加载 库函 数；导入数据；打开绘图区；编辑可视化图显示效果；调 用绘图函数绘图。 1.4 SSH 框架
13、SSH 框架是比较经典的 Web 应用程序开源集成框 统的基本业务流程是：在表示层中，首先根据 JSP 页面 实现客户交互，负责发送请求（ Request）和接收服务器 响应（ Response） ；然后 Struts 根据配置文件（ struts con fig.xml）将 ActionServlet 接收到的 Request 委派给相应的 Action 处理。在业务层中，管理服务组件的 Spring IOC 容器负责向 Action 提供业务模型（ Model）组件和该组件 的协作对象数据处理（ DAO）组件完成业务逻辑 ，同时 Spring 容器提供事务处理，缓冲池等容器组件以提升系 统
14、性能和保证数据的完整性。而在持久层中，则依赖于 Hibernate 的对象化映射和数据库交互 ，完成对持久化 对象的操作，并且返回相应的处理结果。 2 系统设计 2.1 系统功能 该系统在前台设计相关展示页面，然后根据用户选 取的数据文件，选择的物理量（主要包括 QVAPOR（水汽 混合比）， QRAIN（雨水混合比）， QCLOUD（云水混合比） 等，以及时间维度（ 124），高度维度（ 149）将可视化 结果显示在网页端。由于不同物理量之间的属性不同， 所以需要根据前台用户点击的需求数据在后台进行调 用，进而传递给颜色传输函数进行映射，最终在前台进 行可视化显示。为了方便用户将对不同的气象
15、要素进 行对比，前台设计中考虑了多窗口不同要素之间同时进 行显示。同时考虑到用户能更直观地感受同一气象要 素在不同时间或不同高度维度情况下的区别，设计了时 间动画和高度动画进行连续展示。在前台调用数据库 进行 WebGL 绘图展示的同时，可以通过右击鼠标弹出 NCL 绘图验证模块，将 WebGL 绘图结果与 NCL 绘图结 果形成印证对比，验证整个系统的可行性。 2.2 NC数据流程 由于 NC 数据不能直接进行绘制，首先需要对 NC 格 式数据进行解析，然后将解析后的数据存入数据库，用 户点击具体物理量显示时，根据 Request 请求传递的物 理量，在后台对物理量进行区分，匹配出相应的物理
16、量 数值，将物体的数值传递给颜色映射方法进行映射，映 射结束后的数据以 Json格式传入 WebGL 的顶点数据缓 冲区（编写顶点索引）以及颜色缓冲区完成相应绘图，最 后将数据以可视化图的形式显示到 网页端。 2.3 颜色映射函数 在 NC 数据中，每一个不同的气象要素变量都是以 离散网格数组的形式存在的，数组中的数据值一般比较 连续，用户无法直观地感觉出数据值之间的差异 。因 此，本系统中设计了颜色映射函数，将输入的每个具体 2 3 4 5 7 168 现代电子技术 2018 年第 41 卷 的数据值转换为具体的可视显示的像素点，将所有的像 2.4.3 表现层 素点连接在一起以带有颜色的图显
17、示出来就可以直观 地判断数据之间的变化。以下是颜色映射函数设计思 路，图 2 是具体的颜色映射函数流程图。 1）在颜色映射函数中，先根据每个变量数据的索 引下标取出每一个数据值，遍历所有索引找出每一个变 量的最大最小值，并记录下对应的索引值，将最大的数 据值减去最小的数据值得出的结果平均分成 255 段，这 里的每一段都代表一种具体颜色。 2）根据 RGB 标准定义红橙黄绿蓝靛紫七种颜 色。 3）重新遍历数据值，并对数据值大小进行判别，将 每一个具体的数据值进行归类，在归类同时记录下相对 应的数据索引值，从而匹配不同的颜色数据值。 表现层主负责将业务逻辑层的数据进行界面显示， 根据用户的需求展
18、示不同的数据可视化方案，包括不同 要素不同高度不同时间的 WebGL 绘图显示，高度动画 控制，时间动画控制， NCL 绘图验证显示。 图 3 显示为系统架构图，图中标示了每个层需要实 现的功能。 图 2 颜色映射函数流程图 Fig. 2 Flow chart of color mapping function 2.4 系统架构 本文系统采用经典的 SSH 框架搭建整个系统平台， 分别是数据持久层、业务逻辑层、表示层，采用 MVC 分 层思想将数据处理、逻辑控制、数据显示三个功能 模块 分离，使整个系统结构清晰，耦合性低，便于后期维护。 2.4.1 数据持久层 图 3 系统架构图 数据持久层主
19、要封装 NC 变量数据的读取，利用 NC 文件提供的 Java 语言接口对数据进行解析，将所有的持 久化物理变量映射到底层数据表，然后通过 Hibernate 提供的 session 接口执 行被持 久化对 象的增 删改查 等 3 3.1 Fig. 3 系统实现 系统平台 System architecture diagram 系列操作，极大 地减少了程序员对底层数据库的直接 交互。 2.4.2 业务逻辑层 业务逻辑层主要根据用户请求，将具体的请求传递 给 Stuts.xml 配置文件，配置文件匹配对应的用户命令传 递给不同 Action 层， Action 层通过调用 Service 层，
20、Dao 层 对数据进行处理操作。本系统主要涉及 WebGL 绘图显 示以及 NCL 绘图验证模块，根据用户选择的气象变量 请求传递给不同的 Action 层，以及颜色映射函数处理后 的颜色数据，通过 Ajax 技术传递给 WebGL 绘图脚本进 行绘图处理，对于 NCL 绘图验证主要涉及将数据传递 给 NCL 绘图脚本，并最终发送到表示层，表示层将这些 数据进行可视化显示。同时这里使用了 Spring 容器，采 用注入方法，极大地降低了代码之间的耦合性，以及为 后期程序开发带来了极大的便利。 本系统 采用 MyEclipse 作为开发平 台。 MyEclipse 是一个多语言集成开发平台，支持
21、 Java， JQuery， CSS 等 一系列语言开发。 MyEclipse 同时具有友好的用户编程 界面，能自动对编写代码进行格式化操作，并伴有代码 提示功能。本系统在 MyEclipse 上进行前台页面设计， 后台逻辑处理的开发工作，数据库采用 MySQL 数据库 进行数据存储。 3.2 系统运行测试 图 4 是 系 统 界 面 运 行 的 时 间 高 度 均 为 1 的 QVAQOR（水汽）变量的 WebGL 以及 NCL 对比图。 左侧为具体的高度动画和时间动画控制台，可以根 据时间或者高度变量以动画的形式动态地显示同一气 象要素在不同高度或时间的动态变化效果，给 用户更直 观的体验
22、效果。图 4 主体部分为水汽值在同一高度同 一时间的 WebGL 动画与 NCL 显示图形，两种方法得到 第 2 期 杜景林，等：基于 SSH 框架的 NC 数据可视化验证系统研究 江西测绘， 2014（ 2）： 32 35. 169 的图形基本一致，验证了本系统的可靠性。 CHU Yawei. Information extraction and format conversion of 图 4 WebGL 及 NCL 对比验证图 NetCDF data based on GDAL J. Jiangxi surveying and map ping， 2014（ 2）： 32 35. 4 周
23、长江 . 数字城市 三维景观建 模及可视化技 术研究 D. 徐州： 中国矿业大学， 2014. ZHOU Changjiang. Research on 3D landscape modeling and vi sualization technology in digital city D. Xuzhou： China Uni versity of Mining and Technology， 2014. 5 王涵，李玲，孙学 庆，等 .CMACast 内蒙古气象信息 Web 平台 的 设计与实现 J. 气象科技， 2014， 42（ 2）： 283 286. WANG Han， LI Li
24、ng， SUN Xueqing， et al. Design and imple mentation of CMACast Inner Mongolia meteorological informa 4 Fig. 4 结 Contrast diagram of WebGL and NCL validation 语 tion Web platform J. Meteorological science 2014， 42（ 2）： 283 286. and technology， 围绕 NC 格式的气象数据，利用 WebGL 绘图技术， NCL 绘图验证技术，将它们封装成不同的绘图脚本，将 数据通
25、过颜色映射函数映射传递给不同的绘图脚本进 行绘 图，最 后通 过同 一高 度同 一时 间的 WebGL 以 及 NCL 绘图结果的相似性，验证整个系统的可行性，为相 关气象工作人员分析 NC格式的气象数据提供了动态分 析方法，有利于相关工作人员对对应的数据进行更深入 的 研究。同时，整个系统架构采用 SSH 框架封装，提高 了代码之间的重用性以及降低了代码之间的耦合性，为 后续系统的开发维护提供了便利。 参 考 文 献 1 李 继祥，于立，陈龙 泉，等 .NetCDF 格式 在 Windows 及 Linux 平 台下的读写 J.安徽农业科学， 2014， 42（ 33）： 11942 119
26、45. LI Jixiang， YU Li， CHEN Longquan， et al. Read and write NetCDF format files on Windows and Linux platform J. Jour nal of Anhui agricultural sciences， 2014， 42（ 33）： 11942 11945. 2 张 弟，吴 建平 .DotSpatial开 源 GIS 软件扩展研 究 J. 电子世界 ， 2013（ 19）： 234 236. ZHANG Di， WU Jianping. Research on DotSpatial open
27、 source GIS software extension J. Electronics world， 2013 （ 19）： 234 236. 3 雏亚未 . 基于 GDAL 的 NetCDF 数据的信息提取及格式转换 J. 6 周立刚 .基于 J2EE 的外事管理系统的设计与实现 D. 天津：南 开大学， 2014. ZHOU Ligang. Design and implementation of foreign affairs management system based on J2EE D. Tianjin： Nankai Uni versity， 2014. 7 翟高粤 .基于
28、 J2EE 技术 的 SSH 框架的 改进及应 用 J. 计算 机 时代， 2012（ 10）： 24 29. ZHAI Gaoyue. Improvement and application of SSH framework based on J2EE technology J. Computer age， 2012（ 10）： 24 29. 8 赵铁 松，王晓 云，李伟，等 . 基于 B/S 架构 和开源 WebGIS 平 台 的气象观测站网可视化系统 J. 气 象科技， 2013， 41（ 1）： 57 61. ZHAO Tiesong， WANG Xiaoyun， LI Wei， et
29、 al. Meteorologi cal observation station network visualization system based on B/ S architecture and open source WebGIS platform J. Meteoro logical science and technology ， 2013， 41（ 1）： 57 61. 9 林秀芬 . 基于 SSH 的招 标管理系 统的设计与 实现 D.成 都：电 子科技大学， 2014. LIN Xiufen. Design and implementation of the bidding
30、manage ment system based on SSH D. Chengdu： University of Elec tronic Science and Technology of China ， 2014. 10 刘培宁，韩笑 . 基于 R 语言的 NetCDF 文件分析和可视化 应用 J.气象科技， 2014， 42（ 4）： 629 634. LIU Peining， HAN Xiao. NetCDF file analysis and visualiza tion application based on R language J. Meteorological science and technology， 2014， 42（ 4）： 629 634. 作者简介：杜景林（ 1974），男，河北承德人，博士，副教 授， CCF 会员。研究方向为计算机软件和气象传感网技术。 喻亚楠（ 1992），男，江苏南通人，硕士研究生。研究方向为气象信息处理与可视化。