場景

通過給車輛的駕駛員的手機安裝app,管理員在后臺可以實時查看車輛的實時位置。

實現(xiàn)思路：

app中集成高德地圖，app啟動登錄后，定時地獲取當(dāng)前定位信息連同當(dāng)前賬號上傳到服務(wù)器后臺。

后臺將獲取的數(shù)據(jù)按照駕駛員的賬號為唯一性的標(biāo)識存入數(shù)據(jù)庫，如果之前數(shù)據(jù)庫沒有，則插入數(shù)據(jù)庫，如果之前有，則進行更新。

然后前端頁面在獲取某個駕駛員的實時位置時，將駕駛員的賬號作為查詢條件去查詢坐標(biāo)，然后在前端頁面中的高德地圖上進行顯示。

若依前后端分離版手把手教你本地搭建環(huán)境并運行項目：

https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/108465662

在上面的博客中將前后端的項目搭建并運行成功。

APP中集成高德地圖實現(xiàn)定時上傳坐標(biāo)的功能自行實現(xiàn)。

Vue中集成高德地圖API實現(xiàn)定位與自定義樣式信息窗體：

https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/114162130

然后前端Vue中實現(xiàn)根據(jù)坐標(biāo)定位顯示參照上面。

注：

博客主頁：
https://blog.csdn.net/badao_liumang_qizhi
關(guān)注公眾號
霸道的程序猿
獲取編程相關(guān)電子書、教程推送與免費下載。

實現(xiàn)

首先設(shè)計定位信息的數(shù)據(jù)庫

?

然后使用代碼生成，針對此表生成代碼

若依前后端分離版怎樣根據(jù)數(shù)據(jù)庫生成代碼并快速實現(xiàn)某業(yè)務(wù)的增刪改查：

https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/108316087

然后修改新增接口

??? @PostMapping("/insertOrUpdateCoordinate")@ApiOperation("更新司機車輛定位消息")public AjaxResult insertOrUpdateCoordinate(@RequestBody MqttVo mqttVo){return AjaxResult.success(busEmployeeCarCoordinateService.insertOrUpdateCoordinate(mqttVo));}

然后在方法實現(xiàn)中進行邏輯判斷，如果之前沒有，則執(zhí)行插入，如果之前有則執(zhí)行更新。

把這個接口跟APP對接，作為坐標(biāo)信息的上傳接口。

然后前端請求后臺獲取司機的坐標(biāo)信息直接使用該表的查詢接口，司機的賬號作為查詢條件。

效果

?

?

總結(jié)

以上是生活随笔為你收集整理的Android+SpringBoot+Vue+高德地图实现后台查看车辆实时位置功能的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。