merge
parent
318c0c6f3a
commit
3c12bce449
|
|
@ -5,6 +5,7 @@ VITE_USE_MOCK = true
|
|||
VITE_PUBLIC_PATH = /
|
||||
|
||||
# Basic interface address SPA
|
||||
|
||||
#基础框架
|
||||
VITE_GLOB_API_URL = http://192.168.10.163:9620
|
||||
|
||||
|
|
@ -15,9 +16,19 @@ VITE_GLOB_UPLOAD_URL= http://60.213.14.14:6070
|
|||
|
||||
VITE_GLOB_INFO_IMAGE_URL=http://120.222.154.48:6050
|
||||
|
||||
|
||||
# java
|
||||
VITE_GLOB_COFFEE_API_URL = http://221.2.83.243:6050/coffee
|
||||
|
||||
# geoserver
|
||||
VITE_GLOB_GEOSERVER_BASE_URL = http://192.168.10.163:8080
|
||||
|
||||
# 导航
|
||||
VITE_GLOBAL_NAVIGATION_BASE_URL = http://221.2.83.243:8091
|
||||
|
||||
# ANYRTC CALL
|
||||
VITE_GLOB_ANYRTC_BASE_URL = https://ktdrw.wisestcity.com:6070
|
||||
|
||||
# Interface prefix
|
||||
VITE_GLOB_API_URL_PREFIX=
|
||||
|
||||
|
|
|
|||
|
|
@ -25,6 +25,13 @@ VITE_GLOB_INFO_IMAGE_URL= http://221.2.83.243:6050/core
|
|||
# geoserver
|
||||
VITE_GLOB_GEOSERVER_BASE_URL = http://221.2.83.243:6050/
|
||||
|
||||
# 导航
|
||||
VITE_GLOBAL_NAVIGATION_BASE_URL = http://221.2.83.243:8091
|
||||
|
||||
# 视频通话
|
||||
VITE_GLOB_ANYRTC_BASE_URL = https://ktdrw.wisestcity.com:6070
|
||||
|
||||
|
||||
# File upload address， optional
|
||||
# It can be forwarded by nginx or write the actual address directly
|
||||
|
||||
|
|
|
|||
|
|
@ -168,7 +168,8 @@
|
|||
"vuex": "^4.1.0",
|
||||
"xe-utils": "^3.5.14",
|
||||
"xlsx": "^0.18.5",
|
||||
"@turf/helpers": "^7.2.0"
|
||||
"@turf/helpers": "^7.2.0",
|
||||
"proj4":"^2.19.10"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 168 KiB |
|
|
@ -35,7 +35,7 @@
|
|||
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore';
|
||||
import { EventBus } from '@/utils/eventBus';
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
import { gcj02towgs84 } from 'coordtransform'
|
||||
import {getRedisUser,addOrUpdateRedisUser,getLockedClients,getTsgzProjectId,applyDroneControl} from '@/api/demo/airportMaintenance';
|
||||
import { airPortStore } from '@/store/modules/airport';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
|
|
@ -151,7 +151,10 @@
|
|||
|
||||
const flyToMap = (lngLat:string) =>{
|
||||
let lngLatArr = lngLat.split(",");
|
||||
window.globalMap.flyToPoint([Number(lngLatArr[0]),Number(lngLatArr[1])],{radius:200});
|
||||
|
||||
// 从gcj-02坐标系转换为wgs84坐标系
|
||||
let wgs84Coord = gcj02towgs84(lngLatArr[0],lngLatArr[1]);
|
||||
window.globalMap.flyToPoint([Number(wgs84Coord[0]),Number(wgs84Coord[1])],{radius:200});
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -97,7 +97,7 @@
|
|||
import * as mars3d from "mars3d";
|
||||
import * as Cesium from 'mars3d-cesium';
|
||||
|
||||
var { VITE_GLOB_API_URL } = getAppEnvConfig();
|
||||
var { VITE_GLOB_API_URL, VITE_GLOB_ANYRTC_BASE_URL } = getAppEnvConfig();
|
||||
|
||||
const methodsShow = ref(false)
|
||||
|
||||
|
|
@ -268,11 +268,18 @@
|
|||
|
||||
getUserList();
|
||||
|
||||
// 定时查询更新在线人员
|
||||
setInterval(function(){
|
||||
getUserList();
|
||||
},5000)
|
||||
|
||||
|
||||
|
||||
// 视频通话
|
||||
const callUserShow = ref(false);
|
||||
|
||||
const callUser = (user) => {
|
||||
window.open(`http://localhost:9239/#/?userID=yishuixian&callUserID=${user.phone}`,"视频通话", "location=no,toolbar=no,menubar=no,scrollbars=yes,resizable=yes,width=640,height=460");
|
||||
window.open(`${VITE_GLOB_ANYRTC_BASE_URL}/#/?userID=System&callUserID=${user.phone}`,"视频通话", "location=no,toolbar=no,menubar=no,scrollbars=yes,resizable=yes,width=778,height=594");
|
||||
}
|
||||
|
||||
// 置顶用户
|
||||
|
|
|
|||
|
|
@ -87,7 +87,6 @@
|
|||
<div class="add-item-container" @click="methodsShow = !methodsShow;"></div>
|
||||
<div class="add-item-text">操作</div>
|
||||
<div class="methods-container">
|
||||
|
||||
<div class="methods-item" v-for="(item,index) in methods" :key="index" @click="selectMethods(item)">
|
||||
<div class="icon">
|
||||
<img :src="'/components/Task/taskassign/methods-'+item.icon+'.png'" alt="">
|
||||
|
|
@ -748,6 +747,10 @@
|
|||
label:"无人机核查",
|
||||
icon:"uav",
|
||||
value:"uav",
|
||||
},{
|
||||
label:"三维模型",
|
||||
icon:"model",
|
||||
value:"model",
|
||||
},{
|
||||
label:"直升机核查",
|
||||
icon:"helicopter",
|
||||
|
|
@ -793,6 +796,10 @@
|
|||
handlerResponseClue(item);
|
||||
break;
|
||||
|
||||
case "model":
|
||||
handlerModel(item);
|
||||
break;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -928,10 +935,6 @@
|
|||
let data = res.data.result[0];
|
||||
clueInfo.value = data;
|
||||
|
||||
console.log("clueInfo",clueInfo.value);
|
||||
|
||||
|
||||
|
||||
// 获取任务列表
|
||||
handlerGetTaskList();
|
||||
|
||||
|
|
@ -1707,6 +1710,10 @@
|
|||
})
|
||||
}
|
||||
|
||||
// 三维模型
|
||||
function handlerModel(item){
|
||||
changeButton("三维模型")
|
||||
}
|
||||
const changeButton = (type) => {
|
||||
eventHandlerHook(
|
||||
chartEditStore.getComponentList,
|
||||
|
|
@ -2727,11 +2734,10 @@
|
|||
}
|
||||
.methods-container{
|
||||
position:absolute;
|
||||
padding:30px 4px 10px 10px;
|
||||
padding:20px 4px 10px 10px;
|
||||
bottom: 74px;
|
||||
right: -160px;
|
||||
width:160px;
|
||||
height:300px;
|
||||
background-image:url(@/assets/images/chart/tasks/taskassign/methods-container-bg.png);
|
||||
background-size: 100% 100%;
|
||||
display:none;
|
||||
|
|
|
|||
|
|
@ -6,17 +6,26 @@
|
|||
<div class="clear-button" @click="drawClear"></div>
|
||||
</div>
|
||||
<div class="model-container">
|
||||
<div class="model" v-for="(item,index) in modelList" :key="index"
|
||||
@click="startMeasure(item.name)"
|
||||
|
||||
<!-- 模型列表 -->
|
||||
<div class="model" v-for="(item,index) in currentModelList" :key="index"
|
||||
@click="flyToModel(item)"
|
||||
>
|
||||
<div class="select-box">
|
||||
<!-- <div class="select-box">
|
||||
<a-checkbox v-model:checked="checked"></a-checkbox>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="file-icon">
|
||||
<FileOutlined />
|
||||
</div>
|
||||
<div class="label">{{item.meshPath}}</div>
|
||||
</div>
|
||||
<!-- 数据为空 -->
|
||||
<div class="data-empty" v-if="currentModelList.length == 0">
|
||||
<p style="font-size:40px;margin:0px;margin-top:30px;">
|
||||
<DropboxOutlined />
|
||||
</p>
|
||||
暂无数据
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -45,7 +54,9 @@
|
|||
import { listDronePort, saveHandFlyTask, endHandFlyTask, endAiInspection } from '@/api/situation';
|
||||
import * as mars3d from "mars3d";
|
||||
import * as Cesium from 'mars3d-cesium';
|
||||
import {SearchOutlined,CloseCircleFilled,FileOutlined} from '@ant-design/icons-vue';
|
||||
import proj4 from 'proj4';
|
||||
import {SearchOutlined,CloseCircleFilled,FileOutlined,DropboxOutlined} from '@ant-design/icons-vue';
|
||||
|
||||
|
||||
import StableWebSocket from './lib/StableWebSocket';
|
||||
|
||||
|
|
@ -67,8 +78,6 @@
|
|||
});
|
||||
|
||||
|
||||
|
||||
|
||||
const { w, h, x, y } = toRefs(props.chartConfig.attr);
|
||||
|
||||
const chartEditStore = useChartEditStore();
|
||||
|
|
@ -464,13 +473,11 @@
|
|||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// websocket连接
|
||||
|
||||
// 创建实例
|
||||
const ws = new StableWebSocket({
|
||||
url: 'ws://221.2.83.243:6090',
|
||||
url: 'ws://221.2.83.243:6050/wsapp/',
|
||||
reconnectInterval: 3000, // 重连间隔3秒
|
||||
maxReconnectAttempts: 10, // 最多重连10次
|
||||
heartbeatInterval: 30000, // 心跳间隔30秒
|
||||
|
|
@ -485,6 +492,10 @@
|
|||
|
||||
ws.onMessage((data) => {
|
||||
console.log('收到消息:', data);
|
||||
if(data.type == 'map_update'){
|
||||
let modelList:Model[] = data.data.MeshList;
|
||||
mapRender(modelList);
|
||||
}
|
||||
});
|
||||
|
||||
ws.onError((error) => {
|
||||
|
|
@ -507,38 +518,162 @@
|
|||
// 手动重连
|
||||
// ws.reconnect();
|
||||
|
||||
|
||||
const currentModelList = ref<Model[]>([])
|
||||
|
||||
// 获取新的数组 判断有无新数据 追加
|
||||
function mergeModelsWithMap(newModels: Model[]) {
|
||||
|
||||
if (!modelList.value) {
|
||||
modelList.value = [...newModels];
|
||||
return;
|
||||
}
|
||||
|
||||
// 将现有模型转为 Map，以 meshPath 为 key
|
||||
const existingMap = new Map(
|
||||
modelList.value.map(model => [model.meshPath, model])
|
||||
);
|
||||
|
||||
// 合并新模型
|
||||
newModels.forEach(model => {
|
||||
if (!existingMap.has(model.meshPath)) {
|
||||
existingMap.set(model.meshPath, model);
|
||||
}
|
||||
});
|
||||
|
||||
// 转回数组
|
||||
modelList.value = Array.from(existingMap.values());
|
||||
function addNewModels(newArray: Model[]): Model[] {
|
||||
// 找出 newArray 中比 originalArray 多的元素
|
||||
const addedModels = newArray.filter(newModel => {
|
||||
// 检查 originalArray 中是否存在相同的 model
|
||||
return !currentModelList.value?.some(originalModel =>
|
||||
// 根据 meshPath 判断是否相同（假设 meshPath 是唯一标识）
|
||||
originalModel.meshPath === newModel.meshPath
|
||||
);
|
||||
});
|
||||
|
||||
// 将多的元素添加到原数组
|
||||
currentModelList.value?.push(...addedModels);
|
||||
|
||||
return addedModels;
|
||||
}
|
||||
|
||||
|
||||
let graphicLayer:mars3d.layer.GraphicLayer;
|
||||
|
||||
// 叠加飞机中心点、轨迹、三维模型
|
||||
function mapRender ():void{
|
||||
function mapRender (modelListTemp:Model[]){
|
||||
|
||||
let addedModels:Model[] = addNewModels(modelListTemp);
|
||||
|
||||
console.log("addedModels",addedModels);
|
||||
|
||||
|
||||
let modelCenter = localToCartesian(0,0,0);
|
||||
|
||||
if(!graphicLayer){
|
||||
graphicLayer = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(graphicLayer);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 加载三维模型
|
||||
addedModels.forEach((mesh,index)=>{
|
||||
|
||||
// 计算模型中心点（用于放置位置）
|
||||
const centerX = (mesh.boxMinX + mesh.boxMaxX) / 2;
|
||||
const centerY = (mesh.boxMinY + mesh.boxMaxY) / 2;
|
||||
const centerZ = (mesh.boxMinZ + mesh.boxMaxZ) / 2;
|
||||
|
||||
let coordinate = localToCartesian(centerX,centerY,centerZ);
|
||||
|
||||
// 中心点
|
||||
const graphicCenter = new mars3d.graphic.BillboardEntity({
|
||||
position: [coordinate.lng,coordinate.lat,coordinate.alt],
|
||||
style: {
|
||||
image: "https://data.mars3d.cn/img/marker/lace-blue.png",
|
||||
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
||||
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||
clampToGround:true,
|
||||
label:{
|
||||
text:index,
|
||||
pixelOffsetY:-45
|
||||
}
|
||||
},
|
||||
attr: { remark: "点状数据position" }
|
||||
})
|
||||
graphicLayer.addGraphic(graphicCenter)
|
||||
|
||||
// return null;
|
||||
|
||||
let url = mesh.meshPath.replace('D:/S1/Project/droneProject/Multiply/2026-01-17 133410/mesh/', 'http://221.2.83.243:6090/mesh/');
|
||||
|
||||
const graphic = new mars3d.graphic.ModelPrimitive({
|
||||
id:"mesh-"+index,
|
||||
position:[modelCenter.lng,modelCenter.lat,0],
|
||||
style: {
|
||||
url: url,
|
||||
scale: 1,
|
||||
heading:90,
|
||||
pitch:90,
|
||||
roll:0,
|
||||
clampToGround: true,
|
||||
}
|
||||
})
|
||||
|
||||
graphicLayer.addGraphic(graphic)
|
||||
|
||||
window.globalMap.flyToGraphic(graphicCenter,{
|
||||
radius:300
|
||||
});
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
function flyToModel(mesh){
|
||||
console.log("item",mesh);
|
||||
|
||||
// 计算模型中心点（用于放置位置）
|
||||
const centerX = (mesh.boxMinX + mesh.boxMaxX) / 2;
|
||||
const centerY = (mesh.boxMinY + mesh.boxMaxY) / 2;
|
||||
const centerZ = (mesh.boxMinZ + mesh.boxMaxZ) / 2;
|
||||
|
||||
let coordinate = localToCartesian(centerX,centerY,centerZ);
|
||||
|
||||
window.globalMap.flyToPoint([Number(coordinate.lng),Number(coordinate.lat)],{radius:200});
|
||||
}
|
||||
|
||||
// 获取中心点坐标
|
||||
function localToCartesian(localX, localY, localZ) {
|
||||
|
||||
// 局部坐标转UTM
|
||||
const utmEasting = localX + 39618741.9701438756;
|
||||
const utmNorthing = localY + 3908434.925520379;
|
||||
const altitude = localZ + 142.45785522460938;
|
||||
|
||||
// UTM转WGS84经纬度（需要proj4库）
|
||||
// Zone 39N, WGS84
|
||||
const wgs84 = '+proj=utm +zone=39 +ellps=WGS84 +datum=WGS84 +units=m +no_defs';
|
||||
|
||||
const EPSG4527 = proj4.defs("EPSG:4527","+proj=tmerc +lat_0=0 +lon_0=117 +k=1 +x_0=39500000 +y_0=0 +ellps=GRS80 +units=m +no_defs +type=crs");
|
||||
|
||||
const EPSG4490 = proj4.defs("EPSG:4490","+proj=longlat +datum=WGS84 +no_defs +type=crs");
|
||||
|
||||
// const lonLat = proj4(wgs84, 'EPSG:4326', [utmEasting, utmNorthing]);
|
||||
|
||||
const lonLat = proj4("EPSG:4527", "EPSG:4490", [utmEasting, utmNorthing]);
|
||||
|
||||
// 返回Cesium笛卡尔坐标
|
||||
return {
|
||||
lng:lonLat[0], // 经度
|
||||
lat:lonLat[1], // 纬度
|
||||
alt:altitude // 高程（椭球高）
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
// 模拟websocket
|
||||
function simulationWebsocket():void{
|
||||
let node = 0;
|
||||
|
||||
let modelListTemp:Model[] = [];
|
||||
|
||||
setInterval(function(){
|
||||
modelListTemp = modelList.value?.slice(0,node);
|
||||
node ++;
|
||||
// mapRender(modelListTemp);
|
||||
},10000)
|
||||
}
|
||||
|
||||
|
||||
|
||||
setTimeout(function(){
|
||||
simulationWebsocket();
|
||||
|
||||
},10000)
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -605,9 +740,6 @@ function mapRender ():void{
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.measure-container{
|
||||
|
|
@ -617,12 +749,11 @@ function mapRender ():void{
|
|||
background-size: 100% 100%;
|
||||
.title{
|
||||
width:100%;
|
||||
padding:0px 30px;
|
||||
font-weight: bold;
|
||||
padding:0px 20px;
|
||||
height:60px;
|
||||
line-height:60px;
|
||||
line-height:50px;
|
||||
color:#fff;
|
||||
font-size:18px;
|
||||
font-size:16px;
|
||||
position:relative;
|
||||
.clear-button{
|
||||
position:absolute;
|
||||
|
|
@ -632,7 +763,6 @@ function mapRender ():void{
|
|||
font-size:14px;
|
||||
font-weight: 400;
|
||||
top:16px;
|
||||
background-image: url(@/assets/images/chart/tasks/measure/clear-draw.png);
|
||||
background-size:100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
cursor:pointer;
|
||||
|
|
@ -660,6 +790,10 @@ function mapRender ():void{
|
|||
width: 60px;
|
||||
}
|
||||
}
|
||||
.data-empty{
|
||||
color:#fff;
|
||||
text-align:center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -45,6 +45,7 @@ export default [
|
|||
TaskAssignConfig,
|
||||
HikvisionConfig,
|
||||
OnlineUsersConfig,
|
||||
LocationSearchConfig,
|
||||
MeasureToolsConfig,
|
||||
XgridsModelToolsConfig
|
||||
];
|
||||
|
|
|
|||
|
|
@ -184,12 +184,17 @@ export const getRouterByGD = (params) => {
|
|||
//使用postgres + postgis寻路
|
||||
export const getRouterByPostGis = (params) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
axios.get("http://221.2.83.254:9001/api/FirePrevention/LoadRoad"
|
||||
axios.get("http://221.2.83.243:6050/core/api/FireResources/LoadRoad"
|
||||
+ "?startlng=" + params.startlng
|
||||
+ "&startlat=" + params.startlat
|
||||
+ "&endlng=" + params.endlng
|
||||
+ "&endlat=" + params.endlat
|
||||
+ "&areaname=" + params.areaname
|
||||
+ "&areaname=" + params.areaname,
|
||||
{
|
||||
headers:{
|
||||
"X-Token":localStorage.getItem("X-Token")
|
||||
}
|
||||
}
|
||||
).then((res) => {
|
||||
if (res.data.length > 0) {
|
||||
console.log('res.data::: ', res.data);
|
||||
|
|
|
|||
|
|
@ -229,7 +229,7 @@
|
|||
import {wgs84ToGcj02} from './lib/CoordinateTransform';
|
||||
import { getNameByPosition } from './lib/AMapApi';
|
||||
import { getRouter } from './lib/Navigation';
|
||||
import { getRouterFunc, drawRouterFunc, clearRouterFunc,handlerStartRoaming,handlerStopRoaming } from './lib/routePath'
|
||||
import { getRouterFunc, drawRouterFunc, clearRouterFunc,handlerStartRoaming,handlerStopRoaming } from './lib/routePathNew'
|
||||
import {
|
||||
CloseButton,
|
||||
Title,
|
||||
|
|
@ -440,6 +440,11 @@
|
|||
clearRouterFunc();
|
||||
|
||||
pathPointGraphicLayer ? pathPointGraphicLayer.clear() : null;
|
||||
|
||||
option.dataset.way = [];
|
||||
option.dataset.endWay = [];
|
||||
|
||||
|
||||
}
|
||||
|
||||
function drawPoint(type, lng, lat, z) { // 绘制起点、终点
|
||||
|
|
@ -662,7 +667,7 @@
|
|||
|
||||
// getRouter(postgisParams);
|
||||
|
||||
getRouterFunc(postgisParams,'all').then(res => {
|
||||
getRouterFunc(postgisParams,'postgis').then(res => {
|
||||
if(res){
|
||||
// this.tripFlyArray[index] = res.allCoordinates;
|
||||
console.log("res:999",res);
|
||||
|
|
|
|||
|
|
@ -23,9 +23,12 @@ let pathRoadGraphicLayers2 = null
|
|||
|
||||
|
||||
export const getMethodCommon = (url,params) => {
|
||||
// VITE_GLOB_API_URL
|
||||
return axios("http://221.2.83.254:9001"+url,{
|
||||
method:"GET",
|
||||
// return axios("http://221.2.83.243:6050/core"+""+url,{
|
||||
return axios(VITE_GLOB_API_URL+""+url,{
|
||||
method:"POST",
|
||||
headers:{
|
||||
"X-Token":localStorage.getItem("X-Token")
|
||||
},
|
||||
params:params,
|
||||
})
|
||||
}
|
||||
|
|
@ -52,6 +55,7 @@ export const getRouterFunc = (params, method = 'postgis') => {
|
|||
areaname: "feixian",
|
||||
}
|
||||
getRouterByPostGis(postgisParams).then(geojson => {
|
||||
console.log("geojson",geojson);
|
||||
//postGisCoordinates:postgis返回的geojson取出坐标数组
|
||||
let postGisCoordinates = getOneLineCoordinatesFromGeometry(geojson)
|
||||
let startRouterLngLat = postGisCoordinates[0]
|
||||
|
|
@ -190,15 +194,10 @@ export const getRouterByGD = (params) => {
|
|||
//使用postgres + postgis寻路
|
||||
export const getRouterByPostGis = (params) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
// /api/FireResources/LoadRoad
|
||||
getMethodCommon("/api/FirePrevention/LoadRoad", params).then((res) => {
|
||||
|
||||
console.log("Res1213",res);
|
||||
if (res.data.data.length > 0) {
|
||||
console.log('res.data::: ', res.data);
|
||||
let LineString = res.data.data[0].route;
|
||||
getMethodCommon("/api/FireResources/LoadRoad", params).then((res) => {
|
||||
if (res.data.result.length > 0) {
|
||||
let LineString = res.data.result[0].route;
|
||||
if (LineString == null || LineString == "null") {
|
||||
//没有找到路线，返回空
|
||||
console.log('PostGIS未找到合适了路线')
|
||||
resolve(parse(null))
|
||||
} else {
|
||||
|
|
@ -662,11 +661,11 @@ const getOneLineCoordinatesFromGeometry = (geometry) => {
|
|||
let coordinates = geometry.coordinates
|
||||
// console.log('geometry::: ', geometry);
|
||||
let list = []
|
||||
if (geometry.type == "MultiLineString") {
|
||||
if (geometry.type == "MultiLineString" || geometry.type == "MULTILINESTRING") {
|
||||
coordinates.map(coord => {
|
||||
list = list.concat(coord)
|
||||
})
|
||||
} else if (geometry.type == 'LineString') {
|
||||
} else if (geometry.type == 'LineString' || geometry.type == "LINESTRING") {
|
||||
list = list.concat(geometry.coordinates)
|
||||
} else {
|
||||
list = []
|
||||
|
|
|
|||
|
|
@ -0,0 +1,745 @@
|
|||
import axios from "axios";
|
||||
import { gcj02towgs84, wgs84togcj02 } from 'coordtransform'
|
||||
import * as turf from '@turf/turf'
|
||||
import { Url } from "./urlFormat";
|
||||
// import { getMethodCommon } from "../../../api/common";
|
||||
import { parse } from "./handleGeojson";
|
||||
import { deepClone } from "./utils";
|
||||
const urls = new Url()
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
const { VITE_GLOB_API_URL,VITE_GLOBAL_NAVIGATION_BASE_URL } = getAppEnvConfig();
|
||||
const GD_URL = "https://restapi.amap.com/v5/direction/driving"
|
||||
const GD_KEY = "6af6a87038f44c8c793aa70331f2b7ca"
|
||||
import * as mars3d from 'mars3d';
|
||||
import * as Cesium from 'mars3d-cesium';
|
||||
import { ConsoleSqlOutlined } from "@ant-design/icons-vue";
|
||||
import { geojsonToWKT } from '@terraformer/wkt'
|
||||
|
||||
//路线的图层
|
||||
let pathGraphicLayers = null
|
||||
let pathOneGraphicLayers= null
|
||||
let pathWaterGraphicLayers = null
|
||||
let pathRoadGraphicLayers = null
|
||||
let pathRoadGraphicLayers1 = null
|
||||
let pathRoadGraphicLayers2 = null
|
||||
|
||||
|
||||
export const getMethodCommon = (url,params) => {
|
||||
return axios(`${VITE_GLOBAL_NAVIGATION_BASE_URL}${url}?point=${params.startCoord}&point=${params.endCoord}&profile=car&points_encoded=false`,{
|
||||
method:"GET"
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
//导航寻路
|
||||
export const getRouterFunc = (params, method = 'postgis') => {
|
||||
/**
|
||||
* method：
|
||||
* 当为 postgis时，仅仅使用postgis导航
|
||||
* 默认：all :高德 + postgis
|
||||
* gaode:高德
|
||||
*/
|
||||
let { startlng, startlat, endlng, endlat } = params
|
||||
|
||||
if (method == 'postgis') {
|
||||
//使用gpostgis进行导航
|
||||
return new Promise((resolve, reject) => {
|
||||
let postgisParams = {
|
||||
startCoord:startlat+","+startlng,
|
||||
endCoord:endlat+","+endlng,
|
||||
profile:"car",
|
||||
points_encoded:"false"
|
||||
}
|
||||
getRouterByPostGis(postgisParams).then(geojson => {
|
||||
let postGisCoordinates = getOneLineCoordinatesFromGeometry(geojson)
|
||||
let startRouterLngLat = postGisCoordinates[0]
|
||||
let endRouterLngLat = postGisCoordinates.at(-1)
|
||||
let resObject = {
|
||||
allCoordinates: postGisCoordinates, //全部线路的合集
|
||||
postGisRoute: postGisCoordinates, // postgis线路
|
||||
gdRoute: [],
|
||||
startLngLat: [startlng, startlat], // 起点
|
||||
endLngLat: [endlng, endlat], //终点
|
||||
startRouterLngLat: startRouterLngLat, // 路线查询结果的起点
|
||||
endRouterLngLat: endRouterLngLat, //路线查询结果的终点
|
||||
}
|
||||
let simpleRoute = getMinimumRoute(resObject)
|
||||
resolve(simpleRoute)
|
||||
})
|
||||
}).catch(err => {
|
||||
|
||||
})
|
||||
}
|
||||
if (method == 'all') {
|
||||
// 先用高德进行导航
|
||||
return new Promise((resolve, reject) => {
|
||||
getRouterByGD(params).then(solution => {
|
||||
// solution 为多条线路的数组，现在先用第一条线路 solution.path[0]
|
||||
let gdRoute = solution.path[0]
|
||||
let postgisParams = {
|
||||
startlng: gdRoute.endCoordinates[0],
|
||||
startlat: gdRoute.endCoordinates[1],
|
||||
endlng: endlng,
|
||||
endlat: endlat,
|
||||
areaname: "feixian",
|
||||
}
|
||||
//使用gpostgis求出剩下的路线
|
||||
getRouterByPostGis(postgisParams).then(geojson => {
|
||||
//postGisCoordinates:postgis返回的geojson取出坐标数组
|
||||
let postGisCoordinates = getOneLineCoordinatesFromGeometry(geojson)
|
||||
// 高德返回的第一条线路的坐标数组
|
||||
let path_gd = gdRoute.path_polyline
|
||||
//合并高德和postgis的路线
|
||||
let allCoordinates = path_gd.concat(postGisCoordinates)
|
||||
//导航线路的起点和终点
|
||||
let startRouterLngLat = allCoordinates[0]
|
||||
let endRouterLngLat = allCoordinates.at(-1)
|
||||
let resObject = {
|
||||
allCoordinates: allCoordinates, //全部线路
|
||||
gdRoute: path_gd, //高德的线路
|
||||
postGisRoute: postGisCoordinates, // postgis的线路
|
||||
startLngLat: [startlng, startlat], // 起点
|
||||
endLngLat: [endlng, endlat], //终点
|
||||
startRouterLngLat: startRouterLngLat, // 路线查询结果的起点
|
||||
endRouterLngLat: endRouterLngLat, //路线查询结果的终点
|
||||
}
|
||||
let simpleRoute = getMinimumRoute(resObject)
|
||||
resolve(simpleRoute)
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
//高德路线导航
|
||||
export const getRouterByGD = (params) => {
|
||||
/**
|
||||
* type:Object
|
||||
*/
|
||||
let { startlng, startlat, endlng, endlat } = params
|
||||
//wgs84转火星坐标系
|
||||
var gcj02StartLngLat = wgs84togcj02(startlng, startlat);
|
||||
var gcj02EndLngLat = wgs84togcj02(endlng, endlat);
|
||||
let gd_params = {
|
||||
origin: `${gcj02StartLngLat[0]},${gcj02StartLngLat[1]}`,
|
||||
destination: `${gcj02EndLngLat[0]},${gcj02EndLngLat[1]}`,
|
||||
show_fields: 'polyline',
|
||||
key: GD_KEY,
|
||||
strategy:2
|
||||
}
|
||||
let new_url = urls.getUrl(GD_URL, gd_params)
|
||||
return new Promise((resolve, reject) => {
|
||||
axios({
|
||||
method: "get",
|
||||
url: new_url,
|
||||
}).then((res) => {
|
||||
if (res.status === 200) {
|
||||
let solution = []
|
||||
//处理数据
|
||||
res.data.route.paths.map(path => {
|
||||
let route_len = path.distance
|
||||
let path_polyline = path.steps.map(step => {
|
||||
return step.polyline
|
||||
})
|
||||
let router_path_str = [] //暂时存放 ['117.927498,35.263264']
|
||||
path_polyline.forEach(polyline => {
|
||||
let step = polyline.split(';')
|
||||
router_path_str = router_path_str.concat(step)
|
||||
});
|
||||
// 去掉重复点
|
||||
let unique_router_path_str = [...new Set(router_path_str)]
|
||||
// 坐标转数组
|
||||
let unique_router_path = unique_router_path_str.map(path_str => {
|
||||
let lng_lat_list = path_str.split(',')
|
||||
//高德坐标系转wgs84坐标系
|
||||
var wgs84Coordinate = gcj02towgs84(...lng_lat_list);
|
||||
return wgs84Coordinate
|
||||
})
|
||||
//高德导航的起点和终点
|
||||
let startCoordinates = unique_router_path[0]
|
||||
let endCoordinates = unique_router_path.at(-1)
|
||||
// 高德地图返回的结果：方案一。长度，线
|
||||
solution.push(
|
||||
{
|
||||
route_len: route_len,
|
||||
path_polyline: unique_router_path,
|
||||
startCoordinates: startCoordinates,
|
||||
endCoordinates: endCoordinates
|
||||
}
|
||||
)
|
||||
})
|
||||
let result = {
|
||||
routerCount: parseInt(res.data.count),
|
||||
path: solution
|
||||
}
|
||||
resolve(result)
|
||||
} else {
|
||||
reject(res)
|
||||
}
|
||||
}).catch(err => {
|
||||
reject(err)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
//使用postgres + postgis寻路
|
||||
export const getRouterByPostGis = (params) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
getMethodCommon("/route", params).then((res) => {
|
||||
if (res.data.paths.length > 0) {
|
||||
let geojsonResult = res.data.paths[0].points;
|
||||
let LineString = geojsonToWKT(geojsonResult);
|
||||
|
||||
|
||||
if (LineString == null || LineString == "null") {
|
||||
console.log('PostGIS未找到合适了路线')
|
||||
resolve(parse(null))
|
||||
} else {
|
||||
resolve(parse(LineString))
|
||||
}
|
||||
} else {
|
||||
console.log('PostGIS未找到合适了路线')
|
||||
resolve(parse(null))
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log("error",err);
|
||||
console.log('PostGIS寻路算法服务端错误')
|
||||
resolve(parse(null))
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
// 绘制线路
|
||||
export const drawRouterFunc = (pathObject) => {
|
||||
let { allCoordinates, startLngLat, endLngLat, startRouterLngLat, endRouterLngLat, gdRoute, postGisRoute } = pathObject
|
||||
// 添加graphic
|
||||
if (pathGraphicLayers == null) {
|
||||
pathGraphicLayers = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(pathGraphicLayers);
|
||||
} else {
|
||||
// pathGraphicLayers.clear();
|
||||
}
|
||||
//当只有两组数据时，说明没有导航的路线，直接使用虚线连接
|
||||
|
||||
if (allCoordinates.length == 2) {
|
||||
//只绘制开头到结尾的路线的路段
|
||||
let endPathGraphic = drawPolylineDashEntity([startLngLat, endLngLat], 'YELLOW')
|
||||
pathGraphicLayers.addGraphic(endPathGraphic);
|
||||
} else {
|
||||
// 导航数据路段
|
||||
// let gdPathGraphic = drawLineFlowEntity(gdRoute, 'YELLOW',10)
|
||||
// let postgisPathGraphic = drawLineFlowEntity(postGisRoute, 'RED',10)
|
||||
let pathGraphic = drawLineFlowEntity(allCoordinates, '#E6472B')
|
||||
|
||||
//开始的路段
|
||||
let startPathGraphic = drawPolylineDashEntity([startLngLat, startRouterLngLat], 'YELLOW')
|
||||
|
||||
//结尾的路段
|
||||
let endPathGraphic = drawPolylineDashEntity([endRouterLngLat, endLngLat], 'YELLOW')
|
||||
|
||||
// pathGraphicLayers.addGraphic(gdPathGraphic);
|
||||
// pathGraphicLayers.addGraphic(postgisPathGraphic);
|
||||
pathGraphicLayers.addGraphic(pathGraphic);
|
||||
pathGraphicLayers.addGraphic(startPathGraphic);
|
||||
pathGraphicLayers.addGraphic(endPathGraphic);
|
||||
}
|
||||
}
|
||||
|
||||
// 绘制线路
|
||||
export const drawRoutersFunc = (pathObject) => {
|
||||
let { allCoordinates, startLngLat, endLngLat, startRouterLngLat, endRouterLngLat, gdRoute, postGisRoute } = pathObject
|
||||
// 添加graphic
|
||||
if (pathGraphicLayers == null) {
|
||||
pathGraphicLayers = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(pathGraphicLayers);
|
||||
} else {
|
||||
|
||||
}
|
||||
//当只有两组数据时，说明没有导航的路线，直接使用虚线连接
|
||||
|
||||
if (allCoordinates.length == 2) {
|
||||
//只绘制开头到结尾的路线的路段
|
||||
// let endPathGraphic = drawPolylineDashEntity([startLngLat, endLngLat], 'YELLOW')
|
||||
// pathGraphicLayers.addGraphic(endPathGraphic);
|
||||
} else {
|
||||
// 导航数据路段
|
||||
// let gdPathGraphic = drawLineFlowEntity(gdRoute, 'YELLOW',10)
|
||||
// let postgisPathGraphic = drawLineFlowEntity(postGisRoute, 'RED',10)
|
||||
let pathGraphic = drawLineFlowEntityColor(allCoordinates, '#E6472B')
|
||||
|
||||
//开始的路段
|
||||
// let startPathGraphic = drawPolylineDashEntity([startLngLat, startRouterLngLat], 'YELLOW')
|
||||
|
||||
//结尾的路段
|
||||
// let endPathGraphic = drawPolylineDashEntity([endRouterLngLat, endLngLat], 'YELLOW')
|
||||
let endPathGraphic = drawPolylineEntity([endRouterLngLat, endLngLat], 'YELLOW')
|
||||
|
||||
|
||||
// pathGraphicLayers.addGraphic(gdPathGraphic);
|
||||
// pathGraphicLayers.addGraphic(postgisPathGraphic);
|
||||
pathGraphicLayers.addGraphic(pathGraphic);
|
||||
// pathGraphicLayers.addGraphic(startPathGraphic);
|
||||
pathGraphicLayers.addGraphic(endPathGraphic);
|
||||
}
|
||||
}
|
||||
|
||||
export const drawRoutersFuncWaterGrid = (pathObject) => {
|
||||
let { pointArr } = pathObject
|
||||
// 添加graphic
|
||||
if (pathWaterGraphicLayers == null) {
|
||||
pathWaterGraphicLayers = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(pathWaterGraphicLayers);
|
||||
} else {
|
||||
|
||||
}
|
||||
//当只有两组数据时，说明没有导航的路线，直接使用虚线连接
|
||||
|
||||
if (pointArr.length == 2) {
|
||||
|
||||
} else {
|
||||
// 导航数据路段
|
||||
let pathGraphic
|
||||
pathGraphic = drawLineFlowEntityColor2(pointArr, '#56C3F9')
|
||||
|
||||
pathWaterGraphicLayers.addGraphic(pathGraphic);
|
||||
|
||||
}
|
||||
}
|
||||
export const drawRoutersFuncGrid = (pathObject) => {
|
||||
let { pointArr, Type } = pathObject
|
||||
// 添加graphic
|
||||
if (pathRoadGraphicLayers == null) {
|
||||
pathRoadGraphicLayers = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(pathRoadGraphicLayers);
|
||||
}
|
||||
//当只有两组数据时，说明没有导航的路线，直接使用虚线连接
|
||||
|
||||
if (pointArr.length == 2) {
|
||||
|
||||
} else {
|
||||
// 导航数据路段
|
||||
|
||||
let pathGraphic;
|
||||
pathGraphic = drawLineFlowEntityColor1(pointArr, '#E6472B')
|
||||
pathRoadGraphicLayers.addGraphic(pathGraphic);
|
||||
}
|
||||
}
|
||||
export const drawRoutersFuncGrid1 = (pathObject) => {
|
||||
let { pointArr, Type } = pathObject
|
||||
// 添加graphic
|
||||
if (pathRoadGraphicLayers1 == null) {
|
||||
pathRoadGraphicLayers1 = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(pathRoadGraphicLayers1);
|
||||
}
|
||||
//当只有两组数据时，说明没有导航的路线，直接使用虚线连接
|
||||
|
||||
if (pointArr.length == 2) {
|
||||
|
||||
} else {
|
||||
// 导航数据路段
|
||||
let pathGraphic1;
|
||||
pathGraphic1 = drawLineFlowEntityColor2(pointArr, '#1F5FDE')
|
||||
pathRoadGraphicLayers1.addGraphic(pathGraphic1);
|
||||
|
||||
}
|
||||
}
|
||||
export const drawRoutersFuncGrid2 = (pathObject) => {
|
||||
let { pointArr, Type } = pathObject
|
||||
// 添加graphic
|
||||
if (pathRoadGraphicLayers2 == null) {
|
||||
pathRoadGraphicLayers2 = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(pathRoadGraphicLayers2);
|
||||
}
|
||||
//当只有两组数据时，说明没有导航的路线，直接使用虚线连接
|
||||
|
||||
if (pointArr.length == 2) {
|
||||
|
||||
} else {
|
||||
// 导航数据路段
|
||||
let pathGraphic2;
|
||||
pathGraphic2 = drawLineFlowEntityColor2(pointArr, '#9C9C9C')
|
||||
pathRoadGraphicLayers2.addGraphic(pathGraphic2);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 高亮路线
|
||||
export const drawOneRouterFunc = (pathObject) => {
|
||||
let { allCoordinates, startLngLat, endLngLat, startRouterLngLat, endRouterLngLat, gdRoute, postGisRoute } = pathObject
|
||||
// 添加graphic
|
||||
if (pathOneGraphicLayers == null) {
|
||||
pathOneGraphicLayers = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(pathOneGraphicLayers);
|
||||
} else {
|
||||
pathOneGraphicLayers.clear();
|
||||
}
|
||||
//当只有两组数据时，说明没有导航的路线，直接使用虚线连接
|
||||
|
||||
if (allCoordinates.length == 2) {
|
||||
//只绘制开头到结尾的路线的路段
|
||||
let endPathGraphic = drawPolylineDashEntity([startLngLat, endLngLat], 'YELLOW')
|
||||
pathOneGraphicLayers.addGraphic(endPathGraphic);
|
||||
} else {
|
||||
// 导航数据路段
|
||||
// let gdPathGraphic = drawLineFlowEntity(gdRoute, 'YELLOW',10)
|
||||
// let postgisPathGraphic = drawLineFlowEntity(postGisRoute, 'RED',10)
|
||||
let pathGraphic = drawLineFlowEntity(allCoordinates, 'CYAN')
|
||||
|
||||
//开始的路段
|
||||
// let startPathGraphic = drawPolylineDashEntity([startLngLat, startRouterLngLat], 'YELLOW')
|
||||
|
||||
//结尾的路段
|
||||
// let endPathGraphic = drawPolylineDashEntity([endRouterLngLat, endLngLat], 'YELLOW')
|
||||
|
||||
// pathGraphicLayers.addGraphic(gdPathGraphic);
|
||||
// pathGraphicLayers.addGraphic(postgisPathGraphic);
|
||||
pathOneGraphicLayers.addGraphic(pathGraphic);
|
||||
// pathGraphicLayers.addGraphic(startPathGraphic);
|
||||
// pathGraphicLayers.addGraphic(endPathGraphic);
|
||||
}
|
||||
}
|
||||
|
||||
// 生成虚线实体
|
||||
const drawPolylineDashEntity = (positions, cesiumColor,width=5) => {
|
||||
return new mars3d.graphic.PolylineEntity({
|
||||
positions: positions,
|
||||
style: {
|
||||
width: width,
|
||||
clampToGround: true,
|
||||
materialType: mars3d.MaterialType.PolylineDash,
|
||||
materialOptions: {
|
||||
color: Cesium.Color[cesiumColor],
|
||||
dashLength: 8.0,
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
const drawPolylineEntity = (positions, cesiumColor,width=5) => {
|
||||
return new mars3d.graphic.PolylineEntity({
|
||||
positions: positions,
|
||||
style: {
|
||||
width: width,
|
||||
clampToGround: true,
|
||||
// materialType: mars3d.MaterialType.PolylineDash,
|
||||
materialOptions: {
|
||||
color: Cesium.Color[cesiumColor],
|
||||
// dashLength: 8.0,
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// 生成动态线实体
|
||||
const drawLineFlowEntity = (positions, cesiumColor,width=5) => {
|
||||
return new mars3d.graphic.PolylineEntity({
|
||||
positions: positions,
|
||||
style: {
|
||||
width: width,
|
||||
clampToGround: true,
|
||||
materialType: mars3d.MaterialType.LineFlowColor,
|
||||
materialOptions: {
|
||||
color: cesiumColor,
|
||||
speed: 1000,
|
||||
percent: 1,
|
||||
alpha: 1
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
const drawLineFlowEntityColor = (positions, cesiumColor,width=5) => {
|
||||
return new mars3d.graphic.PolylineEntity({
|
||||
positions: positions,
|
||||
style: {
|
||||
width: width,
|
||||
clampToGround: true,
|
||||
materialType: mars3d.MaterialType.LineFlowColor,
|
||||
materialOptions: {
|
||||
color: cesiumColor,
|
||||
speed: 1000,
|
||||
percent: 1,
|
||||
alpha: 1
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
const drawLineFlowEntityColor1 = (positions, cesiumColor,width=5) => {
|
||||
return new mars3d.graphic.PolylineEntity({
|
||||
positions: positions,
|
||||
style: {
|
||||
width: width,
|
||||
clampToGround: true,
|
||||
materialType: mars3d.MaterialType.LineFlowColor,
|
||||
materialOptions: {
|
||||
color: cesiumColor,
|
||||
speed: 1000,
|
||||
percent: 1,
|
||||
alpha: 1
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
const drawLineFlowEntityColor2 = (positions, cesiumColor,width=5) => {
|
||||
return new mars3d.graphic.PolylineEntity({
|
||||
positions: positions,
|
||||
style: {
|
||||
width: width,
|
||||
clampToGround: true,
|
||||
materialType: mars3d.MaterialType.LineFlowColor,
|
||||
materialOptions: {
|
||||
color: cesiumColor,
|
||||
speed: 1000,
|
||||
percent: 1,
|
||||
alpha: 1
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
//删除路线
|
||||
export const clearRouterFunc = () => {
|
||||
if (pathGraphicLayers == null) {
|
||||
return false
|
||||
} else {
|
||||
pathGraphicLayers.clear();
|
||||
}
|
||||
|
||||
|
||||
if (pathOneGraphicLayers == null) {
|
||||
return false
|
||||
} else {
|
||||
pathOneGraphicLayers.clear();
|
||||
|
||||
}
|
||||
}
|
||||
//删除水网路线
|
||||
export const clearWaterRouterFunc = () => {
|
||||
if (pathWaterGraphicLayers == null) {
|
||||
return false
|
||||
} else {
|
||||
pathWaterGraphicLayers.clear();
|
||||
}
|
||||
}
|
||||
//删除路网路线
|
||||
export const clearRoadRouterFunc = () => {
|
||||
if (pathRoadGraphicLayers == null) {
|
||||
return false
|
||||
} else {
|
||||
pathRoadGraphicLayers.clear();
|
||||
}
|
||||
}
|
||||
export const clearRoadRouterFunc1 = () => {
|
||||
if (pathRoadGraphicLayers1 == null) {
|
||||
return false
|
||||
} else {
|
||||
pathRoadGraphicLayers1.clear();
|
||||
}
|
||||
}
|
||||
export const clearRoadRouterFunc2 = () => {
|
||||
if (pathRoadGraphicLayers2 == null) {
|
||||
return false
|
||||
} else {
|
||||
pathRoadGraphicLayers2.clear();
|
||||
}
|
||||
}
|
||||
|
||||
//计算最近路线
|
||||
const getMinimumRoute = (pathObject) => {
|
||||
//备份Object
|
||||
let pathObjectClone = deepClone(pathObject)
|
||||
let { allCoordinates, startLngLat, endLngLat, startRouterLngLat, endRouterLngLat, gdRoute, postGisRoute } = pathObjectClone
|
||||
// 当只有一个点时（终点），说明高德地图和postgis都未查询到线路，直接返回两点
|
||||
if (allCoordinates.length <= 1) {
|
||||
pathObjectClone.allCoordinates = [startLngLat, endLngLat]
|
||||
return pathObjectClone
|
||||
}
|
||||
//当postgis寻路时，计算两条线路的重叠之处
|
||||
if (postGisRoute.length && gdRoute.length) {
|
||||
//实例化turf标准格式
|
||||
let gdRouteLine = turf.lineString(gdRoute);
|
||||
let postGisRouteLine = turf.lineString(postGisRoute);
|
||||
//获取postgis和高德寻路的所有交点
|
||||
let intersectsGeojson = turf.lineIntersect(gdRouteLine, postGisRouteLine);
|
||||
let intersectsCoordinates = getMultPointCoordinatesFromGeoJson(intersectsGeojson)
|
||||
//如果相交点大于1，说明路线有重复部分
|
||||
if (intersectsCoordinates.length > 1) {
|
||||
let lastIntersectsCoordinates = intersectsCoordinates[0]
|
||||
let [slicedGdCoordinates, slicedPostGisCoordinates] = sliceByPoint(startRouterLngLat, gdRouteLine, endRouterLngLat, postGisRoute, lastIntersectsCoordinates)
|
||||
allCoordinates = slicedGdCoordinates.concat(slicedPostGisCoordinates)
|
||||
//处理后的结果赋值给pathObjectClone
|
||||
pathObjectClone.gdRoute = slicedGdCoordinates
|
||||
pathObjectClone.postGisRoute = slicedPostGisCoordinates
|
||||
gdRouteLine = turf.lineString(slicedGdCoordinates);
|
||||
postGisRouteLine = turf.lineString(slicedPostGisCoordinates);
|
||||
}
|
||||
// 阈值计算重复路线，去除重复线路
|
||||
let overlapping = turf.lineOverlap(gdRouteLine, postGisRouteLine, { tolerance: 0.1 });
|
||||
|
||||
if (overlapping.features.length) {
|
||||
let lastOverlapPoint = overlapping.features.at(-1).geometry.coordinates[0]
|
||||
let [overlapGdCoordinates, overlapPostGisCoordinates] = sliceByPoint(startRouterLngLat, gdRouteLine, endRouterLngLat, postGisRoute, lastOverlapPoint)
|
||||
allCoordinates = overlapGdCoordinates.concat(overlapPostGisCoordinates)
|
||||
// 连接路段平滑过渡
|
||||
}
|
||||
|
||||
}
|
||||
// 转成turf标准线格式
|
||||
let allRouteLine = turf.lineString(allCoordinates);
|
||||
// 转成turf标准点格式
|
||||
let startLngLatPoint = turf.point(startLngLat);
|
||||
let startRouterLngLatPoint = turf.point(startRouterLngLat);
|
||||
let endLngLatPoint = turf.point(endLngLat);
|
||||
let endRouterLngLatPoint = turf.point(endRouterLngLat);
|
||||
//获取终点到导航线最近的点
|
||||
let snappedGeojson = turf.nearestPointOnLine(allRouteLine, endLngLatPoint, { units: 'miles' });
|
||||
let snappedCoordinates = getOnePointCoordinatesFromGeoJson(snappedGeojson)
|
||||
// 根据最近的点截取路线，取前半部分
|
||||
let slicedGeojson = turf.lineSlice(startRouterLngLat, turf.point(snappedCoordinates), allRouteLine);
|
||||
let slicedCoordinates = getOnePointCoordinatesFromGeoJson(slicedGeojson)
|
||||
//把截取后的路线赋值给pathObjectClone
|
||||
pathObjectClone.allCoordinates = slicedCoordinates
|
||||
//计算出发地到目的地的图上距离（直线）
|
||||
let distanceStartToEnd = turf.distance(startLngLatPoint, endLngLatPoint)
|
||||
//计算出发点到出发导航路线出发点的步行距离
|
||||
let distanceStartToStartRoute = turf.distance(startLngLatPoint, startRouterLngLatPoint)
|
||||
//计算终点到出发导航路线终点的步行距离
|
||||
let distanceEndToEndRoute = turf.distance(endLngLatPoint, endRouterLngLatPoint)
|
||||
//如果出发点与目的地的实际距离小于步行的距离，直接使用出发点到目的地的距离，导航此时不适用
|
||||
if (distanceStartToEnd < (distanceStartToStartRoute + distanceEndToEndRoute)) {
|
||||
pathObjectClone.allCoordinates = [startLngLat, endLngLat]
|
||||
}
|
||||
//把终点到导航终点改为距离线路的最近的的点
|
||||
pathObjectClone.endRouterLngLat = snappedCoordinates
|
||||
return pathObjectClone
|
||||
}
|
||||
|
||||
const sliceByPoint = (line1Start, line1, line2End, line2, point) => {
|
||||
/**
|
||||
* 根据点point把line1的前半部分和line2的后半部分进行拼接
|
||||
* line1Start:line1的起始点 [lng.lat]
|
||||
* line2End:line2 的终止点 [lng,lat]
|
||||
*/
|
||||
//拷贝line2的坐标数组进行倒序排列
|
||||
let line2Copy = [...line2]
|
||||
line2Copy.reverse()
|
||||
let line2CopyReverseLineString = turf.lineString(line2Copy);
|
||||
// 根据point截取路线，line1取前半部分
|
||||
// 根据point截取路线，line2取后半部分
|
||||
//然后将两部分拼接，让line1路线从第一个交点处转向line2路段
|
||||
let slicedLine1Geojson = turf.lineSlice(line1Start, turf.point(point), line1);
|
||||
let slicedLine1Coordinates = getOnePointCoordinatesFromGeoJson(slicedLine1Geojson)
|
||||
let slicedLine2Geojson = turf.lineSlice(line2End, turf.point(point), line2CopyReverseLineString);
|
||||
let slicedLine2Coordinates = getOnePointCoordinatesFromGeoJson(slicedLine2Geojson)
|
||||
slicedLine2Coordinates.reverse()
|
||||
return [slicedLine1Coordinates, slicedLine2Coordinates]
|
||||
}
|
||||
|
||||
|
||||
// 坐标转geoJson
|
||||
const comLineStringGeoJson = (coordinates) => {
|
||||
return {
|
||||
"type": "Feature",
|
||||
"properties": {},
|
||||
"geometry": {
|
||||
"coordinates": coordinates,
|
||||
"type": "LineString"
|
||||
}
|
||||
}
|
||||
}
|
||||
// 从一条线的geometry中获取坐标
|
||||
const getOneLineCoordinatesFromGeometry = (geometry) => {
|
||||
let coordinates = geometry.coordinates
|
||||
// console.log('geometry::: ', geometry);
|
||||
let list = []
|
||||
if (geometry.type == "MultiLineString" || geometry.type == "MULTILINESTRING") {
|
||||
coordinates.map(coord => {
|
||||
list = list.concat(coord)
|
||||
})
|
||||
} else if (geometry.type == 'LineString' || geometry.type == "LINESTRING") {
|
||||
list = list.concat(geometry.coordinates)
|
||||
} else {
|
||||
list = []
|
||||
}
|
||||
return list
|
||||
|
||||
}
|
||||
//从一个点的geojson中返回坐标点
|
||||
const getOnePointCoordinatesFromGeoJson = (geojson) => {
|
||||
return geojson.geometry.coordinates
|
||||
}
|
||||
//从多个点的geojson中返回坐标点
|
||||
const getMultPointCoordinatesFromGeoJson = (geojson) => {
|
||||
// console.log('geojson::: ', geojson);
|
||||
return geojson.features.map(feature => {
|
||||
return feature.geometry.coordinates
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 全局漫游
|
||||
let carGraphicEntity = null;
|
||||
let carGraphicLayer = null;
|
||||
|
||||
export const handlerStartRoaming = (coordinates,roaming=true)=>{
|
||||
if(carGraphicLayer == null){
|
||||
carGraphicLayer = new mars3d.layer.GraphicLayer();
|
||||
window.globalMap.addLayer(carGraphicLayer);
|
||||
}else{
|
||||
carGraphicLayer.clear();
|
||||
}
|
||||
|
||||
carGraphicEntity = new mars3d.graphic.FixedRoute({
|
||||
name: "步行路线",
|
||||
frameRate: 1,
|
||||
speed: 500,
|
||||
autoStop: false, // 到达终点自动停止
|
||||
clockLoop: true, // 循环播放
|
||||
positions: coordinates,
|
||||
pauseTime: 0,
|
||||
camera: {
|
||||
type: "gs",
|
||||
radius: 2500
|
||||
},
|
||||
model: {
|
||||
// url: "//data.mars3d.cn/gltf/mars/car/bus3.gltf",
|
||||
url:"/cartoon_fire_truck/xiaofangche.gltf",
|
||||
scale: 5,
|
||||
minimumPixelSize: 50,
|
||||
clampToGround: true
|
||||
},
|
||||
circle: {
|
||||
radius: 10,
|
||||
materialType: mars3d.MaterialType.CircleWave,
|
||||
materialOptions: {
|
||||
color: "#ffff00",
|
||||
opacity: 0.3,
|
||||
speed: 10,
|
||||
count: 3,
|
||||
gradient: 0.1
|
||||
},
|
||||
clampToGround: true
|
||||
}
|
||||
})
|
||||
carGraphicLayer.addGraphic(carGraphicEntity)
|
||||
// 开始漫游
|
||||
carGraphicEntity.enabled = roaming;
|
||||
carGraphicEntity.start()
|
||||
}
|
||||
|
||||
export const handlerStopRoaming = ()=>{
|
||||
if(carGraphicEntity){
|
||||
carGraphicLayer.removeGraphic(carGraphicEntity);
|
||||
carGraphicEntity = null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="video-container" :id="'player'+props.monitor.SerialNumber">
|
||||
<div class="video-container" :id="'hk_player'+props.monitor.SerialNumber">
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -31,7 +31,7 @@ const MSE_IS_SUPPORT = !!window.MediaSource
|
|||
|
||||
function createPlayer() {
|
||||
player = new JSPlugin({
|
||||
szId: 'player'+props.monitor.SerialNumber,
|
||||
szId: 'hk_player'+props.monitor.SerialNumber,
|
||||
szBasePath: "./",
|
||||
iMaxSplit: 1,
|
||||
iCurrentSplit: IS_MOVE_DEVICE ? 1 : 2,
|
||||
|
|
|
|||
|
|
@ -48,6 +48,8 @@ export function getAppEnvConfig() {
|
|||
VITE_GLOB_FILE_PREVIEW,
|
||||
VITE_GLOB_GEOSERVER_BASE_URL,
|
||||
VITE_GLOB_COFFEE_API_URL,
|
||||
VITE_GLOB_ANYRTC_BASE_URL,
|
||||
VITE_GLOBAL_NAVIGATION_BASE_URL,
|
||||
} = ENV;
|
||||
let { VITE_GLOB_API_URL } = ENV;
|
||||
if (localStorage.getItem(API_ADDRESS)) {
|
||||
|
|
@ -73,6 +75,8 @@ export function getAppEnvConfig() {
|
|||
VITE_GLOB_APP_RTMP_URL,
|
||||
VITE_GLOB_APP_FLV_URL,
|
||||
VITE_GLOB_SRS_API_URL,
|
||||
VITE_GLOB_ANYRTC_BASE_URL,
|
||||
VITE_GLOBAL_NAVIGATION_BASE_URL,
|
||||
};
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue