。

航空实时监控#xff0c;是飞机每秒发送坐标#xff0c;经过终端转换实时发送给塔台#xff0c;为了飞机位置的精准度#xff0c;传输位置的密度很大#xff0c;在地图位置显示不明显。

本次为了案例展示效…任务描述

容地图展示、飞机飞行轨迹、扇区控制。

航空实时监控是飞机每秒发送坐标经过终端转换实时发送给塔台为了飞机位置的精准度传输位置的密度很大在地图位置显示不明显。

本次为了案例展示效果对飞机位置重新进行了规划结合百度地图和数据清洗展示到前台。

时6学时

1、后台从文件名为part-xxxxx的文件中读取每行飞机坐标点传输到KafkaSpark清洗任务拉取Kafka数据对数据进行清洗对数据坐标进行判断转换成各扇区发送到MySQL作为转换后的数据点这一过程在前面的数据清洗和统计任务阶段已经完成可参见

BigData-Etl-KongGuan/src/main/java/com/qrsoft/etl/spark/SparkUtil.java类BigData-Etl-KongGuan/src/main/java/com/qrsoft/etl/spark/SparkStreamingApplication.java类

2、前端经过读取后台MySQL的数据并结合百度地图将飞机的实时飞行状态展示出来可按以下步骤实现

1引入百度地图

下面图中是原企业项目的真实展示页面在当前项目中由于数据集的特点实际展示效果可能会有差异。

任务实现

此步骤在前面的“使用Spark清洗统计业务数据并保存到数据库中”任务阶段应该已经完成。

如果没有完成请参考源代码自行完成。

核心类主要有三个SparkStreamingApplication类、SparkUtil类和MapManager类以及一些辅助类。

BigData-Etl-KongGuan/src/main/java/com/qrsoft/etl/spark/SparkStreamingApplication.java类的作用是实时读取Kafka中所有Topic的数据然后进入到不同的处理分支程序中进行数据清洗和存储处理“实时飞行的航迹数据”的分支的代码如下

SparkUtil

Constants.TASK_RADAR:sparkUtil.TaskRadarStr(taskRadar);break;

Constants.TASK_RADAR

分支后会调用SparkUtil类中的TaskRadarStr方法来处理数据BigData-Etl-KongGuan/src/main/java/com/qrsoft/etl/spark/SparkUtil.java类中相关的核心代码如下

/***

strs){System.out.println(strs);String[]

str

strs.split(,);logger.info(str.toString());try

sectionG

Double.valueOf(str[9]);if(mapMan.isInRectangleArea(lat,lng,sectionG[0],sectionG[1],sectionG[2],sectionG[3])){sectionVal

G;}else

if(mapMan.isInRectangleArea(lat,lng,sectionK[0],sectionK[1],sectionK[2],sectionK[3])){sectionVal

K;}else

if(mapMan.isInRectangleArea(lat,lng,sectionE[0],sectionE[1],sectionE[2],sectionE[3])){sectionVal

E;};System.out.println();System.out.println(sectionVal);System.out.println();MultiRadar

new

MultiRadar(str[1],str[12],str[11],str[0],str[17],str[15],str[18],str[19],str[9],str[8],str[7],str[13],str[14],str[10],str[3],str[6],str[4],str[16],str[5],str[2],sectionVal);mr.setAcid(str[0]);mr.setAreaSource(str[1]);mr.setClimbordownSpeed(str[2]);mr.setDirection(str[3]);mr.setFcu(str[4]);mr.setFlyStatus(str[5]);mr.setRadarCFL(str[6]);mr.setRadarHeight(str[7]);mr.setRadarLatitude(str[8]);mr.setRadarLongTitude(str[9]);mr.setRadarSpeed(str[10]);mr.setRadarType(str[11]);mr.setSendRadarTime(str[12]);mr.setSpeedX(str[13]);mr.setSpeedY(str[14]);mr.setSsrCode(str[15]);mr.setTime(str[16]);mr.setTrackNumber(str[17]);mr.setZhiJiaoX(str[18]);mr.setZhiJiaoY(str[19]);mr.setSection(sectionVal);//根据航班号查询是否已经开始对该航迹进行统计MultiRadarDao

dao

dao.isExistThisRadar(mr.getAcid());if(bool)

{//存在修改数据库中该航迹dao.updateAnRadarMsg(mr);}else{//尚未进行统计

创建一个统计信息dao.createAnRadarMsg(mr);}}catch

(Exception

e){e.printStackTrace();logger.info(

MultiRadar错误数据

在处理“实时飞行的航迹数据”时会使用到一个辅助类MapManager该类的功能包括判断飞机是否在指定的矩形区域内、判断飞机是否在指定的经纬度范围内核心代码如下

public

maxLat)){//如果在纬度的范围内if(minLng*maxLng0){if(this.isInRange(lng,

minLng,

{if(Math.abs(minLng)Math.abs(maxLng)180){if(this.isInRange(lng,

minLng,

2、打开前端Vue项目kongguan_web完成前端Vue页面src/views/Home/Map.vue设计

在Vue页面

中引入百度地图首先添加百度地图背景图并在地图上飞机飞机相当于在地图上添加mark点

其中bm-marker是飞机bm-label是飞机旁边显示的标签通过v-for标签循环绑定数据

例如v-foritem

caseListcaseList是在下边的数据获取步骤中赋值的。

templatediv

clickgetClickInfo:scroll-wheel-zoomtrue

v-foritem

:rotationNumber(item.direction):icon{url:

urlz(item.id),

item.radarLatitude}:contentitem.acid:labelStyle{color:

gray,

rgba(0,0,0,0),border:0}titleHover

me//bm-marker!--

anchorBMAP_ANCHOR_TOP_LEFT/bm-navigation/baidu-map

...

页面中包含G、K、E三个扇区的按钮并绑定了click事件当点击其中任意一个扇区对应的按钮时会触发click事件执行clickData方法clickData方法在后面的步骤中定义主要是根据传入的不同的参数G、K、E获取不同扇区的数据。

...

ensp;{{newDate().getHours()}}:{{new

stylemargin-left:

#f17140{{count1}}/span/div/divdiv

classsectors1

clickclickData(G)G/el-buttonel-button

:classisActive

2?active:clickclickData(K)k/el-buttonel-button

:classisActive

3?active:clickclickData(E)E/el-button/div/divdiv

classsectors2

classtitle扇区状态栏/divdivel-button

stylemargin-left:

clickclickData(G)G/el-buttonel-button

:classisActive

2?active:clickclickData(K)k/el-buttonel-button

:classisActive

3?active:clickclickData(E)E/el-button/div/divdiv

classsimi_box

25px{{it.gjSector}}/spanspanstylemargin-left:

effectdarkspan

bold;{{it.gj_acids}}/span/divdiv

styleheight:

none{{it.gj_distinct}}/td/tr/table/div/div/div/div/div

/template

{findLocusCount,findMultRadar,findWarnSimilarOfATC,findWarnSimilarOfATCCount,findWarnTp}

from

require(../../assets/images/fj.png),url2:

require(../../assets/images/hfj.png),markerPoint:

{lng:

其中loadData方法是用来获取实时飞行数据loadWarn方法是获取告警信息clickData方法是响应扇区按钮的点击事件查询不同扇区对应的数据。

...

{this.loadWarn();this.loadData();this.clickData();this.timeOut();},beforeDestroy()

//页面关闭时清除定时器

window.clearInterval(this.timer);this.timer

null;},destroyed()

{window.clearInterval(this.timer);this.timer

null;

i0;ithis.warnList.length;i){var

value1

this.warnList[i].gj_track_num1;var

value2

this.warnList[i].gj_track_num2;if(value1

data

data.result;this.caseList.forEach(it

{it.count

{this.$message.error(数据获取失败);}})},loadWarn(){findWarnTp().then(data

{if

{this.warnList.error(数据获取失败);}})},clickData(data)

{if

data}findLocusCount(data).then(data

{if

{this.warnList.error(数据获取失败);}}),findWarnSimilarOfATC(data).then(data

{if

{this.atcList.error(数据获取失败);}}),findWarnSimilarOfATCCount(data).then(data

{if

{this.count1.error(数据获取失败);}})},

...

{window.clearInterval(this.timer)}

else

src/api/map/map.js用于访问服务端相应的Controller主要是通过findMultRadar()方法“查询综合航迹数据”并显示航迹图还会涉及到“管制指令纠错”、“根据扇区名称获取该扇区航班数”、“根据扇区号查询相似航班”、“根据扇区号查询相似航班告警总数”等数据的展示

import

../../utils/request;//综合航迹数据查询相关的服务器端请求的根路径

const

request({url:baseUrl/findMultRadar,method:

get,})

request({url:warUrl/findWarnTp,method:

get,})

request({url:atcUrl/findLocusCount?planSectorNamedata,method:

get,})

findWarnSimilarOfATC(data){return

request({url:warSimUrl/findWarnSimilarOfATC?sectorNamedata,method:

get,})

findWarnSimilarOfATCCount(data){return

request({url:warSimUrl/findWarnSimilarOfATCCount?sectorNamedata,method:

get,})

localStorage.getItem(Authorization);if

(token

3、打开后端项目BigData-KongGuan完成后台逻辑实现

编写以下Controller类来处理客户端发送过来的请求涉及以下几个类

类/接口

com.qrsoft.controller.AtcController扇区操作类处理客户端的

/api/atc

相关的扇区操作请求com.qrsoft.controller.MultiRadarController综合航迹数据处理客户端的

/api/multiRadar

相关的综合航迹数据查询请求com.qrsoft.controller.WarnFlightHistoryController年度告警统计处理客户端的

相关的年度统计查询请求com.qrsoft.controller.WarnSimilarHistoryController航班告警处理客户端的

1在com.qrsoft.controller.AtcController类中主要调用其中的

findLocusCount()

service.findLocusCount(planSectorName);

Api(tags

获取各扇区航班数)GetMapping(/findSectorSortie)public

Result

service.findSectorSortie();}/***

根据扇区名称获取该扇区航班数*/ApiOperation(value

根据扇区名称获取该扇区航班数)GetMapping(/findLocusCount)public

Result

service.findLocusCount(planSectorName);}/***

扇区架次数动态统计(饼状图)*/ApiOperation(value

扇区架次数动态统计(饼状图))GetMapping(/findATCTime)public

Result

2在com.qrsoft.controller.MultiRadarController类中主要调用findMultRadar()方法用于综合航迹数据查询MultiRadarController类的内容如下

Api(tags

RequestMapping(/api/multiRadar)

public

查询综合航迹数据*/GetMapping(/findMultRadar)public

Result

3在com.qrsoft.controller.WarnFlightHistoryController类中主要调用

findWarnTp()

WarnFlightHistoryController类的完整内容如下

Api(tags

RequestMapping(/api/warnFlightHistory)

public

年度警告分类统计)GetMapping(/annualWarningStatisticsByCategory)public

Result

annualWarningStatisticsByCategory(){return

service.annualWarningStatisticsByCategory();}/***

年度警告区域统计)GetMapping(/annualWarningAreaStatistics)public

Result

annualWarningAreaStatistics(){return

service.annualWarningAreaStatistics();}/***

管制指令纠错)GetMapping(/findWarnTp)public

Result

4创建com.qrsoft.controller.WarnSimilarHistoryController类在类中主要调用findWarnSimilarOfATC()和findWarnSimilarOfATCCount()方法用于“根据扇区号查询相似航班告警”和“根据扇区号查询相似航班告警总数”。

/**

GetMapping(/findWarnSimilarOfATC)

public

findWarnSimilarOfATC(RequestParam

String

service.findWarnSimilarOfATC(sectorName);

/**

GetMapping(/findWarnSimilarOfATCCount)

public

findWarnSimilarOfATCCount(RequestParam

String

service.findWarnSimilarOfATCCount(sectorName);

WarnSimilarHistoryController类的完整代码如下

package

com.qrsoft.service.WarnSimilarHistoryService;

import

io.swagger.annotations.ApiOperation;

import

org.springframework.beans.factory.annotation.Autowired;

import

org.springframework.web.bind.annotation.GetMapping;

import

org.springframework.web.bind.annotation.RequestMapping;

import

org.springframework.web.bind.annotation.RequestParam;

import

org.springframework.web.bind.annotation.RestController;Api(tags

航班告警)

RequestMapping(/api/warnSimilarHistory)

public

查询相似航班告警)GetMapping(/findWarnSimilarHistory)public

Result

findWarnSimilarHistory(){return

service.findWarnSimilarHistory();}/***

根据扇区号查询相似航班告警*/ApiOperation(value

根据扇区号查询相似航班)GetMapping(/findWarnSimilarOfATC)public

Result

findWarnSimilarOfATC(RequestParam

String

service.findWarnSimilarOfATC(sectorName);}/***

根据扇区号查询相似航班告警总数*/ApiOperation(value

根据扇区号查询相似航班告警总数)GetMapping(/findWarnSimilarOfATCCount)public

Result

findWarnSimilarOfATCCount(RequestParam

String

service.findWarnSimilarOfATCCount(sectorName);}

编写以下Controller对应的Service类包括以下几个类

类/接口

com.qrsoft.service.AtcService扇区操作的业务模块处理类com.qrsoft.service.MultiRadarService综合航迹数据查询的业务模块处理类com.qrsoft.service.WarnFlightHistoryService年度告警数据查询的业务模块处理类com.qrsoft.service.WarnSimilarHistoryService航班告警数据查询的业务模块处理类

1com.qrsoft.service.AtcService类的内容如下

Service

baseMapper.findSectorSortie();return

new

Result(ResultConstants.SUCCESS,

sectorSortie);}/***

QueryWrapper();queryWrapper.eq(section,planSectorName);int

count

multiRadarService.count(queryWrapper);return

new

Result(ResultConstants.SUCCESS,

count);}/***

ArrayList();sectorName.add(K);sectorName.add(S);sectorName.add(E);sectorName.add(P);sectorName.add(G);ListString

executeTime

baseMapper.findATCTime2(executeTime.get(i),

sectorName.get(j));HashMapString,

Object

{map.put(atcTime2.getPlanSectorName(),

{map.put(sectorName.get(j),0);}objects.add(map);}list.add(objects);}return

new

Result(ResultConstants.SUCCESS,

list);}

2创建com.qrsoft.service.MultiRadarService类类中包含一个findMultRadar()方法用于查询综合航迹数据内容如下

package

com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;

import

com.qrsoft.common.ResultConstants;

import

com.qrsoft.mapper.MultiRadarMapper;

import

org.springframework.stereotype.Service;import

public

baseMapper.selectList(null);return

new

Result(ResultConstants.SUCCESS,

ResultConstants.C_SUCCESS,multiRadars);}

3com.qrsoft.service.WarnFlightHistoryService类的内容如下

Service

ServiceImplWarnFlightHistoryMapper,

WarnFlightHistory

annualWarningAreaStatistics(){ListWarnFlightHistory

warnFlightHistories

baseMapper.annualWarningAreaStatistics();return

new

Result(ResultConstants.SUCCESS,

ResultConstants.C_SUCCESS,warnFlightHistories);}/***

年度警告分类统计*/public

annualWarningStatisticsByCategory(){ListWarnFlightHistory

warnFlightHistories

baseMapper.annualWarningStatisticsByCategory();return

new

Result(ResultConstants.SUCCESS,

ResultConstants.C_SUCCESS,warnFlightHistories);}/***

管制指令纠错*/public

findWarnTp(){ListHashMapString,

Object

(String)hm.get(gj_acids);String[]

split

gj_acids.split(-);System.out.println(split.length);if(split.length2)

{Integer

Result(ResultConstants.SUCCESS,

ResultConstants.C_SUCCESS,result);}

4创建com.qrsoft.service.WarnSimilarHistoryService类内容如下

package

com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;

import

com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;

import

com.qrsoft.common.ResultConstants;

import

com.qrsoft.entity.WarnSimilarHistory;

import

com.qrsoft.mapper.MultiRadarMapper;

import

com.qrsoft.mapper.WarnSimilarHistoryMapper;

import

org.springframework.beans.factory.annotation.Autowired;

import

org.springframework.stereotype.Service;import

java.util.ArrayList;

ServiceImplWarnSimilarHistoryMapper,

WarnSimilarHistory

findWarnSimilarHistory(){ListWarnSimilarHistory

warnSimilarHistory

baseMapper.findWarnSimilarHistory();return

new

Result(ResultConstants.SUCCESS,

ResultConstants.C_SUCCESS,warnSimilarHistory);}/***

根据扇区号查询相似航班*/public

sectorName){QueryWrapperMultiRadar

queryWrapper

QueryWrapper();queryWrapper.eq(section,sectorName);ListMultiRadar

list

multiRadarMapper.selectList(queryWrapper);ListMapString,String

result

ArrayList();System.out.println(list);for(MultiRadar

m2:list){String

m2.getAcid();if(acid2.startsWith(substring)){if(acid1.equals(acid2)){break;}HashMapString,

String

acid2);res.put(gjSector,sectorName);result.add(res);break;}}}return

new

Result(ResultConstants.SUCCESS,

ResultConstants.C_SUCCESS,result);}/***

查询航班数量*/public

findWarnSimilarOfATCCount(String

sectorName){Result

this.findWarnSimilarOfATC(sectorName);Object

result

warnSimilarOfATC.getResult();List?

result1

Result(ResultConstants.SUCCESS,

ResultConstants.C_SUCCESS,size);}

类/接口

com.qrsoft.mapper.AtcMapper扇区操作的数据访问类com.qrsoft.mapper.MultiRadarMapper综合航迹数据查询的数据访问类com.qrsoft.mapper.WarnFlightHistoryMapper年度告警数据查询的数据访问类com.qrsoft.mapper.WarnSimilarHistoryMapper航班告警数据查询的数据访问类

1com.qrsoft.mapper.AtcMapper类的内容如下

Mapper

findSectorSortie();Select(select

EXECUTE_DATE

2com.qrsoft.mapper.MultiRadarMapper类的内容如下

Mapper

3com.qrsoft.mapper.WarnFlightHistoryMapper类的内容如下

Mapper

annualWarningAreaStatistics();Select(select

gj_name,count(*)

annualWarningStatisticsByCategory();Select(select

gj_type,gj_id,gj_msg_type,gj_track_num1,gj_track_num2,gj_distinct,gj_radian,gj_name,gj_distinct_bz,gj_city,gj_date,gj_acids,gj_num1_long,gj_num1_lat,gj_num2_long,gj_num2_lat

from

warntp_number;)ListHashMapString,Object

count(*)

4创建com.qrsoft.mapper.WarnSimilarHistoryMapper类内容如下

package

com.baomidou.mybatisplus.core.mapper.BaseMapper;

import

com.qrsoft.entity.WarnSimilarHistory;

import

org.apache.ibatis.annotations.Mapper;

import

org.apache.ibatis.annotations.Param;

import

org.apache.ibatis.annotations.Select;import

public

findWarnSimilarHistory();Select(SELECT

gj_sector,gj_acid

findWarnSimilarOfATC(Param(sectorName)

String

涉及的数据实体类包括在前面的任务中已经创建过此处只需确认一下是否存在

类/接口

com.qrsoft.entity.Atc扇区对应的实体类com.qrsoft.entity.MultiRadar雷达对应的实体类com.qrsoft.entity.WarnFlightHistory年度告警飞行历史记录对应的实体类com.qrsoft.entity.WarnSimilarHistory航班告警历史记录对应的实体类com.qrsoft.entity.Company航空公司信息表对应的实体类com.qrsoft.common.Result返回结果类com.qrsoft.common.ResultConstants返回常量结果类

1需要创建com.qrsoft.entity.WarnSimilarHistory类用于航班告警历史记录对应的实体类内容如下

package

com.baomidou.mybatisplus.annotation.TableField;

import

com.baomidou.mybatisplus.annotation.TableName;

import

lombok.NoArgsConstructor;import

AllArgsConstructor

TableName(warnsimilarhistory_number)

public

页面显示效果下面图中是原企业项目的真实展示页面在当前项目中由于数据集的特点实际展示效果可能会有差异