轨迹系列11——多车辆实时迹展现方案

文章版权由做者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/前端

1. 背景

在以前的轨迹系列中,咱们详细的对单个轨迹展现进行了研究,涉及到GPS对接协议、轨迹存储、轨迹纠正算法、前端轨迹展现。java

可是,实际项目中还会有另外一类需求:假设武汉市洪山区有300辆警车,在大厅的大屏幕上须要知道全部警车的实时轨迹。这个需求用咱们以前的单轨迹展现架构是无法支撑的。web

此时,咱们须要对咱们的架构以及前端展现方式进行重构。算法

2.架构设计的几点思考

a.采用websocket方案重构:传统的前端定时拉取信息方式不足以支撑实时的数据获取,而且向后台不断发送请求获取全部车辆实时轨迹会对服务器形成十分巨大的压力。api

b.GPS接收后直接经过socket推送:避免先入库再读取方式。tomcat

c.GPS进行实时的坐标转换和基于路网的纠正:多轨迹展现中,若是GPS在道路上偏移,会使展现效果格外混乱,因此这里必须进行轨迹的实时纠正。而如何高效的进行轨迹纠正也是一个十分重要的步骤,后篇咱们再一块儿讨论。前端框架

d.前端多轨迹展现的编写:目前百度地图在echarts3中有一个北京公交轨迹展现示例。可是实际项目中,咱们是内网的本地地图。这里须要对echarts3中引用百度地图bMap的源码部分进行修改,而后集成至前端框架中。服务器

3.具体实现

3.1WebSocket架构

3.1.1后台

引入javax.websocket-api-1.1.jar,在tomcat7之后,lib中自带websocketapi.jar。微信

编写通讯类,比较重要的方法为:websocket

a. Session  与某个客户端的链接会话,须要经过它来给客户端发送数据

b. onOpen链接创建成功调用的方法

c.onClose 链接关闭调用的方法

d. onMessage 收到客户端消息后调用的方法

e. onError 发生错误时调用

f.sendMessage 发送消息

 

3.1.2前端

在HTML5中内置有一些API,用于响应应用程序发起的请求。相似于后台的方法,其基本API语句以下:

建立对象,var ws = new WebSocket(url,name); url为WebSocket服务器的地址,name为发起握手的协议名称,为可选择项。

发送文本消息,ws.send(msg);msg为文本消息,对于其余类型的能够经过二进制形式发送。

接收消息,ws.onmessage = (function(){...})();

错误处理,ws.onerror = (function(){...})();

关闭链接,ws.close();

3.2echarts3改写

 

针对bMap.js的改写为最重要的改写

 

改写后,在设置参数的options中引入对应改写的地图便可:

 

 

4.成果展现

 

                  

                        -----欢迎转载,但保留版权,请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/

                                                                              若是您以为本文确实帮助了您,能够微信扫一扫,进行小额的打赏和鼓励,谢谢 ^_^

                                                                                                                                            

相关文章
相关标签/搜索