|
@@ -83,7 +83,7 @@ export default {
|
|
|
},
|
|
},
|
|
|
data() {
|
|
data() {
|
|
|
return {
|
|
return {
|
|
|
- save : false,
|
|
|
|
|
|
|
+ save: false,
|
|
|
situation: [],
|
|
situation: [],
|
|
|
nameIdList:[],
|
|
nameIdList:[],
|
|
|
leftwidth: 12,
|
|
leftwidth: 12,
|
|
@@ -111,18 +111,18 @@ export default {
|
|
|
modeltooltip: null,
|
|
modeltooltip: null,
|
|
|
id: 1,
|
|
id: 1,
|
|
|
jsonData: null,
|
|
jsonData: null,
|
|
|
- mapNavOptions: {
|
|
|
|
|
- // 用于在使用重置导航重置地图视图时设置默认视图控制。接受的值是Cesium.Cartographic 和Cesium.Rectangle.
|
|
|
|
|
- defaultResetView: this.Cesium.Cartographic.fromDegrees(110, 30, 2000000),
|
|
|
|
|
- // 罗盘
|
|
|
|
|
- enableCompass: true,
|
|
|
|
|
- // 缩放控件
|
|
|
|
|
- enableZoomControls: false,
|
|
|
|
|
- // 距离图例
|
|
|
|
|
- enableDistanceLegend: true,
|
|
|
|
|
- // 指南针外环
|
|
|
|
|
- enableCompassOuterRing: true
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ mapNavOptions: {
|
|
|
|
|
+ // 用于在使用重置导航重置地图视图时设置默认视图控制。接受的值是Cesium.Cartographic 和Cesium.Rectangle.
|
|
|
|
|
+ defaultResetView: this.Cesium.Cartographic.fromDegrees(110, 30, 2000000),
|
|
|
|
|
+ // 罗盘
|
|
|
|
|
+ enableCompass: true,
|
|
|
|
|
+ // 缩放控件
|
|
|
|
|
+ enableZoomControls: false,
|
|
|
|
|
+ // 距离图例
|
|
|
|
|
+ enableDistanceLegend: true,
|
|
|
|
|
+ // 指南针外环
|
|
|
|
|
+ enableCompassOuterRing: true
|
|
|
|
|
+ }
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
watch: {
|
|
watch: {
|
|
@@ -148,22 +148,22 @@ export default {
|
|
|
},
|
|
},
|
|
|
methods: {
|
|
methods: {
|
|
|
async saveJson() {
|
|
async saveJson() {
|
|
|
- if(this.save){
|
|
|
|
|
|
|
+ if (this.save) {
|
|
|
const jsonData = JSON.stringify(this.jsonData);
|
|
const jsonData = JSON.stringify(this.jsonData);
|
|
|
- const blob = new Blob([jsonData], { type: 'application/json' });
|
|
|
|
|
- const url = URL.createObjectURL(blob);
|
|
|
|
|
- const link = document.createElement('a');
|
|
|
|
|
- link.href = url;
|
|
|
|
|
- link.download = this.jsonData.xdname + '.json';
|
|
|
|
|
- document.body.appendChild(link);
|
|
|
|
|
- link.click();
|
|
|
|
|
- document.body.removeChild(link);
|
|
|
|
|
|
|
+ const blob = new Blob([jsonData], { type: 'application/json' });
|
|
|
|
|
+ const url = URL.createObjectURL(blob);
|
|
|
|
|
+ const link = document.createElement('a');
|
|
|
|
|
+ link.href = url;
|
|
|
|
|
+ link.download = this.jsonData.xdname + '.json';
|
|
|
|
|
+ document.body.appendChild(link);
|
|
|
|
|
+ link.click();
|
|
|
|
|
+ document.body.removeChild(link);
|
|
|
}
|
|
}
|
|
|
- else{
|
|
|
|
|
|
|
+ else {
|
|
|
this.$message("请先导入想定文件！！！")
|
|
this.$message("请先导入想定文件！！！")
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
// await axios
|
|
// await axios
|
|
|
// .post("http://localhost:8084/admin/online/onlineOperation/updateDatasource/main", {
|
|
// .post("http://localhost:8084/admin/online/onlineOperation/updateDatasource/main", {
|
|
|
// params: {
|
|
// params: {
|
|
@@ -310,70 +310,70 @@ export default {
|
|
|
// satellite: satellite,
|
|
// satellite: satellite,
|
|
|
// center: center
|
|
// center: center
|
|
|
// };
|
|
// };
|
|
|
- let fileInfoStr = row.xdfile;
|
|
|
|
|
- let fileInfoArr = JSON.parse(fileInfoStr);
|
|
|
|
|
|
|
+ let fileInfoStr = row.xdfile;
|
|
|
|
|
+ let fileInfoArr = JSON.parse(fileInfoStr);
|
|
|
await axios
|
|
await axios
|
|
|
- .get("http://localhost:8084/admin/online/onlineOperation/downloadDatasource/main", {
|
|
|
|
|
- params: {
|
|
|
|
|
- datasourceId: "1656243335922192384",
|
|
|
|
|
- fieldName: "xdfile",
|
|
|
|
|
- asImage: false,
|
|
|
|
|
- dataId: row.id,
|
|
|
|
|
- filename: fileInfoArr[0].filename,
|
|
|
|
|
- Authorization: getToken(),
|
|
|
|
|
- MenuId: "1656244747347431424"
|
|
|
|
|
- }
|
|
|
|
|
- })
|
|
|
|
|
- .then((response) => {
|
|
|
|
|
- console.log('response.data :>> ', response.data);
|
|
|
|
|
- // // 处理成功的响应
|
|
|
|
|
- // jsonData = response.data
|
|
|
|
|
- blueunit = response.data.blueunit
|
|
|
|
|
- redunit = response.data.redunit
|
|
|
|
|
- satellite = response.data.satellite
|
|
|
|
|
- center = response.data.center
|
|
|
|
|
- this.save = true
|
|
|
|
|
- this.jsonData = {
|
|
|
|
|
- id: row.id,
|
|
|
|
|
- xdname: row.xdname,
|
|
|
|
|
- type: row.type,
|
|
|
|
|
- createtime: row.createtime,
|
|
|
|
|
- bluecnt: row.bluecnt,
|
|
|
|
|
- target: row.target,
|
|
|
|
|
- starttime: row.starttime,
|
|
|
|
|
- endtime: row.endtime,
|
|
|
|
|
- steptime: row.steptime,
|
|
|
|
|
- blueunit: blueunit,
|
|
|
|
|
- redunit: redunit,
|
|
|
|
|
- satellite: satellite,
|
|
|
|
|
- center: center
|
|
|
|
|
- }
|
|
|
|
|
- })
|
|
|
|
|
- .catch((error) => {
|
|
|
|
|
- // 处理错误
|
|
|
|
|
- console.error(error);
|
|
|
|
|
- });
|
|
|
|
|
-
|
|
|
|
|
- for(let i =0;i<blueunit.length;i++){
|
|
|
|
|
- this.markLocationbyJson(parseFloat(blueunit[i].pos.lat),parseFloat(blueunit[i].pos.lon),parseFloat(blueunit[i].pos.height),blueunit[i].name,"blue")
|
|
|
|
|
|
|
+ .get("http://localhost:8084/admin/online/onlineOperation/downloadDatasource/main", {
|
|
|
|
|
+ params: {
|
|
|
|
|
+ datasourceId: "1656243335922192384",
|
|
|
|
|
+ fieldName: "xdfile",
|
|
|
|
|
+ asImage: false,
|
|
|
|
|
+ dataId: row.id,
|
|
|
|
|
+ filename: fileInfoArr[0].filename,
|
|
|
|
|
+ Authorization: getToken(),
|
|
|
|
|
+ MenuId: "1656244747347431424"
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ .then((response) => {
|
|
|
|
|
+ console.log('response.data :>> ', response.data);
|
|
|
|
|
+ // // 处理成功的响应
|
|
|
|
|
+ // jsonData = response.data
|
|
|
|
|
+ blueunit = response.data.blueunit
|
|
|
|
|
+ redunit = response.data.redunit
|
|
|
|
|
+ satellite = response.data.satellite
|
|
|
|
|
+ center = response.data.center
|
|
|
|
|
+ this.save = true
|
|
|
|
|
+ this.jsonData = {
|
|
|
|
|
+ id: row.id,
|
|
|
|
|
+ xdname: row.xdname,
|
|
|
|
|
+ type: row.type,
|
|
|
|
|
+ createtime: row.createtime,
|
|
|
|
|
+ bluecnt: row.bluecnt,
|
|
|
|
|
+ target: row.target,
|
|
|
|
|
+ starttime: row.starttime,
|
|
|
|
|
+ endtime: row.endtime,
|
|
|
|
|
+ steptime: row.steptime,
|
|
|
|
|
+ blueunit: blueunit,
|
|
|
|
|
+ redunit: redunit,
|
|
|
|
|
+ satellite: satellite,
|
|
|
|
|
+ center: center
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ .catch((error) => {
|
|
|
|
|
+ // 处理错误
|
|
|
|
|
+ console.error(error);
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ for (let i = 0; i < blueunit.length; i++) {
|
|
|
|
|
+ this.markLocationbyJson(parseFloat(blueunit[i].pos.lat), parseFloat(blueunit[i].pos.lon), parseFloat(blueunit[i].pos.height), blueunit[i].name, "blue")
|
|
|
}
|
|
}
|
|
|
- for(let i = 0;i<center.length;i++){
|
|
|
|
|
|
|
+ for (let i = 0; i < center.length; i++) {
|
|
|
let item = center[i]
|
|
let item = center[i]
|
|
|
- this.markLocationbyJson(parseFloat(item[center[i].name].properties.lat),parseFloat(item[center[i].name].properties.lon),parseFloat(item[center[i].name].properties.h),item.name,"center")
|
|
|
|
|
|
|
+ this.markLocationbyJson(parseFloat(item[center[i].name].properties.lat), parseFloat(item[center[i].name].properties.lon), parseFloat(item[center[i].name].properties.h), item.name, "center")
|
|
|
}
|
|
}
|
|
|
- for(let i = 0;i<redunit.length;i++){
|
|
|
|
|
- this.markLocationbyJson(parseFloat(redunit[i].component_movementjson.properties.launch_lat),parseFloat(redunit[i].component_movementjson.properties.launch_lon),parseFloat(redunit[i].component_movementjson.properties.launch_h),redunit[i].name,"red")
|
|
|
|
|
|
|
+ for (let i = 0; i < redunit.length; i++) {
|
|
|
|
|
+ this.markLocationbyJson(parseFloat(redunit[i].component_movementjson.properties.launch_lat), parseFloat(redunit[i].component_movementjson.properties.launch_lon), parseFloat(redunit[i].component_movementjson.properties.launch_h), redunit[i].name, "red")
|
|
|
let point1 = {
|
|
let point1 = {
|
|
|
- longitude : parseFloat(redunit[i].component_movementjson.properties.launch_lon),
|
|
|
|
|
- latitude : parseFloat(redunit[i].component_movementjson.properties.launch_lat),
|
|
|
|
|
- height :parseFloat(redunit[i].component_movementjson.properties.launch_h)
|
|
|
|
|
|
|
+ longitude: parseFloat(redunit[i].component_movementjson.properties.launch_lon),
|
|
|
|
|
+ latitude: parseFloat(redunit[i].component_movementjson.properties.launch_lat),
|
|
|
|
|
+ height: parseFloat(redunit[i].component_movementjson.properties.launch_h)
|
|
|
}
|
|
}
|
|
|
let point2 = {
|
|
let point2 = {
|
|
|
- longitude : parseFloat(redunit[i].component_movementjson.properties.target_lon),
|
|
|
|
|
- latitude : parseFloat(redunit[i].component_movementjson.properties.target_lat),
|
|
|
|
|
- height : parseFloat(redunit[i].component_movementjson.properties.target_h)
|
|
|
|
|
|
|
+ longitude: parseFloat(redunit[i].component_movementjson.properties.target_lon),
|
|
|
|
|
+ latitude: parseFloat(redunit[i].component_movementjson.properties.target_lat),
|
|
|
|
|
+ height: parseFloat(redunit[i].component_movementjson.properties.target_h)
|
|
|
}
|
|
}
|
|
|
- this.markLine(point1,point2,"red")
|
|
|
|
|
|
|
+ this.markLine(point1, point2, "red")
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
//获取所有数据
|
|
//获取所有数据
|
|
@@ -616,7 +616,7 @@ export default {
|
|
|
/* 地图放大 */
|
|
/* 地图放大 */
|
|
|
big() {
|
|
big() {
|
|
|
let { lon, lat, height } = this.getCenterPosition(this.dimension === 3);
|
|
let { lon, lat, height } = this.getCenterPosition(this.dimension === 3);
|
|
|
- let viewer = (this.dimension === 3 || this.dimension === 5)? this.$data._viewer3D : this.$data._viewer2D;
|
|
|
|
|
|
|
+ let viewer = (this.dimension === 3 || this.dimension === 5)? this.viewer3D : this.viewer2D;
|
|
|
// 镜头拉进
|
|
// 镜头拉进
|
|
|
viewer.camera.flyTo({
|
|
viewer.camera.flyTo({
|
|
|
destination: this.Cesium.Cartesian3.fromDegrees(lon, lat, height / 1.8),
|
|
destination: this.Cesium.Cartesian3.fromDegrees(lon, lat, height / 1.8),
|
|
@@ -634,7 +634,7 @@ export default {
|
|
|
});
|
|
});
|
|
|
},
|
|
},
|
|
|
home() {
|
|
home() {
|
|
|
- let viewer = (this.dimension === 3 || this.dimension === 5)? this.$data._viewer3D : this.$data._viewer2D;
|
|
|
|
|
|
|
+ let viewer = (this.dimension === 3 || this.dimension === 5)? this.viewer3D : this.viewer2D;
|
|
|
viewer.camera.flyTo({
|
|
viewer.camera.flyTo({
|
|
|
destination: this.Cesium.Cartesian3.fromDegrees(117.918977, 25.0, 1500000),
|
|
destination: this.Cesium.Cartesian3.fromDegrees(117.918977, 25.0, 1500000),
|
|
|
duration: 2.0
|
|
duration: 2.0
|
|
@@ -662,23 +662,23 @@ export default {
|
|
|
},
|
|
},
|
|
|
//显示鼠标经纬度
|
|
//显示鼠标经纬度
|
|
|
getMouseLocation(event) {
|
|
getMouseLocation(event) {
|
|
|
- let {longitude,latitude} = this.getCoordinatesFromEvent(event);
|
|
|
|
|
- this.$store.commit("app/setMouseLocation",{longitude,latitude});
|
|
|
|
|
|
|
+ let { longitude, latitude } = this.getCoordinatesFromEvent(event);
|
|
|
|
|
+ this.$store.commit("app/setMouseLocation", { longitude, latitude });
|
|
|
},
|
|
},
|
|
|
- /*根据camera高度近似计算当前层级*/
|
|
|
|
|
- heightToZoom(height){
|
|
|
|
|
- var A = 40487.57;
|
|
|
|
|
- var B = 0.00007096758;
|
|
|
|
|
- var C = 91610.74;
|
|
|
|
|
- var D = -40467.74;
|
|
|
|
|
- return Math.round(D+(A-D)/(1+Math.pow(height/C, B)));
|
|
|
|
|
|
|
+ /*根据camera高度近似计算当前层级*/
|
|
|
|
|
+ heightToZoom(height) {
|
|
|
|
|
+ var A = 40487.57;
|
|
|
|
|
+ var B = 0.00007096758;
|
|
|
|
|
+ var C = 91610.74;
|
|
|
|
|
+ var D = -40467.74;
|
|
|
|
|
+ return Math.round(D + (A - D) / (1 + Math.pow(height / C, B)));
|
|
|
},
|
|
},
|
|
|
getCammeraHeightAndZoom(){
|
|
getCammeraHeightAndZoom(){
|
|
|
let viewer = (this.dimension === 3 || this.dimension === 5) ? this.$data._viewer3D : this.$data._viewer2D;
|
|
let viewer = (this.dimension === 3 || this.dimension === 5) ? this.$data._viewer3D : this.$data._viewer2D;
|
|
|
//获取当前相机高度
|
|
//获取当前相机高度
|
|
|
- let height = viewer.camera.positionCartographic.height;
|
|
|
|
|
- let zoom = this.heightToZoom(height);
|
|
|
|
|
- this.$store.commit("app/setCameraHeightAndZoom",{height,zoom});
|
|
|
|
|
|
|
+ let height = viewer.camera.positionCartographic.height;
|
|
|
|
|
+ let zoom = this.heightToZoom(height);
|
|
|
|
|
+ this.$store.commit("app/setCameraHeightAndZoom", { height, zoom });
|
|
|
},
|
|
},
|
|
|
selectModel(cursorStyle, image, info) {
|
|
selectModel(cursorStyle, image, info) {
|
|
|
console.log('image :>> ', image);
|
|
console.log('image :>> ', image);
|
|
@@ -746,67 +746,137 @@ export default {
|
|
|
});
|
|
});
|
|
|
this.id++;
|
|
this.id++;
|
|
|
},
|
|
},
|
|
|
- markLocationbyJson(latitude, longitude,height,name,type) {
|
|
|
|
|
- const position = this.Cesium.Cartesian3.fromDegrees(longitude, latitude,height);
|
|
|
|
|
|
|
+ markLocationbyJson(latitude, longitude, height, name, type) {
|
|
|
|
|
+ const position = this.Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
|
|
|
console.log('position :>> ', position);
|
|
console.log('position :>> ', position);
|
|
|
let color = ''
|
|
let color = ''
|
|
|
let modelUrl = ''
|
|
let modelUrl = ''
|
|
|
- if(type=='red'){
|
|
|
|
|
|
|
+ if (type == 'red') {
|
|
|
color = 'Red'
|
|
color = 'Red'
|
|
|
- modelUrl= missileModel
|
|
|
|
|
|
|
+ modelUrl = missileModel
|
|
|
}
|
|
}
|
|
|
- else if(type=='blue'){
|
|
|
|
|
|
|
+ else if (type == 'blue') {
|
|
|
color = 'Blue'
|
|
color = 'Blue'
|
|
|
modelUrl = radarModel
|
|
modelUrl = radarModel
|
|
|
}
|
|
}
|
|
|
- else if(type=='center'){
|
|
|
|
|
|
|
+ else if (type == 'center') {
|
|
|
color = 'Blue'
|
|
color = 'Blue'
|
|
|
modelUrl = centerModel
|
|
modelUrl = centerModel
|
|
|
}
|
|
}
|
|
|
- this.$data._viewer2D.entities.add({
|
|
|
|
|
- id: this.id,
|
|
|
|
|
- position: position,
|
|
|
|
|
- point: {
|
|
|
|
|
- pixelSize: 12, // 调整点的大小，可以增大点的像素大小
|
|
|
|
|
- color: this.Cesium.Color.fromCssColorString(color)
|
|
|
|
|
- },
|
|
|
|
|
- // model: {
|
|
|
|
|
- // uri: modelUrl, // 替换为你的3D模型文件路径
|
|
|
|
|
- // scale: 1.0, // 调整3D模型的缩放大小
|
|
|
|
|
- // minimumPixelSize: 64 // 设置3D模型的最小像素大小，确保在视图中可见
|
|
|
|
|
- // },
|
|
|
|
|
- label: {
|
|
|
|
|
- text: type+' '+name,
|
|
|
|
|
- show: true,
|
|
|
|
|
- font: "18px Helvetica", // 调整标签的字体样式和大小
|
|
|
|
|
- pixelOffset: new this.Cesium.Cartesian2(0, 20) // 调整标签的像素偏移，向下偏移20像素
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
- this.$data._viewer3D.entities.add({
|
|
|
|
|
- id: this.id,
|
|
|
|
|
- position: position,
|
|
|
|
|
- point: {
|
|
|
|
|
- pixelSize: 12, // 调整点的大小，可以增大点的像素大小
|
|
|
|
|
- color: this.Cesium.Color.fromCssColorString(color)
|
|
|
|
|
- },
|
|
|
|
|
- model: {
|
|
|
|
|
- uri: modelUrl, // 替换为你的3D模型文件路径
|
|
|
|
|
- scale: 1.0, // 调整3D模型的缩放大小
|
|
|
|
|
- minimumPixelSize: 64 // 设置3D模型的最小像素大小，确保在视图中可见
|
|
|
|
|
- },
|
|
|
|
|
- label: {
|
|
|
|
|
- text: type+' '+name,
|
|
|
|
|
- show: true,
|
|
|
|
|
- font: "18px Helvetica", // 调整标签的字体样式和大小
|
|
|
|
|
- pixelOffset: new this.Cesium.Cartesian2(0, 20) // 调整标签的像素偏移，向下偏移20像素
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
- this.nameIdList.push({
|
|
|
|
|
- id: this.id,
|
|
|
|
|
- name: name
|
|
|
|
|
- })
|
|
|
|
|
- this.id++;
|
|
|
|
|
- console.log('this.$data._viewer3D.entities :>> ', this.$data._viewer3D.entities);
|
|
|
|
|
|
|
+ if (type == 'blue') {
|
|
|
|
|
+ console.log(' radar!!!');
|
|
|
|
|
+ const range = 100000;
|
|
|
|
|
+ this.viewer2D.entities.add({
|
|
|
|
|
+ id: this.id,
|
|
|
|
|
+ position: position,
|
|
|
|
|
+ ellipsoid: {
|
|
|
|
|
+ radii: new this.Cesium.Cartesian3(range, range, range),
|
|
|
|
|
+ material: this.Cesium.Color.GREEN.withAlpha(0.5), // 设置球体的颜色和透明度
|
|
|
|
|
+ outline: true,
|
|
|
|
|
+ outlineColor: this.Cesium.Color.GREEN,
|
|
|
|
|
+ },
|
|
|
|
|
+ point: {
|
|
|
|
|
+ pixelSize: 12, // 调整点的大小，可以增大点的像素大小
|
|
|
|
|
+ color: this.Cesium.Color.fromCssColorString(color)
|
|
|
|
|
+ },
|
|
|
|
|
+ model: {
|
|
|
|
|
+ uri: modelUrl, // 替换为你的3D模型文件路径
|
|
|
|
|
+ scale: 1.0, // 调整3D模型的缩放大小
|
|
|
|
|
+ minimumPixelSize: 64 // 设置3D模型的最小像素大小，确保在视图中可见
|
|
|
|
|
+ },
|
|
|
|
|
+ label: {
|
|
|
|
|
+ text: type + ' ' + name,
|
|
|
|
|
+ show: true,
|
|
|
|
|
+ font: "18px Helvetica", // 调整标签的字体样式和大小
|
|
|
|
|
+ pixelOffset: new this.Cesium.Cartesian2(0, 20) // 调整标签的像素偏移，向下偏移20像素
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ this.viewer3D.entities.add({
|
|
|
|
|
+ id: this.id,
|
|
|
|
|
+ position: position,
|
|
|
|
|
+ // cylinder: {
|
|
|
|
|
+ // length: range * 2,
|
|
|
|
|
+ // topRadius: 0,
|
|
|
|
|
+ // bottomRadius: range,
|
|
|
|
|
+ // material: this.Cesium.Color.RED.withAlpha(0.5), // 设置锥体的颜色和透明度
|
|
|
|
|
+ // outline: true,
|
|
|
|
|
+ // outlineColor: this.Cesium.Color.RED,
|
|
|
|
|
+ // },
|
|
|
|
|
+ ellipsoid: {
|
|
|
|
|
+ radii: new this.Cesium.Cartesian3(range, range, range),
|
|
|
|
|
+ material: this.Cesium.Color.GREEN.withAlpha(0.5), // 设置球体的颜色和透明度
|
|
|
|
|
+ outline: true,
|
|
|
|
|
+ outlineColor: this.Cesium.Color.GREEN,
|
|
|
|
|
+ },
|
|
|
|
|
+ point: {
|
|
|
|
|
+ pixelSize: 12, // 调整点的大小，可以增大点的像素大小
|
|
|
|
|
+ color: this.Cesium.Color.fromCssColorString(color)
|
|
|
|
|
+ },
|
|
|
|
|
+ model: {
|
|
|
|
|
+ uri: modelUrl, // 替换为你的3D模型文件路径
|
|
|
|
|
+ scale: 1.0, // 调整3D模型的缩放大小
|
|
|
|
|
+ minimumPixelSize: 64 // 设置3D模型的最小像素大小，确保在视图中可见
|
|
|
|
|
+ },
|
|
|
|
|
+ label: {
|
|
|
|
|
+ text: type + ' ' + name,
|
|
|
|
|
+ show: true,
|
|
|
|
|
+ font: "18px Helvetica", // 调整标签的字体样式和大小
|
|
|
|
|
+ pixelOffset: new this.Cesium.Cartesian2(0, 20) // 调整标签的像素偏移，向下偏移20像素
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ this.nameIdList.push({
|
|
|
|
|
+ id: this.id,
|
|
|
|
|
+ name: name
|
|
|
|
|
+ })
|
|
|
|
|
+ this.id++;
|
|
|
|
|
+ }
|
|
|
|
|
+ else {
|
|
|
|
|
+ this.viewer2D.entities.add({
|
|
|
|
|
+ id: this.id,
|
|
|
|
|
+ position: position,
|
|
|
|
|
+ point: {
|
|
|
|
|
+ pixelSize: 12, // 调整点的大小，可以增大点的像素大小
|
|
|
|
|
+ color: this.Cesium.Color.fromCssColorString(color)
|
|
|
|
|
+ },
|
|
|
|
|
+ model: {
|
|
|
|
|
+ uri: modelUrl, // 替换为你的3D模型文件路径
|
|
|
|
|
+ scale: 1.0, // 调整3D模型的缩放大小
|
|
|
|
|
+ minimumPixelSize: 64 // 设置3D模型的最小像素大小，确保在视图中可见
|
|
|
|
|
+ },
|
|
|
|
|
+ label: {
|
|
|
|
|
+ text: type + ' ' + name,
|
|
|
|
|
+ show: true,
|
|
|
|
|
+ font: "18px Helvetica", // 调整标签的字体样式和大小
|
|
|
|
|
+ pixelOffset: new this.Cesium.Cartesian2(0, 20) // 调整标签的像素偏移，向下偏移20像素
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ this.viewer3D.entities.add({
|
|
|
|
|
+ id: this.id,
|
|
|
|
|
+ position: position,
|
|
|
|
|
+ point: {
|
|
|
|
|
+ pixelSize: 12, // 调整点的大小，可以增大点的像素大小
|
|
|
|
|
+ color: this.Cesium.Color.fromCssColorString(color)
|
|
|
|
|
+ },
|
|
|
|
|
+ model: {
|
|
|
|
|
+ uri: modelUrl, // 替换为你的3D模型文件路径
|
|
|
|
|
+ scale: 1.0, // 调整3D模型的缩放大小
|
|
|
|
|
+ minimumPixelSize: 64 // 设置3D模型的最小像素大小，确保在视图中可见
|
|
|
|
|
+ },
|
|
|
|
|
+ label: {
|
|
|
|
|
+ text: type + ' ' + name,
|
|
|
|
|
+ show: true,
|
|
|
|
|
+ font: "18px Helvetica", // 调整标签的字体样式和大小
|
|
|
|
|
+ pixelOffset: new this.Cesium.Cartesian2(0, 20) // 调整标签的像素偏移，向下偏移20像素
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ this.nameIdList.push({
|
|
|
|
|
+ id: this.id,
|
|
|
|
|
+ name: name
|
|
|
|
|
+ })
|
|
|
|
|
+ this.id++;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ console.log('this.viewer3D.entities :>> ', this.viewer3D.entities);
|
|
|
},
|
|
},
|
|
|
// 从鼠标点击事件获取坐标
|
|
// 从鼠标点击事件获取坐标
|
|
|
getCoordinatesFromEvent(event) {
|
|
getCoordinatesFromEvent(event) {
|
|
@@ -873,71 +943,71 @@ export default {
|
|
|
}
|
|
}
|
|
|
} else if (this.selectedMarker && this.modeltooltip === "右键取消") {
|
|
} else if (this.selectedMarker && this.modeltooltip === "右键取消") {
|
|
|
// const material = new this.Cesium.PolylineArrowMaterialProperty(this.selectedMarker.point.color);
|
|
// const material = new this.Cesium.PolylineArrowMaterialProperty(this.selectedMarker.point.color);
|
|
|
- console.log('this.$data._viewer2D.entities.values :>> ', this.$data._viewer2D.entities.getById(this.selectedMarker.id).position._value);
|
|
|
|
|
- let position = this.convertWorldToCartographic(this.$data._viewer2D.entities.getById(this.selectedMarker.id).position._value)
|
|
|
|
|
|
|
+ console.log('this.viewer2D.entities.values :>> ', this.viewer2D.entities.getById(this.selectedMarker.id).position._value);
|
|
|
|
|
+ let position = this.convertWorldToCartographic(this.viewer2D.entities.getById(this.selectedMarker.id).position._value)
|
|
|
|
|
|
|
|
let name = ''
|
|
let name = ''
|
|
|
- for(let i = 0;i<this.nameIdList.length;i++){
|
|
|
|
|
-
|
|
|
|
|
- if(this.nameIdList[i].id == this.selectedMarker.id){
|
|
|
|
|
|
|
+ for (let i = 0; i < this.nameIdList.length; i++) {
|
|
|
|
|
+
|
|
|
|
|
+ if (this.nameIdList[i].id == this.selectedMarker.id) {
|
|
|
name = this.nameIdList[i].name
|
|
name = this.nameIdList[i].name
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- for(let i = 0;i<this.jsonData.blueunit.length;i++){
|
|
|
|
|
- if(name == this.jsonData.blueunit[i].name){
|
|
|
|
|
|
|
+ for (let i = 0; i < this.jsonData.blueunit.length; i++) {
|
|
|
|
|
+ if (name == this.jsonData.blueunit[i].name) {
|
|
|
this.jsonData.blueunit[i].pos.lat = position.latitude.toFixed(6)
|
|
this.jsonData.blueunit[i].pos.lat = position.latitude.toFixed(6)
|
|
|
this.jsonData.blueunit[i].pos.lon = position.longitude.toFixed(6)
|
|
this.jsonData.blueunit[i].pos.lon = position.longitude.toFixed(6)
|
|
|
this.jsonData.blueunit[i].pos.h = position.height.toFixed(2)
|
|
this.jsonData.blueunit[i].pos.h = position.height.toFixed(2)
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- for(let i = 0;i<this.jsonData.redunit.length;i++){
|
|
|
|
|
- if(name == this.jsonData.redunit.name){
|
|
|
|
|
|
|
+ for (let i = 0; i < this.jsonData.redunit.length; i++) {
|
|
|
|
|
+ if (name == this.jsonData.redunit.name) {
|
|
|
this.jsonData.redunit.component_movementjson.properties.launch_lon = position.longitude.toFixed(6)
|
|
this.jsonData.redunit.component_movementjson.properties.launch_lon = position.longitude.toFixed(6)
|
|
|
this.jsonData.redunit.component_movementjson.properties.launch_lat = position.latitude.toFixed(6)
|
|
this.jsonData.redunit.component_movementjson.properties.launch_lat = position.latitude.toFixed(6)
|
|
|
this.jsonData.redunit.component_movementjson.properties.launch_h = position.height.toFixed(2)
|
|
this.jsonData.redunit.component_movementjson.properties.launch_h = position.height.toFixed(2)
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- for(let i = 0;i<this.jsonData.center.length;i++){
|
|
|
|
|
- if(name == this.jsonData.center[i].name){
|
|
|
|
|
|
|
+ for (let i = 0; i < this.jsonData.center.length; i++) {
|
|
|
|
|
+ if (name == this.jsonData.center[i].name) {
|
|
|
this.jsonData.center[i][name].properties.lon = position.longitude.toFixed(6)
|
|
this.jsonData.center[i][name].properties.lon = position.longitude.toFixed(6)
|
|
|
this.jsonData.center[i][name].properties.lat = position.latitude.toFixed(6)
|
|
this.jsonData.center[i][name].properties.lat = position.latitude.toFixed(6)
|
|
|
this.jsonData.center[i][name].properties.h = position.height.toFixed(2)
|
|
this.jsonData.center[i][name].properties.h = position.height.toFixed(2)
|
|
|
- for(let j = 0;j<this.jsonData.redunit.length;j++){
|
|
|
|
|
- this.jsonData.redunit[j].component_movementjson.properties.target_lon = position.longitude.toFixed(6)
|
|
|
|
|
- this.jsonData.redunit[j].component_movementjson.properties.target_lat = position.latitude.toFixed(6)
|
|
|
|
|
- this.jsonData.redunit[j].component_movementjson.properties.target_h = position.height.toFixed(2)
|
|
|
|
|
- }
|
|
|
|
|
-// 新的终点坐标
|
|
|
|
|
-const newEndPoint = this.Cesium.Cartesian3.fromDegrees(position.longitude, position.latitude, position.height);
|
|
|
|
|
-// 遍历所有的entity对象
|
|
|
|
|
-this.$data._viewer2D.entities.values.forEach(entity => {
|
|
|
|
|
- // 检查entity是否为Polyline类型
|
|
|
|
|
- if (entity instanceof this.Cesium.Entity && entity.polyline) {
|
|
|
|
|
- // 获取原始的Polyline坐标数组
|
|
|
|
|
- const positions = entity.polyline.positions.getValue(); // 得到一个Cartesian3数组
|
|
|
|
|
|
|
+ for (let j = 0; j < this.jsonData.redunit.length; j++) {
|
|
|
|
|
+ this.jsonData.redunit[j].component_movementjson.properties.target_lon = position.longitude.toFixed(6)
|
|
|
|
|
+ this.jsonData.redunit[j].component_movementjson.properties.target_lat = position.latitude.toFixed(6)
|
|
|
|
|
+ this.jsonData.redunit[j].component_movementjson.properties.target_h = position.height.toFixed(2)
|
|
|
|
|
+ }
|
|
|
|
|
+ // 新的终点坐标
|
|
|
|
|
+ const newEndPoint = this.Cesium.Cartesian3.fromDegrees(position.longitude, position.latitude, position.height);
|
|
|
|
|
+ // 遍历所有的entity对象
|
|
|
|
|
+ this.viewer2D.entities.values.forEach(entity => {
|
|
|
|
|
+ // 检查entity是否为Polyline类型
|
|
|
|
|
+ if (entity instanceof this.Cesium.Entity && entity.polyline) {
|
|
|
|
|
+ // 获取原始的Polyline坐标数组
|
|
|
|
|
+ const positions = entity.polyline.positions.getValue(); // 得到一个Cartesian3数组
|
|
|
|
|
|
|
|
- // 修改终点坐标为新的坐标
|
|
|
|
|
- positions[positions.length - 1] = newEndPoint;
|
|
|
|
|
|
|
+ // 修改终点坐标为新的坐标
|
|
|
|
|
+ positions[positions.length - 1] = newEndPoint;
|
|
|
|
|
|
|
|
// 更新entity的Polyline坐标
|
|
// 更新entity的Polyline坐标
|
|
|
entity.polyline.positions = new this.Cesium.CallbackProperty(time => positions, false);
|
|
entity.polyline.positions = new this.Cesium.CallbackProperty(time => positions, false);
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
-this.$data._viewer3D.entities.values.forEach(entity => {
|
|
|
|
|
|
|
+this.viewer3D.entities.values.forEach(entity => {
|
|
|
// 检查entity是否为Polyline类型
|
|
// 检查entity是否为Polyline类型
|
|
|
if (entity instanceof this.Cesium.Entity && entity.polyline) {
|
|
if (entity instanceof this.Cesium.Entity && entity.polyline) {
|
|
|
// 获取原始的Polyline坐标数组
|
|
// 获取原始的Polyline坐标数组
|
|
|
const positions = entity.polyline.positions.getValue(); // 得到一个Cartesian3数组
|
|
const positions = entity.polyline.positions.getValue(); // 得到一个Cartesian3数组
|
|
|
|
|
|
|
|
- // 修改终点坐标为新的坐标
|
|
|
|
|
- positions[positions.length - 1] = newEndPoint;
|
|
|
|
|
|
|
+ // 修改终点坐标为新的坐标
|
|
|
|
|
+ positions[positions.length - 1] = newEndPoint;
|
|
|
|
|
|
|
|
- // 更新entity的Polyline坐标
|
|
|
|
|
- entity.polyline.positions = new this.Cesium.CallbackProperty(time => positions, false);
|
|
|
|
|
- }
|
|
|
|
|
-});
|
|
|
|
|
|
|
+ // 更新entity的Polyline坐标
|
|
|
|
|
+ entity.polyline.positions = new this.Cesium.CallbackProperty(time => positions, false);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
// this.$data._viewer2D.entities.add({
|
|
// this.$data._viewer2D.entities.add({
|
|
@@ -1060,9 +1130,10 @@ this.$data._viewer3D.entities.values.forEach(entity => {
|
|
|
display: none !important;
|
|
display: none !important;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-.container{
|
|
|
|
|
|
|
+.container {
|
|
|
height: 100%;
|
|
height: 100%;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
.modeltooltip {
|
|
.modeltooltip {
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
padding: 5px;
|
|
padding: 5px;
|
|
@@ -1141,7 +1212,7 @@ this.$data._viewer3D.entities.values.forEach(entity => {
|
|
|
width: 300px;
|
|
width: 300px;
|
|
|
/* display: none; */
|
|
/* display: none; */
|
|
|
height: 100%;
|
|
height: 100%;
|
|
|
- overflow-y:visible;
|
|
|
|
|
|
|
+ overflow-y: visible;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.model {
|
|
.model {
|
|
@@ -1184,13 +1255,12 @@ this.$data._viewer3D.entities.values.forEach(entity => {
|
|
|
|
|
|
|
|
/* 罗盘样式 */
|
|
/* 罗盘样式 */
|
|
|
/deep/.compass {
|
|
/deep/.compass {
|
|
|
- pointer-events: auto;
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- right: 0px;
|
|
|
|
|
- top: 280px;
|
|
|
|
|
- width: 95px;
|
|
|
|
|
- height: 95px;
|
|
|
|
|
- overflow: hidden;
|
|
|
|
|
|
|
+ pointer-events: auto;
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ right: 0px;
|
|
|
|
|
+ top: 280px;
|
|
|
|
|
+ width: 95px;
|
|
|
|
|
+ height: 95px;
|
|
|
|
|
+ overflow: hidden;
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
</style>
|
|
</style>
|
