CN107832460A - 基于svg的实时显示卫星测控数据的图形页面控制方法 - Google Patents
基于svg的实时显示卫星测控数据的图形页面控制方法 Download PDFInfo
- Publication number
- CN107832460A CN107832460A CN201711211697.7A CN201711211697A CN107832460A CN 107832460 A CN107832460 A CN 107832460A CN 201711211697 A CN201711211697 A CN 201711211697A CN 107832460 A CN107832460 A CN 107832460A
- Authority
- CN
- China
- Prior art keywords
- svg
- real
- page
- time display
- parameter
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/12—Use of codes for handling textual entities
- G06F40/14—Tree-structured documents
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Computational Linguistics (AREA)
- General Health & Medical Sciences (AREA)
- Health & Medical Sciences (AREA)
- Artificial Intelligence (AREA)
- Data Mining & Analysis (AREA)
- Processing Or Creating Images (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明公开了基于SVG的实时显示卫星测控数据的图形页面控制方法,包括如下步骤:根据卫星测控数据页面显示的需要,设计基于绘图软件的矢量图;设计所述矢量图以流的形式自动写入对应的Web页面;根据卫星综合显示页面的特点,设计通过为所述矢量图相关组件添加双击事件的方法,绑定参数及规则并写入数据库;异步刷新页面获取遥测、遥控参数值,优化卫星测控数据实时显示的页面设计方法,实现基于B/S的体系结构,通过图形化的显示页面监视测控数据的状态,使页面操作简单、方便、快捷,数据更新及时、安全,使用Visio强大的绘图功能,自定义绘图,可随意绑定、移除测控参数,具有更强的通用性和复用性。
Description
技术领域
本发明属于SVG技术领域,涉及基于SVG的实时显示卫星测控数据的图形页面控制方法。
背景技术
卫星测控数据实时显示是综合考虑测控数据实时显示及多样化显示的需求,将测控数据与页面进行交互,为卫星测控数据状态实时监视提供直观展示结果的一门技术。现有技术中,在实时显示测控数据时,大都采用C/S系统,其在页面图形绘制及图形效果方面实现较麻烦,且对客户端机器硬件要求也较高。
随着航天测控技术的发展,对于测控数据的实时显示要求不断提高,显示形式更加多样化。由于Web平台无关性,安全性高,信息展示丰富,对客户端硬件要求低等特点,使用Web系统已逐渐成为一种趋势。目前,应用较多的是基于SVG技术的Web自定义图形页面的方法,SVG 是W3C推出的一种开放标准的文本矢量图形描述语言,他是基于XML 的专门为网络而设计的图像格式。SVG与JPEG和GIF图像比起来,尺寸更小,且可压缩性更强,可在任何的分辨率下高质量的显示,可通过JavaScript操作内部图形元素,使SVG图形变成动态的、可交互性的。但是SVG技术操作比较复杂,不能动态的修改动画内容,且受文件大小的限制不能与JSP/Html内容集成。
因此,亟需一种基于SVG技术的实时显示卫星测控数据的Web自定义图形页面的方法,简化页面操作,降低工作成本,以实现卫星测控数据的高质量、多样化显示,提高页面显示效率。
发明内容
发明所要解决的课题优化卫星测控数据实时显示的页面设计方法,实现基于B/S的体系结构,通过图形化的显示页面监视测控数据的状态,使页面操作简单、方便、快捷,数据更新及时、安全,使用Visio强大的绘图功能,自定义绘图,可随意绑定、移除测控参数,具有更强的通用性和复用性。
用于解决课题的技术手段
基于SVG的实时显示卫星测控数据的图形页面控制方法,具体包含以下步骤:
A:设计基于绘图软件的矢量图;
B:将步骤A设计的矢量图写入对应的Web页面;
C:通过双击事件的方法为步骤B写入对应的Web页面的矢量图绑定相关参数及规则,并写入数据库;
D:异步刷新绑定参数并配置完参数显示规则后的页面获取遥测、遥控参数值。
作为本发明基于SVG的实时显示卫星测控数据的图形页面控制方法的进一步优选方案,所述步骤A具体包含如下步骤:
步骤A1:设计所要显示的图形;
步骤A2:通过绘图工具绘制步骤A1所设计的图形;
步骤A3:将绘制出的图形以可缩放的矢量图的格式保存到硬盘。
作为本发明基于SVG的实时显示卫星测控数据的图形页面控制方法的进一步优选方案,所述Web页面包含Html、JSP。
作为本发明基于SVG的实时显示卫星测控数据的图形页面控制方法的进一步优选方案,在步骤B中,将步骤A设计的矢量图以流的形式写入对应的Web页面。
作为本发明基于SVG的实时显示卫星测控数据的图形页面控制方法的进一步优选方案,所述步骤B具体包含如下步骤:
步骤B1:新建空白的Web页面文件;
步骤B2:读取SVG图,以流的形式写入Web页面文件的空白body 中;其中,通过上传文件组件实现步骤B2的自动化。
作为本发明基于SVG的实时显示卫星测控数据的图形页面控制方法的进一步优选方案,双击事件的方法具体步骤如下:
步骤C1:使用JavaScript的过滤功能,获取SVG图中所有符合要求的g标签组件;
步骤C2:为步骤C1获取的g标签的各对象添加鼠标双击事件;
步骤C3:在JSP/Html页面中引用步骤C1、C2的实现方法。
作为本发明基于SVG的实时显示卫星测控数据的图形页面控制方法的进一步优选方案,在步骤C1中,符合要求的每个g标签对象都包括最内层g标签组件对象、具有id属性的g标签对象和有且仅有一个text属性标签或image属性标签的g标签对象。
作为本发明基于SVG的实时显示卫星测控数据的图形页面控制方法的进一步优选方案,在步骤C中,写入数据库的信息包括:页面id、参数id、绑定参数的g组件对象id以及判读规则id。
作为本发明基于SVG的实时显示卫星测控数据的图形页面控制方法的进一步优选方案,所述步骤D具体包含如下步骤:
步骤D1:访问前台界面时,卫星测控系统从数据库读取该页面所属的组件对象、组件对象绑定的参数及判读规则;
步骤D2:根据参数的类型信息及判读规则计算出缓存中绑定参数的值对应的响应,所述相应包含参数状态和组件对象颜色变化;
步骤D3:组件对象根据响应产生相应的动作。
发明效果
本发明提供一种基于SVG技术的实时显示卫星测控数据的Web自定义图形页面的方法,优化卫星测控数据实时显示页面的设计方法,实现基于B/S的体系结构,通过图形化的显示页面监视测控数据的状态,使页面操作简单、方便、快捷,数据更新及时、安全,使用Visio强大的绘图功能,自定义绘图,可随意绑定、移除测控参数,具有更强的通用性和复用性。
附图说明
图1是本发明某一实施例提供的一种数据处理方法流程图;
图2是图1中设计矢量图形的流程图;
图3是图1中将SVG智能写入JSP的流程图;
图4是图1中为组件绑定双击事件并存入数据库的流程图;
具体实施方式
以下,基于附图针对本发明进行详细地说明。
为使本发明实施例的目的、技术方案和优点更加清楚,下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例是本发明一部分实施例,而不是全部的实施例,基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例,都属于本发明保护的范围。
为了解决B/S体系架构下,测控数据实时显示在图形页面的问题,本发明实施例提出了一种基于SVG技术的实时显示卫星测控数据的 Web自定义图形页面的方法。下面依据图1-4对本发明实施例作具体阐述说明。
参考图1,本实施例所述的一种基于SVG技术的实时显示卫星测控数据的Web自定义图形页面的方法,该方法包括如下步骤:
步骤1:设计基于绘图软件(Visio)的矢量图;
参考图2,设计矢量图的步骤包括如下:
(1)为设计所要显示的图形;
(2)使用强大的绘图工具,如Office Visio,将其绘出;
(3)将绘出的图以可缩放的矢量图形的方式保存到硬盘。
步骤2:设计所述矢量图以流的形式自动写入对应的Web页面(如Html、JSP等);
参考图3,将矢量图写入对应Web页面的步骤包括如下
(1)新建空白的Web页面(如Html、JSP等)文件;
(2)读取SVG图,以流的形式写入JSP/Html文件的空白body中。
其中,通过启动上传文件组件实现SVG读写操作的自动化,同时防止中文乱码,读、写SVG图时,均采取UTF-8编码方式。
步骤3:设计通过双击事件的方法为矢量图绑定相关参数及规则并写入数据库;
参考图4,通过双击事件的方法为矢量图绑定相关参数及规则并写入数据库的步骤如下:
(1)使用JavaScript的过滤功能,获取SVG图中所有符合要求的“g”标签组件对象。选取规则为:选取最内层、有id属性、有且仅有一个“text”属性标签或者“image”属性标签的“g”标签组件对象。
(2)为(1)添加鼠标双击事件。
(3)在JSP/Html中引用(1),(2)的实现方法。
通过上述双击事件为组件绑定遥测、遥控参数以及参数对应的类型和判读规则,并将这些信息存入数据库。存入数据库的信息有:页面id、参数id、绑定参数的“g”组件id、判读规则id。
步骤4:异步刷新页面获取遥测、遥控参数值。
异步刷新页面访问前台的步骤如下:
(1)系统首先从数据库读取该页面所属的组件对象、组件对象绑定的参数及判读规则;
(2)根据参数的类型信息及判读规则计算出缓存中绑定参数的值对应的响应,如:参数状态(正常、报警、开、关等),组件对象颜色变化等;
(3)对应的组件对象根据响应产生相应的动作;
其中,给前台“g”组件对象赋值时,根据数据库存储的“g”组件对象的id主动赋值,不需遍历所有的“g”组件对象;
通过AJAX技术定时向缓存中请求数据,刷新页面数据。当参数对应的响应为数据或者文字时,显示要居中,将要显示的数据和文件以及文本显示的样式赋给JSP中的隐藏Span标签,获取此情况下的文本长度,同时获取显示文本的组件的总长度,然后计算出居中显示文本的开始位置,并赋值给组件的“X”属性。
本发明未详细阐述的部分属于本领域公知技术。
需要说明的是,以上说明仅是本发明的优选实施方式,应当理解,对于本领域技术人员来说,在不脱离本发明技术构思的前提下还可以做出若干改变和改进,这些都包括在本发明的保护范围内。
Claims (9)
1.基于SVG的实时显示卫星测控数据的图形页面控制方法,其特征在于,具体包含以下步骤:
A:设计基于绘图软件的矢量图;
B:将步骤A设计的矢量图写入对应的Web页面;
C:通过双击事件的方法为步骤B写入对应的Web页面的矢量图绑定相关参数及规则,并写入数据库;
D:异步刷新绑定参数并配置完参数显示规则后的页面获取遥测、遥控参数值。
2.根据权利要求1所述的基于SVG的实时显示卫星测控数据的图形页面控制方法,其特征在于,所述步骤A具体包含如下步骤:
步骤A1:设计所要显示的图形;
步骤A2:通过绘图工具绘制步骤A1所设计的图形;
步骤A3:将绘制出的图形以可缩放的矢量图的格式保存到硬盘。
3.根据权利要求1所述的基于SVG的实时显示卫星测控数据的图形页面控制方法,其特征在于:所述Web页面包含Html、JSP。
4.根据权利要求1所述的基于SVG的实时显示卫星测控数据的图形页面控制方法,其特征在于:在步骤B中,将步骤A设计的矢量图以流的形式写入对应的Web页面。
5.根据权利要求1所述的基于SVG的实时显示卫星测控数据的图形页面控制方法,其特征在于:所述步骤B具体包含如下步骤:
步骤B1:新建空白的Web页面文件;
步骤B2:读取SVG图,以流的形式写入Web页面文件的空白body中;其中,通过上传文件组件实现步骤B2的自动化。
6.根据权利要求1所述的基于SVG的实时显示卫星测控数据的图形页面控制方法,其特征在于:双击事件的方法具体步骤如下:
步骤C1:使用JavaScript的过滤功能,获取SVG图中所有符合要求的g标签组件;
步骤C2:为步骤C1获取的g标签的各对象添加鼠标双击事件;
步骤C3:在JSP/Html页面中引用步骤C1、C2的实现方法。
7.根据权利要求6所述的基于SVG的实时显示卫星测控数据的图形页面控制方法方法,其特征在于,在步骤C1中,符合要求的每个g标签对象都包括最内层g标签组件对象、具有id属性的g标签对象和有且仅有一个text属性标签或image属性标签的g标签对象。
8.根据权利要求1所述的基于SVG的实时显示卫星测控数据的图形页面控制方法,其特征在于,在步骤C中,写入数据库的信息包括:页面id、参数id、绑定参数的g组件对象id以及判读规则id。
9.根据权利要求1所述的基于SVG的实时显示卫星测控数据的图形页面控制方法,其特征在于,所述步骤D具体包含如下步骤:
步骤D1:访问前台界面时,卫星测控系统从数据库读取该页面所属的组件对象、组件对象绑定的参数及判读规则;
步骤D2:根据参数的类型信息及判读规则计算出缓存中绑定参数的值对应的响应,所述相应包含参数状态和组件对象颜色变化;
步骤D3:组件对象根据响应产生相应的动作。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201711211697.7A CN107832460B (zh) | 2017-11-28 | 2017-11-28 | 基于svg的实时显示卫星测控数据的图形页面控制方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201711211697.7A CN107832460B (zh) | 2017-11-28 | 2017-11-28 | 基于svg的实时显示卫星测控数据的图形页面控制方法 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN107832460A true CN107832460A (zh) | 2018-03-23 |
CN107832460B CN107832460B (zh) | 2022-04-08 |
Family
ID=61646076
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201711211697.7A Active CN107832460B (zh) | 2017-11-28 | 2017-11-28 | 基于svg的实时显示卫星测控数据的图形页面控制方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN107832460B (zh) |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111199568A (zh) * | 2020-01-14 | 2020-05-26 | 广州长川科技有限公司 | 矢量图的绘制方法、装置及计算机可读存储介质 |
CN111880892A (zh) * | 2020-06-15 | 2020-11-03 | 中冶南方都市环保工程技术股份有限公司 | 一种基于svg技术的实时监测工业数据的方法 |
CN115734097A (zh) * | 2022-10-17 | 2023-03-03 | 北京空间飞行器总体设计部 | 一种多航天器并行测试的实时监控系统和方法 |
Citations (12)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101751477A (zh) * | 2010-02-05 | 2010-06-23 | 长安大学 | 基于SVG的WebGIS楼宇房间查询系统及查询方法 |
CN102495882A (zh) * | 2011-12-07 | 2012-06-13 | 方正国际软件有限公司 | Java环境下页面对象与数据库字段绑定的实现系统和方法 |
US20130021375A1 (en) * | 2011-07-18 | 2013-01-24 | Yahoo! Inc. | System for Monitoring a Video |
CN103218451A (zh) * | 2013-04-27 | 2013-07-24 | 北京空间飞行器总体设计部 | 一种航天器测试数据自动判读方法 |
CN103414888A (zh) * | 2013-09-09 | 2013-11-27 | 江苏物联网研究发展中心 | 基于svg技术的楼宇视频图形化显示方法 |
CN104410720A (zh) * | 2014-12-22 | 2015-03-11 | 山东鲁能软件技术有限公司 | 一种基于web图形的实时监控平台系统及其方法 |
CN104578414A (zh) * | 2014-12-30 | 2015-04-29 | 国家电网公司 | 一种基于svg实现智能站保护动作可视化的方法 |
CN104699749A (zh) * | 2014-12-26 | 2015-06-10 | 青岛奥利普自动化控制系统有限公司 | 一种自定义图形展示方法 |
US20150249652A1 (en) * | 2014-03-03 | 2015-09-03 | Real Strategic Inc. | Enabling image based broadcast of reviews |
CN103226604B (zh) * | 2013-04-27 | 2017-02-15 | 上海来信信息科技发展有限公司 | 基于SVG的WebGIS系统及相应的能耗监控系统 |
CN106570185A (zh) * | 2016-11-10 | 2017-04-19 | 广西大学 | 一种电力系统图形跨平台展示方法 |
CN107203503A (zh) * | 2017-05-12 | 2017-09-26 | 国电南瑞科技股份有限公司 | 一种应用于svg界面的实时监视表格的方法 |
-
2017
- 2017-11-28 CN CN201711211697.7A patent/CN107832460B/zh active Active
Patent Citations (12)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101751477A (zh) * | 2010-02-05 | 2010-06-23 | 长安大学 | 基于SVG的WebGIS楼宇房间查询系统及查询方法 |
US20130021375A1 (en) * | 2011-07-18 | 2013-01-24 | Yahoo! Inc. | System for Monitoring a Video |
CN102495882A (zh) * | 2011-12-07 | 2012-06-13 | 方正国际软件有限公司 | Java环境下页面对象与数据库字段绑定的实现系统和方法 |
CN103218451A (zh) * | 2013-04-27 | 2013-07-24 | 北京空间飞行器总体设计部 | 一种航天器测试数据自动判读方法 |
CN103226604B (zh) * | 2013-04-27 | 2017-02-15 | 上海来信信息科技发展有限公司 | 基于SVG的WebGIS系统及相应的能耗监控系统 |
CN103414888A (zh) * | 2013-09-09 | 2013-11-27 | 江苏物联网研究发展中心 | 基于svg技术的楼宇视频图形化显示方法 |
US20150249652A1 (en) * | 2014-03-03 | 2015-09-03 | Real Strategic Inc. | Enabling image based broadcast of reviews |
CN104410720A (zh) * | 2014-12-22 | 2015-03-11 | 山东鲁能软件技术有限公司 | 一种基于web图形的实时监控平台系统及其方法 |
CN104699749A (zh) * | 2014-12-26 | 2015-06-10 | 青岛奥利普自动化控制系统有限公司 | 一种自定义图形展示方法 |
CN104578414A (zh) * | 2014-12-30 | 2015-04-29 | 国家电网公司 | 一种基于svg实现智能站保护动作可视化的方法 |
CN106570185A (zh) * | 2016-11-10 | 2017-04-19 | 广西大学 | 一种电力系统图形跨平台展示方法 |
CN107203503A (zh) * | 2017-05-12 | 2017-09-26 | 国电南瑞科技股份有限公司 | 一种应用于svg界面的实时监视表格的方法 |
Non-Patent Citations (2)
Title |
---|
夏帅等: "基于SVG的在线量子电路设计平台的研究与实现", 《电脑知识与技术》 * |
胡冰等: "基于SVG/AJAX/Internet的电厂运行监视系统", 《机电工程》 * |
Cited By (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111199568A (zh) * | 2020-01-14 | 2020-05-26 | 广州长川科技有限公司 | 矢量图的绘制方法、装置及计算机可读存储介质 |
CN111199568B (zh) * | 2020-01-14 | 2024-01-12 | 广州长川科技有限公司 | 矢量图的绘制方法、装置及计算机可读存储介质 |
CN111880892A (zh) * | 2020-06-15 | 2020-11-03 | 中冶南方都市环保工程技术股份有限公司 | 一种基于svg技术的实时监测工业数据的方法 |
CN115734097A (zh) * | 2022-10-17 | 2023-03-03 | 北京空间飞行器总体设计部 | 一种多航天器并行测试的实时监控系统和方法 |
CN115734097B (zh) * | 2022-10-17 | 2024-01-09 | 北京空间飞行器总体设计部 | 一种多航天器并行测试的实时监控系统和方法 |
Also Published As
Publication number | Publication date |
---|---|
CN107832460B (zh) | 2022-04-08 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
Leutnant et al. | swmmr-an R package to interface SWMM | |
CN104216691B (zh) | 一种创建应用的方法及装置 | |
CN101796543B (zh) | 数据系统和方法 | |
CN102693253B (zh) | 图像管理和呈现 | |
CN108665520A (zh) | 一种页面动画渲染的方法及装置 | |
DE102017124551A1 (de) | Vorrichtung und verfahren für dynamische gerätebeschreibungssprachmenüs | |
CN102360288B (zh) | 实时数据驱动的脚本化全组态hmi系统 | |
Iosifescu-Enescu et al. | Web cartography with open standards–A solution to cartographic challenges of environmental management | |
US20100083172A1 (en) | Method and system for generating and displaying an interactive dynamic list view of multiply connected objects | |
CN110096277A (zh) | 一种动态页面展示方法、装置、电子设备及存储介质 | |
US20130042190A1 (en) | Systems and methods for remote dashboard image generation | |
US9026900B1 (en) | Invisible overlay for dynamic annotation | |
CN111459501B (zh) | 基于SVG的Web组态画面存储与展示系统和方法及介质 | |
CN107832460A (zh) | 基于svg的实时显示卫星测控数据的图形页面控制方法 | |
CN109614601A (zh) | 基于web的表格处理方法、装置、设备及可读介质 | |
CN105260170A (zh) | 一种基于案例的突发事件态势推演方法及系统 | |
CN104636090A (zh) | 打印机驱动器的印刷功能的追加方法 | |
Neumann | Web mapping and web cartography | |
CN106354355A (zh) | 用户界面布局方法、装置及系统 | |
CN104798067A (zh) | Web服务器系统、辞典系统、辞典调用方法、画面控件显示方法以及演示应用生成方法 | |
CN107301046A (zh) | 图标的处理方法和装置、计算机设备和存储介质 | |
CN103414888B (zh) | 基于svg技术的楼宇视频图形化显示方法 | |
CN112100583A (zh) | 一种Web可视水印的生成方法及装置 | |
CN107729105B (zh) | 一种基于Web的地震底图与剖面联动方法 | |
US9501457B2 (en) | Creating a communication editable in a browser independent of platform and operating system |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant | ||
TR01 | Transfer of patent right | ||
TR01 | Transfer of patent right |
Effective date of registration: 20230425 Address after: 100086 No. 82, Haidian District, Beijing, Zhichun Road Patentee after: SPACE STAR TECHNOLOGY Co.,Ltd. Address before: Unit 1406, 14 / F, building 51, 63 Zhichun Road, Haidian District, Beijing 100190 Patentee before: AEROSPACE TIANHUI TECHNOLOGY CO.,LTD. |