import { getToken } from "@/utils/auth";
|
//配置文件地址
|
// import config from "../../../../public/config/config";
|
import store from "@/store";
|
import { nextTick } from "vue";
|
const server = {
|
layerList: [],
|
graticules: null,
|
alpha: null,//透明度
|
geoLayer: [],
|
geoUrl: null,
|
wmsLayerId: null,
|
addTreeData(treeNode) {
|
// if (!treeNode.checked) {
|
// debugger
|
// this.delLayer(treeNode.id);
|
// return;
|
// }
|
|
this.alpha = this.getResLayersAlpha(treeNode);
|
//判断是否为代理
|
if (treeNode.proxy) {
|
this.addProxyAddress(treeNode); //有代理
|
} else {
|
this.addUrlAddress(treeNode); //无代理
|
}
|
|
if (this.graticules) {
|
window.Viewer.imageryLayers.raiseToTop(this.graticules.imageryLayer);
|
}
|
},
|
showlonlatLine() {
|
if (!this.graticules) {
|
SmartEarth.Cesium.Ellipsoid.WGS84 = new SmartEarth.Cesium.Ellipsoid(
|
1737400.0,
|
1737400.0,
|
1737400.0
|
);
|
|
this.graticules = new SmartEarth.Cesium.Graticules(
|
earthCtrl.Viewer,
|
SmartEarth.Cesium.Color.PALEGREEN
|
);
|
// graticules.makeCoordAxiss();
|
var that = this;
|
earthCtrl.Viewer.scene.preUpdate.addEventListener(function () {
|
that.graticules.update();
|
});
|
} else {
|
this.graticules.enabled = !this.graticules.enabled;
|
}
|
},
|
//代理地址
|
addProxyAddress(res) {
|
//判断数据类型
|
switch (res.data) {
|
case 1: //数字正射影像图
|
this.setDataType(res);
|
break;
|
case 2: //场景地形数据
|
this.setTerrainData(res);
|
break;
|
case 3: //数字高程模型（晕渲图）
|
this.setDataType(res);
|
break;
|
case 4: //单波段栅格数据
|
this.setDataType(res);
|
break;
|
case 5: //多光谱栅格数据
|
this.setDataType(res);
|
break;
|
case 6: //高光谱栅格数据
|
this.setDataType(res);
|
break;
|
case 7: //矢量图层
|
this.setVectorData(res);
|
break;
|
case 8: //三维模型
|
this.setModelData(res);
|
break;
|
}
|
},
|
//普通地址
|
addUrlAddress(res) {
|
switch (res.category) {
|
case 0: //其他
|
break;
|
case 1: //GisServer
|
this.addProxyAddress(res);
|
break;
|
case 2: //GeoServer
|
this.addGeoServerAddress(res);
|
break;
|
case 3: //数简
|
this.addProxyAddress(res);
|
break;
|
}
|
},
|
//Geoserver服务
|
addGeoServerAddress(res) {
|
//判断数据类型
|
switch (res.data) {
|
case 1: //数字正射影像图
|
this.setGeoDataType(res);
|
break;
|
case 2: //场景地形数据
|
this.setTerrainData(res);
|
break;
|
case 3: //数字高程模型（晕渲图）
|
this.setGeoDataType(res);
|
break;
|
case 4: //单波段栅格数据
|
this.setGeoDataType(res);
|
break;
|
case 5: //多光谱栅格数据
|
this.setGeoDataType(res);
|
break;
|
case 6: //高光谱栅格数据
|
this.setGeoDataType(res);
|
break;
|
case 7: //矢量图层
|
this.setGeoVectorData(res);
|
break;
|
case 8: //三维模型
|
this.setModelData(res);
|
break;
|
}
|
},
|
setGeoDataType(res) {
|
switch (res.type) {
|
case 0: //URL
|
break;
|
case 1: //TMS
|
this.setAddTmsLayer(res);
|
break;
|
case 2: //WMTS
|
this.setAddWmtsLayer(res);
|
break;
|
case 3: //WMS
|
this.setAddGeoWmsLayer(res);
|
break;
|
}
|
},
|
setGeoVectorData(res) {
|
switch (res.type) {
|
case 0: //URL
|
break;
|
case 3: //WMS
|
this.setAddGeoWmsLayer(res);
|
break;
|
case 4: //WFS
|
break;
|
}
|
},
|
setDataType(res) {
|
switch (res.type) {
|
case 0: //URL
|
break;
|
case 1: //TMS
|
this.setAddTmsLayer(res);
|
break;
|
case 2: //WMTS
|
this.setAddWmtsLayer(res);
|
break;
|
case 3: //WMS
|
// this.setAddWmsLayer(res);
|
this.setAddGeoWmsLayer(res)
|
break;
|
}
|
},
|
|
setTerrainData(res) {
|
switch (res.type) {
|
case 0: //URL
|
this.setAddTearrinLayer(res);
|
break;
|
case 1: //TMS
|
this.setAddTearrinLayer(res);
|
break;
|
}
|
},
|
setVectorData(res) {
|
switch (res.type) {
|
case 0: //URL
|
break;
|
case 3: //WMS
|
// this.setAddWmsLayer(res);
|
this.setAddGeoWmsLayer(res)
|
break;
|
case 4: //WFS
|
break;
|
}
|
},
|
setModelData(res) {
|
switch (res.type) {
|
case 0: //Tileset
|
this.setAddModelLayer(res);
|
break;
|
case 3: //WMS
|
this.setAddModelLayer(res);
|
break;
|
case 5: //WFS
|
break;
|
}
|
},
|
//获取服务地址
|
getLayrUrl(res) {
|
var url;
|
if (res.proxy) {
|
const token = getToken();
|
url = config.proxy + res.proxy.replaceAll("{token}", token);
|
} else {
|
url = res.url;
|
}
|
return url;
|
},
|
//加载TMS服务
|
setAddTmsLayer(res) {
|
var url = this.getLayrUrl(res);
|
let img_layer = earthCtrl.Creator.createUrlTemplateImageryProvider(
|
"tms服务",
|
{
|
url: Cesium.buildModuleUrl(url + "/{z}/{x}/{reverseY}.png"),
|
},
|
"0",
|
undefined,
|
true,
|
""
|
);
|
this.layerList.push({ id: res.id, layerData: img_layer, type: "tms" });
|
},
|
//加载WMTS服务
|
setAddWmtsLayer(res) {
|
this.delLayer(res.id);
|
var url = this.getLayrUrl(res);
|
let urlTemplateImageryProvider = new Cesium.WebMapTileServiceImageryProvider({
|
sourceType: "wmts",
|
url: url,
|
layer: "",
|
id: res.id,
|
format: "image/png",
|
tileMatrixSetID: "GoogleCRS84Quad01",
|
tileMatrixLabels: [
|
"0",
|
"1",
|
"2",
|
"3",
|
"4",
|
"5",
|
"6",
|
"7",
|
"8",
|
"9",
|
"10",
|
"11",
|
"12",
|
"13",
|
"14",
|
"15",
|
"16",
|
"17",
|
"18",
|
],
|
style: "",
|
tilingScheme: new Cesium.GeographicTilingScheme({
|
ellipsoid: Cesium.Ellipsoid.MOON,
|
}),
|
})
|
var imageLayer = window.Viewer.imageryLayers.addImageryProvider(urlTemplateImageryProvider);
|
imageLayer.id = res.id
|
|
imageLayer.alpha = this.alpha;
|
// urlTemplateImageryProvider.id = res.id
|
this.layerList.push({
|
id: res.id,
|
layerData: imageLayer,
|
type: "wmts",
|
alpha: imageLayer,
|
});
|
},
|
//获取图层之前的透明度
|
getResLayersAlpha(result) {
|
var std = this.layerList.filter(res => {
|
if (res.id == result.id) {
|
return res;
|
}
|
});
|
|
if (std.length <= 0) {
|
return 1;
|
} else {
|
var id = std[0].id;
|
var val = null;
|
var layers = window.Viewer.imageryLayers._layers;
|
for (var i in layers) {
|
if (layers[i].id == id) {
|
val = id;
|
return layers[i].alpha;
|
}
|
}
|
if (!null) {
|
return 1
|
}
|
}
|
},
|
//加载地形服务
|
setAddTearrinLayer(res) {
|
this.setChangeTearrinLayer();
|
var url = this.getLayrUrl(res);
|
window.terrainLayer = new Cesium.CesiumTerrainProvider({
|
url: url,
|
tilingScheme: new Cesium.GeographicTilingScheme({
|
ellipsoid: Cesium.Ellipsoid.MOON,
|
}),
|
});
|
Viewer.terrainProvider = window.terrainLayer;
|
Viewer.scene.globe.terrainExaggeration = 1.0000001;
|
this.layerList.push({ id: res.id, type: "dem" });
|
},
|
//加载WMS服务
|
setAddWmsLayer(res) {
|
|
var url = this.getLayrUrl(res);
|
|
var img_layer = sgworld.Creator.createImageryProvider(
|
"giserver",
|
"wms",
|
{
|
url: url,
|
layers: "",
|
parameters: {
|
format: "image/png",
|
transparent: true,
|
},
|
},
|
"0",
|
undefined,
|
true,
|
""
|
);
|
this.layerList.push({
|
id: res.id,
|
layerData: img_layer,
|
type: "wmts",
|
});
|
},
|
//加载模型服务
|
setAddModelLayer(res) {
|
var url = this.getLayrUrl(res);
|
let tileset = Viewer.scene.primitives.add(
|
new Cesium.Cesium3DTileset({
|
name: res.cnName,
|
url: url,
|
skipLevelOfDetail: true, // 在遍历时候跳过详情：false
|
baseScreenSpaceError: 1024,
|
maximumScreenSpaceError: 64, // 最大屏幕空间错误：16，数值加大能让最终成像变模糊
|
skipScreenSpaceErrorFactor: 16,
|
skipLevels: 1,
|
immediatelyLoadDesiredLevelOfDetail: false,
|
loadSiblings: true, // 自动从中心开始超清化模型：false
|
cullWithChildrenBounds: true, // 使用子项边界体积的并集来剔除图块：true
|
cullRequestsWhileMoving: true,
|
cullRequestsWhileMovingMultiplier: 10, // 值越小能够更快的剔除：60
|
preloadWhenHidden: true,
|
preferLeaves: true, // 预装子节点：false
|
maximumMemoryUsage: 768, // 内存分配变小有利于内存回收，提升性能体验
|
progressiveResolutionHeightFraction: 0.5, // 数值偏于0能够让初始加载变得模糊
|
dynamicScreenSpaceErrorDensity: 0.5, // 数值加大，能让周边加载变快
|
dynamicScreenSpaceErrorFactor: 2, // 动态屏幕空间误差的系数
|
dynamicScreenSpaceError: true, // 减少离相机较远的屏幕空间错误：false，全屏加载完之后才清晰化房屋
|
})
|
);
|
tileset.readyPromise.then((tileset) => {
|
tileset.id = res.id;
|
});
|
this.layerList.push({ id: res.id, layerData: tileset, type: "tileset" });
|
},
|
//地形移除事件
|
setChangeTearrinLayer() {
|
this.layerList.forEach((e, i) => {
|
switch (e.type) {
|
case "dem":
|
window.Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider(
|
{}
|
);
|
this.layerList.splice(i, 1);
|
break;
|
}
|
});
|
},
|
|
//清除图层
|
delLayer(code) {
|
|
this.layerList.forEach((e, i) => {
|
if (e.id === code) {
|
switch (e.type) {
|
case "wmts":
|
window.Viewer.imageryLayers.remove(e.layerData);
|
break;
|
case "wms":
|
window.Viewer.imageryLayers.remove(e.layerData);
|
break;
|
case "tms":
|
window.Viewer.imageryLayers.remove(e.layerData);
|
break;
|
case "dem":
|
window.Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider(
|
{}
|
);
|
break;
|
case "tileset":
|
window.Viewer.scene.primitives.remove(e.layerData);
|
break;
|
}
|
this.layerList.splice(i, 1);
|
}
|
});
|
},
|
|
delLayerAll() {
|
this.layerList.forEach((e, i) => {
|
this.setRemoveLayer(e);
|
this.layerList.splice(i, 1);
|
});
|
},
|
setRemoveLayer(e) {
|
switch (e.type) {
|
case "wmts":
|
window.Viewer.imageryLayers.remove(e.layerData);
|
break;
|
case "tms":
|
window.Viewer.imageryLayers.remove(e.layerData);
|
break;
|
case "dem":
|
window.Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider(
|
{}
|
);
|
break;
|
case "tileset":
|
window.Viewer.scene.primitives.remove(e.layerData);
|
break;
|
|
}
|
},
|
//加载GeoServer-WMS服务
|
setAddGeoWmsLayer(res, alpha) {
|
//
|
var url = res.url;
|
var that = this;
|
this.delLayer(res.id)
|
var getFeatureInfoFormat = new SmartEarth.Cesium.GetFeatureInfoFormat(
|
"html",
|
null,
|
function (html) {
|
that.getFeatureInfo(html);
|
}
|
);
|
if (url.indexOf('{token}') > -1) {
|
const token = getToken();
|
url = config.proxy + url.replaceAll("{token}", token);
|
} else {
|
url = url;
|
}
|
|
let layer = new SmartEarth.Cesium.WebMapServiceImageryProvider({
|
url: url,
|
layers: res.tab,
|
id: res.id,
|
getFeatureInfoParameters: { info_format: "text/html", srs: "EPSG:104903" },
|
enablePickFeatures: true,
|
getFeatureInfoFormats: [getFeatureInfoFormat],
|
parameters: {
|
transparent: true,
|
format: "image/png",
|
srs: "EPSG:104903",
|
styles: "",
|
},
|
tileWidth: 512,
|
tileHeight: 512,
|
});
|
|
let img_layer = window.Viewer.imageryLayers.addImageryProvider(layer);
|
img_layer.name = `Wms_Layer${res.id}`;
|
img_layer.id = res.id
|
img_layer.alpha = alpha ? alpha : 1;
|
this.layerList.push({ id: res.id, layerData: img_layer, type: "wmts" });
|
},
|
addGeoServerMmsLayers(layer, url) {
|
this.geoLayer = layer;
|
this.geoUrl = url;
|
var that = this;
|
var getFeatureInfoFormat = new SmartEarth.Cesium.GetFeatureInfoFormat(
|
"html",
|
null,
|
function (html) {
|
that.getFeatureInfo(html);
|
}
|
);
|
if (url.indexOf('{token}') > -1) {
|
const token = getToken();
|
url = config.proxy + url.replaceAll("{token}", token);
|
} else {
|
url = url;
|
}
|
|
if (!this.wmsLayerId) {
|
this.wmsLayerId = new Date();
|
}
|
let wmslayer = new SmartEarth.Cesium.WebMapServiceImageryProvider({
|
url: url,
|
id: this.wmsLayerId,
|
layers: layer.toString(),
|
getFeatureInfoParameters: { info_format: "text/html", srs: "EPSG:104903" },
|
enablePickFeatures: true,
|
getFeatureInfoFormats: [getFeatureInfoFormat],
|
parameters: {
|
transparent: true,
|
format: "image/png",
|
srs: "EPSG:104903",
|
styles: "",
|
},
|
tileWidth: 512,
|
tileHeight: 512,
|
});
|
|
let img_layer = window.Viewer.imageryLayers.addImageryProvider(wmslayer);
|
img_layer.id = this.wmsLayerId;
|
this.layerList.push({ id: this.wmsLayerId, layerData: img_layer, type: "wmts" });
|
},
|
getGeoLayerChangeAlpha(res) {
|
var std = [];
|
for (var i in this.geoLayer) {
|
if (this.geoLayer[i] != res.tab) {
|
std.push(this.geoLayer[i])
|
}
|
}
|
this.geoLayer = [];
|
this.geoLayer = std;
|
var imageLayers = window.Viewer.imageryLayers._layers;
|
for (var i in imageLayers) {
|
if (imageLayers[i].id == this.wmsLayerId) {
|
|
window.Viewer.imageryLayers.remove(imageLayers[i])
|
}
|
}
|
for (var i in this.layerList) {
|
if (this.layerList[i].id == this.wmsLayerId) {
|
this.layerList.splice(i, 1)
|
}
|
}
|
if (this.geoLayer.length > 0) {
|
this.addGeoServerMmsLayers(this.geoLayer, this.geoUrl)
|
}
|
this.setAddGeoWmsLayer(res);
|
for (var i in this.layerList) {
|
if (this.layerList[i].id == res.id) {
|
return {
|
id: i,
|
layer: this.layerList[i]
|
};
|
break;
|
}
|
}
|
},
|
getFeatureInfo(html) {
|
var start =
|
html.indexOf('<caption class="featureInfo">') +
|
'<caption class="featureInfo">'.length;
|
var end = html.indexOf("</caption>");
|
var tab = html.substr(start, end - start);
|
var std = html
|
.substr(
|
html.indexOf("<th>"),
|
html.lastIndexOf("</th>") - html.indexOf("<th>") + 5
|
)
|
.replaceAll(" ", "")
|
.replaceAll("\n", "")
|
.split("</th>");
|
var gindex = null;
|
for (var i = 0; i < std.length; i++) {
|
if (std[i].indexOf("gid") > -1) {
|
gindex = i;
|
break;
|
}
|
}
|
|
if (!gindex) return;
|
var str = html
|
.substr(
|
html.indexOf("<td>"),
|
html.lastIndexOf("</td>") - html.indexOf("<td>") + 5
|
)
|
.replaceAll(" ", "")
|
.replaceAll("\n", "")
|
.split("</td>");
|
var gid = parseInt(str[gindex].replaceAll("<td>", ""));
|
if (gid && tab) {
|
store.state.details = {
|
gid: gid,
|
tab: tab,
|
showDetails: true,
|
};
|
}
|
},
|
};
|
export default server;
|
