基于skyline动态态势显示系统设计与实现

我，本及其研究工作是由本人在导师指导下独立完成的，在完成时所利用的一切资料均已在参考文献中列出。作者：时间：20146DesignandImplementationofDynamicSituationDisplaySystemBasedonSkylineTutor：ShenXu-Withtheimprovementinthelevelofsocialinformation,modelingandsimulationofsituationhasbeenwidelyusedinvariousindustries.ThispaperaimstodevelopadynamicsituationdisplaysystembasedontheB/Sstructuretoachieveacquisition,optimizationanddisplayofdynamicsituation.Thesystemincludesthefollowingmainfeatures:two-andthree-dimensionaldisplayandseamlesshandoverutility;abilitytoobtaindynamicsituationinastreamingwayviaWebSocketandpushthedatatotheclientinrealtime.Thisarticlediscusseswhatthesystemneedstoachieve,thendesignsthemainframeworkofthesystembasedonthemodel-vie ttern,andresearchestheimplementationofkeyalgorithmsinthesystem.Thus,thestructureandimplementationoftheentiresystemarepresentedfromthesediscussions.：Skyline,DynamicSituation 绪 课题来 研究背景与意 地理信息系统简 态势的定义和介 态势显示系统的组成和职 国内外研究现 Skyline简介以及在态势显示中的应 OpenLayers简介以及二维地图显示中的应 研究目标与内 研究目 研究内 组织结 相关背景知 B/S架构简 JavaScript和AJAX技 Skyline二次开发系 系统需求分 态势数据源的简介和特 功能需 地图显示的基础功 态势数据处理部 动态态势显示部 性能需 运行环境需 JSON中间结构的设 JSON中间结构的简介和意 基本结构的设 具体定 实体树结构的定 事件结构的定 系统整体架构的分析与设 整个态势仿真系统的前后端职责分 服务端系统的基本架 构架前端系统的两种方 直接操作地图的模 模型-视图模 前端系统整体架构的设 事件源和全局事件管理 的事件 5.结构的设 事件结构概 更新事件的构成方 Diffed事 Event事件结 TreeSelected事 关键系统和算法的研究与实 森林结构比较方法的研究与实 算法需要解决的问 算法的伪代码实 时间点离散插值算法的研究........................................................................算法的提出背 插值算法的设计思想和要 插值算法的伪代码实 基于插值算法的实体数据扩展算 关键帧搜索归并算法的研究与实 算法的提出背 算法的设计目标和要 算法的设计思 系统中组件系统的设计与实 组件系统概 组件系统的设计目 组件系统的整体思路和API设 实时推送系统的研究与实 浏览器推送技术概 推送技术在态势显示系统中应 实时推送系统的设计目 实时推送系统的实现思 总 致 参考文 （WebMapService,网络地图服务WMS协议获取地图，1.2.2节中，介绍到态势包含静态态势和动态动态态势，需要显示运动中的车辆、飞行器的和相应的三维模型Skyline、Skyline是优秀的三维虚拟地球平台软件，能够利用航空影像数据、高程数据和2D或3D图像、模型等，创建一个交互式的虚拟地球环境。Skyline支持C++、C#和JavaScriptC/SB/S架构的开发。、现在Skyline已经是一套比较成GIS应用软件解决方案，在各行各业都有使用Skyline进行开发的成功案例，如智慧三维地理信息系统“神七问天”三维显示系统“数字武夷山”综合信息服务系统、512抗震救灾应急服务系统等。OpenLayers,OpenLayers以其强大的功能，方便的API，在各个领域的WebGIS系统中均有较多图方案的研究[2]。设计并实现一个基于Skyline和OpenLayers的，运行于浏览器上的动态态势显示系(一地图显示模块的研究地图显示模块主要研究Skyline和OpenLayers的无缝切换和联合。这个态势显示系统包括二维显示和三维显示因此本态势显示系统的GIS地图显示部分需要使用SkylineOpenLayers两个插件，分别用于支持三维地图和二维地图的显示。在态势显示过程(二态势数据处理模块的研究第二步，研究如何从数据源全部数据，转换到中间数据结构；由于涉及到从数据源直接，因此这部分主要通过服务端完成。(三态势数据显示模块的研究SkylineOpenLayersAPI研究组件，使得地图中能够显示动态态势本课题主要设计并实现一个基于Skyline和OpenLayers的动态态势显示系统。本文GISSkyline当前的应用现状，分析了当前存在JSON中间数据结构进行详细定义和解释。B/SB/S(Browser/Server,浏览器/服务器)架构是一种新兴的软件组织结构。它借助了现系统的逻辑放在服务端的组织结构与B/S架构相对应的是C/S(Client/Server,客户B/SHTMLJavaScriptV8高性能B/S架构开发。B/S软件的和升级简单而灵活。和升级时无需考虑客户端软件的升级，只JavaScriptAJAXB/SJavaScript语言进行前JavaScriptAJAX技术。JavaScript最初是设计为一个运行于网页浏览器端的编程语言，通常用于给静HTML页面添加动态的功能。最初，JavaScript只是希望用于在当时较慢的网速下AJAX(AsynchronousJavaScriptAndXML,JavaScriptXML)，是一种不用刷Web交互方式是通过表单进行交互。当用户提交表单时就能够将内容上传对于动态态势显示系统这样一个WebSkyline作为一个成Skyline三维数字平台软件，Skyline提供了丰富的API以支持二次开发。Skyline底层使用C++实现，因此具有较高的性能。Skyline的二次开发API也用C++类和函数的方式提供，并提供了C#和JavaScript的绑定。在本系统中，使用Skyline嵌入浏览器的方式来提供三维显示的功能，并使用SkylineAPI的JavaScript绑定完成三维态势显示部分的实现。Skyline提供的API功能丰富，包含对虚拟地球的定 JSON间。该仿真引擎能够将动态态势数据写入数据库中。在数据库中，一个数据表代表了一类实体的动态态势，多个数据表结合起来就表示了所有种类实体的动态态势。动态态势数据需要从这些数据库中获取。然而，对于在某个数据表A内存在的一个时间点t来说，另一个数据表B中可能会不存在该时间点。这就代表，数据表B中包含的所有实体在时间点t上静止不动。3.1态势仿真引擎写入的数据表另外，该仿真引擎还支持数据的实时传递功能，可以使用Socket将数据传送到Socket6.5Socket传递功Skyline标号图。在地图的任意位置上安置一张任意，并能够在下方显示出该模型。模型在二维地图上以的形式展现，而到了三维地图上，则以三维模路径和多边形。给定一组坐标，能够在地图上显示出路径和多边形来表圆形。给定一个中心和半径，能够在地图上绘制出一个圆形二维地图和三维地图显示出相同的静态态势；在动态态势的过程中，也能Socket接口获取数据，再实时地传送到各个客户端中。上，并能够显示出来；对于动态态势，需要有一个方便的控制器，能够控制动态态势的、暂 B/SJavaScript作为前端语言，因此需要额外能问题。具体需求如下：动态态势时，在同屏50个动态实体的情况下，需要能够以至少20帧/秒的速度进行；无论数据接收是使用数据库还是Socket传输的方式，都需要能够支持多个浏览器客户端的。SkylineSkylineInternetExplorerSkyline插件的InternetExplorer10及以上版本的浏览器。IESkylineIE浏览器，也能够JSONJSON语言的一个子集因此可以很容易地转化成为JavaScript结构JSON也是JavaScriptJSONJSON可以作为态势数据处理部分和态势显示部分之间相互传递的数据；在态势显示部分转换为JavaScript对象JSON数据结构的设计以动态态势显示作为主要目标，主要用于所有实体在各时间点的方案，转而使用JavaScript对象进行。因此设计动态态势数据结构如下4.1动态态势数据结{<时间戳对应时间戳内的所有实体4.2[<12>3>{children:null>,其他键值对在数据源中，实体的事件被单独拉出来成为一个新的数据表。从这个表中到的4.3事件数据结{<时间戳对应时间戳内发生的事件集合[1,2,4.4JSON中间结JSON{data:实体数据部分events:事件数据部分整个结构的示意图如图4.1…JSON…JSON…………4.5实体树结ID，在所有实体中唯一。IDJSON实体的类型。根据这个属性决定是用什么和模型代表这个如果实体类型是标号或者模型，需要指定此属性作为如果实体类型是多边形或路径，指定所有顶点的其中，position是一个和方向等信息的集合，具体定义如下4.6位置信息结xy0实体的俯仰角，以度为单位，取值范围是-9090件中，加油车是发生源，飞机是目标对象，“加油”本身为事件类型。据此可以设计出事件结构的定义如下：4.7实体事件结JavaScript完成。为了灵活性和数据的动态加载的要求，系统设计为让网页JavaScriptJSONJSONJSON中间结构。因此，服务器端除了需要托管静态网页，数据结构的转换和普通网页一样，通过URL进行。通过相应的URL，网JavaScript，在客户端直接完成。HTML静态界面，并提供态势数据的获取和转换功HTML界面中直接完成。Apache服务器经过一番设URL来进行转换完成的态势数据的获取。糅合了树状结构、动态态势、二维、三维地图显示、地图编辑、实体事件显示等一系列部分。可以说几乎所有的复杂性都集中端系统。因此需要前端系统有一个清晰状图和动态态势组件中，并将态势组件和zTree一同作为地图控制源。该方案的控制流程如图5.1所示。5.1直接操作地图模式的控制流4章分析的JSON中间结构可见，器可以很方便地取到下一帧的内容，并且一个时zTree树状图中，然后调用同样的函数将动态态势显示到地图上。zTree上删除一个节点时，可以用该节点和所有子节点的地图句柄调用地图API，在地图上删除这些节点。控制器等地方，使得结构更加。因此这个方案最终被放弃了模型-思路细节将在5.4节中进行阐述。在模型-视图模式下的系统控制流程如图5.25.2事件-视图模式下的控制流JavaScript的特性，我们并不能直接得知态势数据结构是否得到了修改。因此emit方法进行相应的事件发送。 图5.3态势视 图5.4树状结构视图5.5控制组的事件态势视图就是包括OpenLayers和Skyline组合而成的态势显示系统。态势视图在注position属性。zTree同时还支持对树形结构中的节点进行改名、移动位置、删除的功能。通过设zTreezTree的同时修改当前态势的森林结构，以便达树状结构视图需要向全局事件管理器更新事件，以便在当前态势被修改后zTree的“Event”事件，这个事件由控制组件触发。关于该事件的具体事件内容见5.5.4要达到这一要求实体属性视图需要两个事件一个是事件管理器的更新事件，zTree中选择节点的“TreeSelected”5.5.5小节。5.结构的设所谓事件结构，就是触发事件之后，事件能够收到的一个数据结构。这个据结构中一般包含这个事件的进一步信息。有些事件比较简单，因此可以没有事件结构。可以获得所有实体的信息，从而自行决定如何更新。完全更新方式的优点是信息比较全面，各个视图有更大的自由度决定如何显示。缺点是视图不能得知具体是哪些实体被更新了，于是只能把所有的实体都更新一遍，这样在态势包含的实体比较多的时候效率很低。结构中封装的不是所有的态势信息，而是表明了这次态势相对更新之前的态势具体更新的内容。增量更新的优点是各个视图能够得知具体需要修改什么，能够精确对准一个点进行更新，效率高；缺点是每个组件在修改之后，都要明确指明具体修改了什么地方，稍显繁琐。由于客户端的态势显示系统使用HTML和JavaScript进行显示，因此效率问题相比5.5.3小节所Diffed事件。DiffedDiffed{added{added增加的节点changed:<修改的节点数据removed:删除的节点ID这一特点，{<{<ID>:树节点{<ID>:树节点修改的节点数据需要深入节点，具体到哪个属性被修改了。结构如下{<{<ID>:被修改的属性修改之后该属性的值ID1{added{addedchanged:{1{position:新位置removed6.1节中详细阐述。Event高亮显示出来。Event4.3.2小节中定义的事件结构完全一致。zTreeTreeSelected事件。该事件{tree:{tree:操作的树形结构node选择的树节点treenodeDiffed事件这一数据结构提供增量JSON再进行动态态势的显示时，控制器获取到的每个时间点的数据就是一个森林结构。Diffed数据结构。经过研究，提出46.1森林结构和树节[<12>3>{children:null>,其他属性值Diffed如果两个森林中出现了相同ID的树节点并且属性有所修改则将其归类Diffedchanged属性中，代表这些节点被修改了。如果发现新的森林增加了新的树节点（ID不存在于旧的森林中Diffedadded属性中，代表这些节点被新增DiffedremovedA输出：Diffedfunctionfunctiondiff(A,B)D←Diffed结构R,S←{}T←forANR[N.id]←}forBNS[N.id]←}forR∪SifN.idRS中都存在Ddiff(R[N.id].children,S[N.id].children)forNchildrenfieldifNfieldRSD.changed[N.id][field]←elseif(NRS中不存在D.removed[N.id]←elseif(NSR中不存在D.added[N.id]←return时间点离散插值算法的研究在动态态势的最简单情况下可以认为数据源中的一个时间点对应态势一帧即态势中拿到的每一帧都存在于N中间结构中然而这种简单的做法可能会造成数据源中时间点和不同步的问题在数据源中时间点之间间隔的最单位是1秒，而为了达到流畅的效果，一般设置器为20帧秒。如果让时间和帧一一对应，则相当于以20速率快进。因此，需要设计一个插值算法，通前后两帧将中间的帧补上。计算出相邻两个时间点之间新的实体状态，从而让变得流畅。图6.1说明了插值前插值时间点 时间点 时间点插值时间点 位6.1插值前后的车辆位置关A、BCBACBACBAIDCID的实体的这个属A、BAx，Byp为插值系数，取值范围在[0,1]，代表靠近新值的程度。则有𝑧=𝑥+𝑝(𝑦−𝑧=这是因为对于非数字来说，不存在“中间状态”yaw6.2（三）所示。这是期望的结（一）正常情（二）正常插（三）排除朝向之后的插6.2各种插值之间的a,bp,functionfunctioninterpolate(a,b,p,D)ifa,bNULLA←elseifa,bAap*(ba)elseifa,b均为森林Aforaifb中含有与n相同ID的树节点mxinterpolate(n,m,p,D)A←A∪{x}A←elseifa,bObjectA←空对象forak,ififA[k]← A[k]←interpolate(v,b[k],p,A←areturn为平滑流畅。这也是插值算法最终目的。输入：旧的实体数据A,相邻两个时间点内的新时间点的数量n，不进行属性Dfunctionexpand(A,n,D)N←空对象{}forAtn1←A[t]n2A[t1]ifn2存在N[t]←for[1,n)N[t+i/n]←interpolate(n1,n2,i/n,D)returnN1234567······6.3时间11被删除。间点5，则实体2所处的位置还是时间点6的数据。因此，不能简单地忽略掉实体的删1234567····6.4关键帧搜索归并算法示意6.46的森林结构时，从每个实体之前法需要能够对数据的动态提供支持。为了方便算法的实现，本文设计了关键帧图层数据结构。该结构为一个6.2关键帧图层结{<{<ID>:[x1x2x3template:x1x2x3树节点，将每个树节点按照以程进行处理：ID初始化一个空的时间戳数NANuNfunctionfunctionsearch(A,u)s←0e←A.lengthift>ureturnA[e-1]whiles<em←(s+e)/ifA[m]uuA[m1]returnA[m]elseifu<A[m]e=ms=m+D,A,functiongetData(D,A,functiongetData(D,A,templateD[search(A['template'],t]ret←template的拷贝forretmD[search(A[n.id],t)]formuifn.id=returnret6.5VisualBasic中的控irtalBasicisualC#中就包括了许多组件，有文本框、按钮、菜单等等。用户在设计应用程序时，甚至只需要拖动组件到屏幕上，大大简化了开发工作。由于HTML原本只是用于设计为网页呈现的平台而不是像桌面语言那样的应用程序开发平台，因此原生不提供组件系统。如果要使用原生JavaScript构造一个可以交互的界面，则需要频繁地操作DOM，并且组件本身的逻辑和应用逻辑相互交叉，使得代 t中都表现为一个实例，在这个示例中将对这个组件的操作封装起来，方便了用户在中对于该组件的操控。另外，组件系统本身将组建的定义和组建的使用分离开，降低了系统的耦合，提高了可性。目前已经有了许多基于HTML的组件系统，如G4Studio、jQueryUI等。但这些组统。端系统中，除了基础地图和zTree本身，用到的其他组件都是通过组件框架编写的，包括控制器、实体事件视图、实体属性视图等。对于组件开发者而言，组件系统要对方便地编写组件提供支持。一个组件的可能有比较复杂的逻辑，例如动态态势组件就需要有暂停、、快进等操作按钮，还需要一个可拖动的进度条。组件系统需要提供法，让组件开发者将这些逻辑集HTMLCSS编写的。在用户希望引入一个组件时，系统需要能自动获取组件的HTML结构，到用户指定的位置上，然后返回组件的控制句API使用AJAX技术从相应文件中获得组件模板，并在用户指定的地方varvarPlayPanel=components.define(‘.playPanel’,function(root,data){return操作接口“.playPanel”jQuery的选择器，通过此选择器能从网页模板中选择出相应组件‘root’代表将模板到用户界面后的DOM对象。通过操作此DOM对象来实现组件的逻辑。这个组件的所有行为和逻辑都通过对“root”对象进行操作而得以实现。个控制器时，需要对起始时间和终止时间进行设置。操作接口是一个JavaScript对象类型，代表给用户的，用于操作该控制组varplayPanel=PlayPanel(‘#PlayPanel’,{end:varplayPanel=PlayPanel(‘#PlayPanel’,{end:playPanel.play();playPanel.pause();其中，PlayPanel就是上面定义的组件，其第一个参数表示将PlayPanel控制组2000。B/SHTTP协议。AJAX方式请求数据，都需要客户端首先进行请求。HTML应用的逐渐丰富，在某些情况下，单纯的请求-响应模式逐渐显构的桌面应用程序来说，可以借助TCP传输协议的双工特性，直接通过TCP连接来实现全双工的通信然而由于Web服务器只能通过客户端的请求进行响应不能够很 中提到的AJAX长轮询技术是一个比较成解决方案。简单来说，AJAX长轮询是通过AJAX进行伪实时通信的方式，浏览器iframe元素进行长轮询的技术。在HTML5时代，又发展出了WebSocket技术。上文提到的AJAX技术只是通过服务器的延迟响应来实现伪实时通信，而WebSocket一种让浏览器与服务器间直接建立TCP连接，从而进行全双工通讯的网络技术。目前所有的主流浏览器都已经支持WebSocket协议。在将来，WebSocketAJAX长轮询成为主要的实时通信技术。图6.6获取完整数据的流6.7实时获取态势数据的流6.7