import store from "../../store";
|
import mapServer from "./map/mapServer";
|
const mapSetFunc = {
|
layerList: [],
|
place: null,
|
init(res) {
|
this.removeAll();
|
this.place = res.place;
|
switch (res.func) {
|
case "poiMap":
|
this.creatPoiMap(res);
|
break;
|
case "aroundPoi":
|
this.creatAroundPoi(res);
|
break;
|
case "getStrike":
|
this.creatAroundPoi(res);
|
break;
|
case "queryRelationship":
|
this.creatQueryRelationship(res);
|
break;
|
case "queryMeta":
|
this.creatQueryMeta(res);
|
break;
|
case "aroundPoi_2":
|
// this.addWfsLayer(res);
|
this.addTetrahedron(res);
|
break;
|
case "getParam":
|
this.addTetrahedron(res);
|
break;
|
case "getTAIWAN":
|
this.addWfsLayer(res);
|
// this.addTetrahedron(res);
|
break;
|
case "attackentity":
|
this.addPolyLine(res);
|
break;
|
}
|
},
|
creatQueryMeta(res) {
|
const ids = res.ids;
|
const colors = [];
|
for (var i in ids) {
|
colors.push({
|
name: ids[i].name,
|
color: this.getRandomColor(),
|
ids: ids[i].ids
|
});
|
}
|
store.state.setListColor = colors;
|
store.state.showLenged = true;
|
|
this.setModelChangeColor(colors);
|
},
|
setModelChangeColor(res) {
|
console.log('mapServer.listData', mapServer.listData, config.modelLayer);
|
const modelLayer = mapServer.listData.filter((obj) => {
|
if (obj.name == config.modelLayer) {
|
return obj;
|
}
|
});
|
if (modelLayer.length <= 0) return;
|
earthCtrl.userScene.flyTo(modelLayer[0].layer);
|
modelLayer[0].layer.style = new Cesium.Cesium3DTileStyle({
|
color: {
|
evaluateColor: (feature) => {
|
const id = feature.getProperty("id");
|
console.log("id**********", id);
|
const color = res.filter((item) => {
|
if (item.ids.indexOf(id) > -1) {
|
return item;
|
}
|
});
|
if (color.length > 0) {
|
return new SmartEarth.Cesium.Color.fromCssColorString(
|
color[0].color
|
);
|
}
|
}
|
}
|
});
|
},
|
getRandomColor() {
|
var letters = "0123456789ABCDEF";
|
var color = "#";
|
for (var i = 0; i < 6; i++) {
|
color += letters[Math.floor(Math.random() * 16)];
|
}
|
return color;
|
},
|
creatQueryRelationship(res) {
|
if (!res.data) return;
|
const center = res.data.center;
|
const centerPoint = { lon: center._x, lat: center._y };
|
const items = res.data.positions;
|
const groupByName = items.reduce((acc, item) => {
|
acc[item.targettype] = acc[item.targettype] || [];
|
acc[item.targettype].push(item);
|
return acc;
|
}, {});
|
const colors = [];
|
for (var key in groupByName) {
|
const color = this.getRandomColor();
|
colors.push({
|
name: key,
|
color: color
|
});
|
this.setShowPathLine(groupByName[key], color, res.func, centerPoint);
|
}
|
this.setShowTextPoint(center);
|
// store.state.setListColor = colors;
|
// store.state.showLenged = true;
|
},
|
setShowTextPoint(res) {
|
const alt = res.height ? res.height + 10 : 100;
|
const richTextPoint = earthCtrl.factory.createRichTextPoint(
|
res.name_1,
|
[res._x, res._y, alt],
|
{
|
fontColor: "#ffff00",
|
fontSize: 18
|
},
|
"0"
|
);
|
var position = SmartEarth.Cesium.Cartesian3.fromDegrees(
|
res._x,
|
res._y,
|
10000
|
);
|
Viewer.camera.setView({
|
destination: position, // 目的地位置
|
orientation: {
|
heading: Cesium.Math.toRadians(0.0), // 方向，以弧度为单位
|
pitch: Cesium.Math.toRadians(-90.0), // 倾斜角，以弧度为单位
|
roll: 0.0 // 滚动角，以弧度为单位
|
}
|
});
|
this.layerList.push({
|
path: richTextPoint,
|
func: "TextPoint"
|
});
|
},
|
setShowPathLine(positions, color, func, centerPoint) {
|
var cities = [];
|
for (var i = 0; i < positions.length; i++) {
|
const item = { lon: positions[i]._x, lat: positions[i]._y };
|
|
if (item.lon != centerPoint.lon && item.lat != centerPoint.lat)
|
cities.push(item);
|
}
|
let pathOption = {
|
width: 3, //线宽（可选）
|
color: color, //线颜色（可选）,
|
LightSpot: true, //是否使用光点效果（可选）
|
LightSpotColor: "#ffffff", //光点颜色（可选）
|
height: 200
|
};
|
var path = earthCtrl.factory.createTrailLinePath(
|
centerPoint,
|
cities,
|
pathOption
|
);
|
this.layerList.push({
|
path: path,
|
func: func
|
});
|
},
|
containsObject(arr, obj) {
|
return arr.some(function (element) {
|
return element.lon === obj.lon && element.lat === obj.lat; // 假设对象有一个名为'id'的属性
|
});
|
},
|
|
creatPoiMap(res) {
|
res.data.forEach((poi, index) => {
|
// const poi = res.data[0];
|
console.log('poi------', poi)
|
const label = earthCtrl.factory.createLabel({
|
name: "创建文本",
|
id: earthCtrl.factory.createUUID(),
|
text: poi.name,//this.getName(poi),
|
font: "22pt monospace",
|
outlineWidth: 2,
|
fillColor: SmartEarth.Cesium.Color.YELLOW,
|
lon: poi.lontitude,
|
lat: poi.lattitude,
|
alt: poi.height ? poi.height + 10 : 100,
|
iDistanceDisplayCondition: (100, 3000)
|
});
|
setTimeout(() => {
|
this.setEntityTitlesChangeColor(poi.seid);
|
}, 200);
|
if (index == 0) {
|
earthCtrl.userScene.flyTo(label);
|
}
|
this.layerList.push({
|
layer: label,
|
func: res.func
|
});
|
});
|
},
|
setEntityTitlesChangeColor(res) {
|
const modelLayer = mapServer.listData.filter((res) => {
|
if (res.name == config.modelLayer) {
|
return res;
|
}
|
});
|
if (modelLayer.length <= 0) return;
|
// for(var i in Viewer.scene.primitives._primitives){
|
// console.log(Viewer.scene.primitives._primitives[i].name);
|
|
// }
|
// debugger
|
// modelLayer[0].layer.style = new Cesium.Cesium3DTileStyle({
|
// color: {
|
// conditions: [
|
// ['${id} === "'+res+'"', 'rgba(255, 0, 0, 1)'], // 当id匹配时变为红色
|
// ['true', 'rgba(0, 0, 0, 1)'] // 其他情况为蓝色
|
// ]
|
// }
|
// });
|
|
modelLayer[0].layer.style = new Cesium.Cesium3DTileStyle({
|
color: {
|
evaluateColor: (feature) => {
|
const id = feature.getProperty("id");
|
if (id.toString() == res) {
|
return new SmartEarth.Cesium.Color.fromCssColorString("#FF8C00");
|
}
|
}
|
}
|
});
|
},
|
getName(res) {
|
var name = "";
|
if (res.entityname && res.entityname.indexOf(this.place) > -1) {
|
name = res.entityname;
|
}
|
if (!name) {
|
if (res.entityname) {
|
name = res.entityname;
|
}
|
}
|
return name;
|
},
|
creatAroundPoi(res) {
|
let colors = [];
|
res.data.forEach((element) => {
|
colors.push({
|
name: element.type,
|
color: element.color,
|
ids: element.list
|
});
|
})
|
console.log('colors----', colors);
|
store.state.setListColor = colors;
|
store.state.showLenged = true;
|
this.setModelChangeColor(colors);
|
},
|
creatAroundPoi1111(res) {
|
const poi = res.data;
|
var std = [];
|
var feature = {
|
type: "FeatureCollection",
|
features: []
|
};
|
var ids = [];
|
for (var i in poi) {
|
ids.push(poi[i].seid);
|
const attri = poi[i].height ? poi[i].height + 10 : 100;
|
std.push({
|
type: "Feature",
|
geometry: {
|
type: "Point",
|
coordinates: [poi[i]._x, poi[i]._y, attri]
|
},
|
properties: {
|
name: this.getName(poi[i])
|
}
|
});
|
}
|
feature.features = std;
|
var geoJsonDataSource = new SmartEarth.Cesium.GeoJsonDataSource();
|
|
// 加载GeoJSON数据
|
geoJsonDataSource.load(feature).then((dataSource) => {
|
this.layerList.push({
|
layer: dataSource,
|
func: res.func
|
});
|
Viewer.dataSources.add(dataSource);
|
var entities = dataSource.entities.values;
|
|
// 遍历所有GeoJSON中的点
|
for (var i = 0; i < entities.length; i++) {
|
var entity = entities[i];
|
if (entity.billboard) {
|
entity.billboard.show = false;
|
}
|
// // 设置点的图片（billboard）
|
// entity.billboard = {
|
// image: SmartEarthRootUrl + "Workers/image/mark.png", // 使用properties中的iconUrl作为图片路径
|
// width: 16,
|
// height: 22,
|
// // 文本偏移量
|
// pixelOffset: new SmartEarth.Cesium.Cartesian2(0, -20),
|
// // 图片偏移量
|
// iPixelOffset: new SmartEarth.Cesium.Cartesian2(0, -20)
|
// };
|
entity.label = new SmartEarth.Cesium.LabelGraphics({
|
text: entity.properties.name, // 使用properties中的name作为文本内容
|
font: "10pt monospace",
|
fillColor: new SmartEarth.Cesium.Color.fromCssColorString("#FFFF00"),
|
outlineColor: SmartEarth.Cesium.Color.BLACK,
|
outlineWidth: 2,
|
pixelOffset: new SmartEarth.Cesium.Cartesian2(0, -50),
|
style: SmartEarth.Cesium.LabelStyle.FILL_AND_OUTLINE
|
});
|
}
|
// Viewer.zoomTo(dataSource);
|
earthCtrl.userScene.flyTo(dataSource);
|
});
|
const modelLayer = mapServer.listData.filter((res) => {
|
if (res.name == config.modelLayer) {
|
return res;
|
}
|
});
|
|
if (modelLayer.length <= 0) return;
|
|
modelLayer[0].layer.style = new Cesium.Cesium3DTileStyle({
|
color: {
|
evaluateColor: (feature) => {
|
const id = feature.getProperty("id");
|
if (ids.indexOf(id) > -1) {
|
return new SmartEarth.Cesium.Color.fromCssColorString("#FF8C00");
|
}
|
}
|
}
|
});
|
},
|
|
// 添加wfs
|
addWfsLayer(res) {
|
if (window.terrain) {
|
window.terrain.removeFromMap();
|
window.terrain = null;
|
}
|
// earthCtrl.viewer.scene.globe.show = false;
|
earthCtrl.viewer.camera.flyTo({
|
destination: {
|
x: -3475710.5684351875,
|
y: 5625834.799523204,
|
z: 2729961.751894543,
|
},
|
orientation: {
|
heading: 5.73978482494632,
|
pitch: -1.2817819264676036,
|
roll: 6.282989918773924,
|
},
|
});
|
const layer1 = earthCtrl.factory.createWfsLayer('point', {
|
urls: 'https://cim.smartearth.cn/geoserver/JiaShanBase/ows',
|
layer: 'JiaShanBase:RadarSpot',
|
text: '[JiaShanBase:Type]',
|
color: '#de3',
|
disableDepthTestDistance: Infinity
|
})
|
this.layerList.push({
|
layer: layer1,
|
func: res.func
|
});
|
const layer2 = earthCtrl.factory.createWfsLayer('polyline', {
|
urls: 'https://cim.smartearth.cn/geoserver/JiaShanBase/ows',
|
layer: 'JiaShanBase:RadarL',
|
width: 1.5,
|
color: '#87CEFA',
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
})
|
this.layerList.push({
|
layer: layer2,
|
func: res.func
|
});
|
const layer3 = earthCtrl.factory.createWfsLayer('polyline', {
|
urls: 'https://cim.smartearth.cn/geoserver/JiaShanBase/ows',
|
layer: 'JiaShanBase:RadarM',
|
width: 1.5,
|
color: '#de3',
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
})
|
this.layerList.push({
|
layer: layer3,
|
func: res.func
|
});
|
const layer4 = earthCtrl.factory.createWfsLayer('polyline', {
|
urls: 'https://cim.smartearth.cn/geoserver/JiaShanBase/ows',
|
layer: 'JiaShanBase:RadarS',
|
width: 1.5,
|
color: '#FF0000',
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
})
|
this.layerList.push({
|
layer: layer4,
|
func: res.func
|
});
|
this.addRaderLayer(res);
|
},
|
//雷达遮罩扫描
|
addRaderLayer(res) {
|
//雷达遮罩扫描（自定义）
|
const option = {
|
radius: 150000, //半径
|
yaw: 0, //雷达方向（可选）
|
angle: 120, //雷达夹角（可选）
|
scanAngle: 30, //扫描夹角（可选）
|
speed: 5, //倍速（可选）
|
maxLat: 90, //下维度（可选）
|
minLat: 45, //上维度（可选）
|
stackPartitions: 40, //横向网格数（可选）
|
slicePartitions: 80, //纵向网格数（可选）
|
//color: 'rgba(255,255,255,0.5)', //雷达遮罩颜色（可选）
|
//outlineColor: 'rgba(255,255,255,0.5)', //雷达遮罩边框线颜色（可选）
|
//scanColor: 'rgba(255,0,0,0.5)', //扫描颜色（可选）
|
};
|
const position1 = [121.614202387521061, 23.990136825668284, 0];
|
// 雷达遮罩
|
const layer = earthCtrl.factory.createRadarMaskScan('雷达遮罩扫描1', position1, option)
|
this.layerList.push({
|
layer: layer,
|
func: 'radarMaskScan'
|
});
|
},
|
//视锥
|
addTetrahedron(res) {
|
const modelLayer = mapServer.listData.filter((obj) => {
|
if (obj.name == config.modelLayer) {
|
return obj;
|
}
|
});
|
let ids = [];
|
res.data.forEach((item, index) => {
|
const tetrahedron = earthCtrl.factory.addTetrahedron({
|
position: {
|
lon: item.lontitude,
|
lat: item.lattitude,
|
height: item.height
|
},
|
multiple: 0.05,
|
scale: new SmartEarth.Cesium.Cartesian3(30, 30, 30),
|
color: "#FF0000",
|
outlineColor: "#FF0000"
|
});
|
if (index == 0) {
|
// 将经纬度转换为Cartesian3坐标
|
const position = Cesium.Cartesian3.fromDegrees(item.lontitude, item.lattitude - 0.01, 500);
|
// 创建一个边界球 (Bounding Sphere)，假设半径为500
|
const boundingSphere = new Cesium.BoundingSphere(position, 1000);
|
// 使用 flyToBoundingSphere 定位相机
|
earthCtrl.viewer.camera.flyToBoundingSphere(boundingSphere, {
|
duration: 3.0, // 飞行的时间
|
offset: new Cesium.HeadingPitchRange(0, Cesium.Math.toRadians(-30), 6.28316028073749),
|
});
|
// earthCtrl.camera.flyTo(item.lontitude, item.lattitude, 5000, 0, -90, 0, 2);
|
}
|
ids.push(item.uuid);
|
this.layerList.push({
|
layer: tetrahedron,
|
func: 'tetrahedron'
|
});
|
});
|
modelLayer[0].layer.style = new Cesium.Cesium3DTileStyle({
|
color: {
|
evaluateColor: (feature) => {
|
const id = feature.getProperty("id");
|
if (ids.indexOf(id) > -1) {
|
console.log("id**********", id);
|
return new SmartEarth.Cesium.Color.fromCssColorString(
|
'#FF0000'
|
);
|
}
|
}
|
}
|
});
|
},
|
|
//绘制线
|
addPolyLine(res) {
|
// 解析 LINESTRING 字符串为经纬度坐标数组
|
const coordinates = res.bombpoint
|
.replace("LINESTRING", "") // 去除 'LINESTRING' 部分
|
.replace(/[()]/g, "") // 去除括号
|
.split(",") // 按逗号分割
|
.map(coord => {
|
const [lon, lat] = coord.trim().split(" "); // 将每对坐标分开
|
return [parseFloat(lon), parseFloat(lat)]; // 转换为数字
|
});
|
const positions = coordinates.map(coord => {
|
return {
|
x: coord[0],
|
y: coord[1],
|
z: 21
|
};
|
});
|
positions.forEach((item, index) => {
|
const particle = earthCtrl.factory.createParticleEffect("flame", item, {
|
translation: SmartEarth.Cesium.Cartesian3.fromElements(0, 0, 0), //平移
|
emissionRate: 500,
|
startScale: 15,
|
endScale: 45,
|
});
|
if (index == positions.length / 2) {
|
earthCtrl.camera.flyTo(item.x, item.y, 3000, 0, -90, 0, 2);
|
}
|
this.layerList.push({
|
layer: particle,
|
func: 'attackentity'
|
});
|
})
|
},
|
|
removeAll() {
|
store.state.setListColor = [];
|
store.state.showLenged = false;
|
const modelLayer = mapServer.listData.filter((res) => {
|
if (res.name == config.modelLayer) {
|
return res;
|
}
|
});
|
if (modelLayer.length > 0) {
|
modelLayer[0].layer.style = new Cesium.Cesium3DTileStyle({
|
color: {
|
evaluateColor: (feature) => {
|
return new SmartEarth.Cesium.Color.fromCssColorString("#FFFFFF");
|
}
|
}
|
});
|
}
|
|
for (var i = 0; i < this.layerList.length; i++) {
|
const obj = this.layerList[i];
|
if (obj.func == "poiMap") {
|
this.layerList[i].layer.removeFromMap();
|
this.layerList.splice(i, 1);
|
i--;
|
} else if (obj.func == "aroundPoi") {
|
Viewer.dataSources.removeAll();
|
this.layerList.splice(i, 1);
|
i--;
|
} else if (obj.func == "queryRelationship") {
|
this.layerList[i].path.deleteObject();
|
this.layerList.splice(i, 1);
|
i--;
|
} else if (obj.func == "TextPoint") {
|
this.layerList[i].path.deleteObject();
|
this.layerList.splice(i, 1);
|
i--;
|
}
|
else if (obj.func == "aroundPoi_2") {
|
this.layerList[i].layer.destroy();
|
this.layerList.splice(i, 1);
|
i--;
|
}
|
else if (obj.func == "getTAIWAN") {
|
this.layerList[i].layer.destroy();
|
this.layerList.splice(i, 1);
|
i--;
|
}
|
else if (obj.func == "radarMaskScan") {
|
this.layerList[i].layer.deleteObject();
|
this.layerList.splice(i, 1);
|
i--;
|
}
|
else if (obj.func == "tetrahedron") {
|
this.layerList[i].layer.deleteObject();
|
this.layerList.splice(i, 1);
|
i--;
|
}
|
else if (obj.func == "attackentity") {
|
this.layerList[i].layer.deleteObject();
|
this.layerList.splice(i, 1);
|
i--;
|
}
|
}
|
if (!window.terrain) {
|
window.terrain = earthCtrl.factory.createTerrainLayer({
|
sourceType: "ctb",
|
url: config.terrainUrl
|
});
|
}
|
}
|
};
|
export default mapSetFunc;
|
