<template>
|
<div>
|
<div class="zymljm">
|
<!-- rightshowzy.zymlval 设置页传递过来的参数，判断资源目录按钮是否显示 -->
|
<div v-show="rightshowzy.zymlval">
|
<!-- 点击控制资源目录按钮图片的切换 -->
|
<el-button
|
@click="zymlisopen"
|
style="padding: 0; border: none; background-color: transparent"
|
>
|
<img
|
style="width: 0.4rem; height: 0.4rem"
|
src="../../../static/img/image/zyml1.png"
|
/>
|
</el-button>
|
</div>
|
<!-- 根据按钮显示/隐藏状态->资源目录树的显示/隐藏 -->
|
</div>
|
<div v-show="rightshowzy.zymlmenu" class="layerTree" ref="abc">
|
<!-- 点击返回 -->
|
<div class="menutop">
|
<div class="menuback" @click="menuclick">
|
<i class="el-icon-caret-left"></i>返回
|
</div>
|
<div class="menutitle">资源目录</div>
|
</div>
|
<!-- :default-checked-keys=arr当前json文件中已经选中的数据 -->
|
<el-card
|
class="box-card"
|
style="margin-top: 0.1rem; height: 94%; overflow: auto"
|
>
|
<el-tree
|
@check="check"
|
:data="treeData"
|
node-key="id"
|
:default-checked-keys="arr"
|
:render-after-expand="false"
|
:render-content="renderContent"
|
show-checkbox
|
ref="tree"
|
>
|
</el-tree>
|
</el-card>
|
</div>
|
</div>
|
</template>
|
<style scoped>
|
.funButton {
|
position: absolute;
|
top: 1.2rem;
|
right: 0.1rem;
|
}
|
.zymljm {
|
position: absolute;
|
top: 0.3rem;
|
right: 0.1rem;
|
}
|
.layerTree {
|
padding: 0.3rem 0.1rem;
|
position: absolute;
|
width: 100%;
|
height: 100%;
|
z-index: 2021;
|
/* overflow-y: auto;
|
overflow-x: hidden; */
|
background-color: white;
|
}
|
|
.layerTree::-webkit-scrollbar,
|
.box-card::-webkit-scrollbar {
|
/*滚动条整体样式*/
|
width: 8px;
|
/*高宽分别对应横竖滚动条的尺寸*/
|
height: 8px;
|
scrollbar-arrow-color: red;
|
}
|
|
.layerTree::-webkit-scrollbar-thumb,
|
.box-card::-webkit-scrollbar-thumb {
|
border-radius: 5px;
|
-webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
|
box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
|
background: rgba(218, 218, 218, 0.5);
|
scrollbar-arrow-color: red;
|
}
|
|
.layerTree::-webkit-scrollbar-track,
|
.box-card::-webkit-scrollbar-track {
|
-webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
|
box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
|
border-radius: 0;
|
background: rgba(218, 218, 218, 0.1);
|
}
|
</style>
|
|
<script>
|
import axios from "axios";
|
import common from "@/components/common";
|
|
let colorTool;
|
let projectTreeData = [];
|
|
//添加工程树数据
|
function addTreeData(data, layer) {
|
var d = {};
|
for (var key in data) {
|
d[key] = data[key];
|
}
|
d.item = layer;
|
projectTreeData.push(d);
|
}
|
|
//通过id获取指定元素
|
function _getTreeData(id) {
|
for (var i = 0; i < projectTreeData.length; i++) {
|
if (
|
projectTreeData[i].id === id ||
|
(projectTreeData[i].datatype === "entity" &&
|
projectTreeData[i].item &&
|
projectTreeData[i].item.entity &&
|
projectTreeData[i].item.entity.id === id) ||
|
(projectTreeData[i].datatype === "editEntity" &&
|
projectTreeData[i].item &&
|
projectTreeData[i].item[projectTreeData[i].type] &&
|
projectTreeData[i].item[projectTreeData[i].type].id === id)
|
) {
|
return projectTreeData[i];
|
}
|
}
|
}
|
|
//获取sg样式配置
|
async function getSGStyle(type, json, name) {
|
let de;
|
!colorTool && (colorTool = sgworld.Core.gradientColor());
|
function getSGColor(color) {
|
let _color = parseInt(color).toString(16);
|
if (_color.length === 2) {
|
_color = "0000" + _color;
|
} else if (_color.length === 4) {
|
_color = "00" + _color;
|
}
|
_color = "#" + _color.slice(4) + _color.slice(2, 4) + _color.slice(0, 2);
|
return _color;
|
}
|
await axios
|
.get(json)
|
.then(
|
(response) => {
|
let _data = response.data;
|
if (_data && typeof _data === "string") {
|
_data = JSON.parse(_data);
|
}
|
let style = _data.filter((item) => {
|
return item.LayerName === name;
|
});
|
if (type === "point") {
|
let data = style[0];
|
style = data.Point;
|
style.Line_Color = getSGColor(style.Line_Color);
|
style.Image_Color = getSGColor(style.Image_Color);
|
style.Text_Color = getSGColor(style.Text_Color);
|
style.Background_Color = getSGColor(style.Background_Color);
|
|
let color = colorTool.colorRgb(
|
defaultValue(style.Text_Color, "#ffffff")
|
);
|
let bgColor = colorTool.colorRgb(
|
defaultValue(style.Background_Color, "#010101")
|
);
|
de = {
|
label: {
|
text: {
|
defaultValue: defaultValue(
|
style.Text.match(/<Value>(\S*)<\/Value>/)[1],
|
style.Text.match(/<DefaultValue>(\S*)<\/DefaultValue>/)[1]
|
),
|
},
|
scaleMPP: { defaultValue: style.Scale },
|
fillColor: {
|
defaultValue: {
|
red: color[0] / 255,
|
green: color[1] / 255,
|
blue: color[2] / 255,
|
alpha: 1,
|
},
|
},
|
scaleByDistance: {
|
near: 0,
|
nearValue: 1,
|
far: 800000000,
|
farValue: 1,
|
},
|
minViewingHeight: { defaultValue: "0" },
|
font: { defaultValue: style.Text_Size },
|
family: { defaultValue: defaultValue(style.Font, "Arial") },
|
backgroundColor: {
|
defaultValue: {
|
red: bgColor[0] / 255,
|
green: bgColor[1] / 255,
|
blue: bgColor[2] / 255,
|
alpha: 1,
|
},
|
},
|
scale: defaultValue(style.TextScale, 1.5),
|
backgroundOpacity: { defaultValue: style.Background_Opacity },
|
italic: { defaultValue: style.Italic },
|
bold: { defaultValue: style.Bold },
|
limitGrowth: { defaultValue: "1" },
|
textRelativeToImage: { defaultValue: "0" },
|
showText: { defaultValue: "0" },
|
textAlignment: { defaultValue: "17" },
|
pixelOffset: new Cesium.Cartesian2(
|
defaultValue(style.offsetX, 0),
|
defaultValue(style.offsetY, style.Image_file ? -10 : 0)
|
),
|
outlineColor: Cesium.Color.fromCssColorString(
|
defaultValue(style.Line_Color, "#ffffff")
|
),
|
outlineWidth: defaultValue(style.outlineWidth, 2),
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
},
|
lineToGround: { defaultValue: style.Line_to_Ground },
|
lineToGroundLength: { defaultValue: style.Line_Length },
|
lineToGroundColor: {
|
defaultValue: { red: 1, green: 1, blue: 1, alpha: 1 },
|
},
|
altitudeMethod: 0,
|
altitudeOffset: { defaultValue: "0" },
|
clampToGround: defaultValue(style.clampToGround, true),
|
pointHeight: defaultValue(style.pointHeight, undefined),
|
minimumLevel: defaultValue(style.level_min, 0),
|
maximumLevel: defaultValue(style.level_max, 22),
|
position_x: data.position_x,
|
position_y: data.position_y,
|
position_z: data.position_z == 0 ? 10000 : data.position_z,
|
urls: data.Server,
|
layer: data.ServerName,
|
};
|
if (style.Line_Color) {
|
de.label && (de.label.style = Cesium.LabelStyle.FILL_AND_OUTLINE);
|
}
|
if (style.Image_file) {
|
de.billboard = {
|
image: style.Image_file,
|
scale: defaultValue(style.ImageScale, 1),
|
scaleMPP: { defaultValue: style.Scale },
|
scaleByDistance: {
|
near: 0,
|
nearValue: 1,
|
far: 800000000,
|
farValue: 1,
|
},
|
minViewingHeight: { defaultValue: "0" },
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
};
|
}
|
} else if (type === "polyline") {
|
console.log(data);
|
let data = style[0];
|
style = data.Line;
|
style.Line_Color = getSGColor(style.Line_Color);
|
if (style.Line_Width) {
|
if (style.Line_Width.length === 2) {
|
style.Line_Width /= 10;
|
} else if (style.Line_Width.length === 3) {
|
style.Line_Width /= 100;
|
}
|
}
|
let color = colorTool.colorRgb(
|
defaultValue(style.Line_Color, "#ff0000")
|
);
|
de = {
|
polyline: {
|
material: {
|
red: color[0] / 255,
|
green: color[1] / 255,
|
blue: color[2] / 255,
|
alpha: 1,
|
},
|
lineOpacity: parseInt(defaultValue(style.Line_Opacity, 1)),
|
width: parseInt(defaultValue(style.Line_Width, 4)),
|
near: style.Near,
|
far: style.Far,
|
clampToGround: defaultValue(style.clampToGround, true),
|
},
|
minimumLevel: defaultValue(style.level_min, 0),
|
maximumLevel: defaultValue(style.level_max, 22),
|
position_x: data.position_x,
|
position_y: data.position_y,
|
position_z: data.position_z == 0 ? 10000 : data.position_z,
|
urls: data.Server,
|
layer: data.ServerName,
|
};
|
} else if (type === "polygon") {
|
let data = style[0];
|
style = data.data;
|
|
style.fill = Cesium.Color.fromCssColorString(style.fill);
|
style.outlineColor = Cesium.Color.fromCssColorString(
|
style.outlineColor
|
);
|
de = {
|
polygon: {
|
outlineColor: {
|
defaultValue: style.outlineColor,
|
},
|
outlineWidth: style.outlineWidth,
|
fill: { defaultValue: style.fill.alpha },
|
extrudedHeight: style.extrudedHeight || 0,
|
height: style.height,
|
outline: style.outline,
|
material: {
|
defaultValue: style.fill,
|
},
|
clampToGround: !style.extrudedHeight ? true : false,
|
fromKml: true,
|
},
|
altitudeMethod: 2,
|
altitudeOffset: { defaultValue: "0" },
|
minimumLevel: defaultValue(style.level_min, 0),
|
maximumLevel: defaultValue(style.level_max, 22),
|
position_x: data.position_x,
|
position_y: data.position_y,
|
position_z: data.position_z == 0 ? 10000 : data.position_z,
|
urls: data.Server,
|
layer: data.ServerName,
|
};
|
}
|
},
|
(response) => {
|
console.log("获取样式配置失败！");
|
}
|
)
|
.catch(function (error) {
|
console.log(error);
|
});
|
return de;
|
}
|
|
function defaultValue(a, b) {
|
return a !== undefined ? a : b;
|
}
|
|
export default {
|
props: ["rightshowzy"],
|
data() {
|
return {
|
wholeNode: [],
|
alldisabled: [],
|
arr: [], //用来保存资源目录中默认选中的节点id
|
x: 0,
|
y: 0,
|
l: 0,
|
t: 0,
|
nx: 0,
|
ny: 0,
|
nl: 0,
|
nt: 0,
|
zymlimg: false,
|
iniselect: [],
|
SmartEarthToken: undefined,
|
treeData: [],
|
defaultSceneData: [
|
{
|
id: "image",
|
name: "影像",
|
checked: true,
|
icon: "./static/img/yx.png",
|
},
|
{
|
id: "terrain",
|
name: "地形",
|
checked: true,
|
icon: "./static/img/dx.png",
|
},
|
{
|
id: "jx_model",
|
name: "精细模型",
|
checked: false,
|
icon: "./static/img/jxmx.png",
|
},
|
{
|
id: "qx_model",
|
name: "倾斜模型",
|
checked: false,
|
icon: "./static/img/qxmx.png",
|
},
|
{
|
id: "dy_model",
|
name: "点云模型",
|
checked: false,
|
icon: "./static/img/dymx.png",
|
},
|
{
|
id: "bm",
|
name: "白膜",
|
checked: false,
|
icon: "./static/img/bm.png",
|
},
|
{
|
id: "bim",
|
name: "BIM模型",
|
checked: false,
|
icon: "./static/img/bim.png",
|
},
|
{
|
id: "swzj",
|
name: "三维注记",
|
checked: false,
|
icon: "./static/img/swzj.png",
|
},
|
{
|
id: "xzq",
|
name: "行政区界限",
|
checked: false,
|
icon: "./static/img/xzq.png",
|
},
|
],
|
};
|
},
|
mounted() {
|
window.ProjectTree = this.$refs.tree;
|
//获取token并请求加载图层数据
|
// common.getToken((token) => {
|
// this.SmartEarthToken = token;
|
// });
|
|
this.$nextTick(() => {
|
axios.get("./static/layers.json").then(
|
(response) => {
|
// 得到默认选中的数据的id
|
this.parseJson(response.data.children);
|
// 删除数组中第一个
|
this.alldisabled.shift();
|
// 获得子节点全部被禁用的children
|
this.tem(this.alldisabled);
|
// 遍历子节点全部禁用的数组，遍历整个树，给子节点全部被禁用的父节点添加disabled属性
|
for (var i = 0; i < this.wholeNode.length; i++) {
|
var a = this.getItem(response.data.children, this.wholeNode[i]);
|
a.disabled = true;
|
}
|
//场景配置
|
this.treeData = response.data && response.data.children;
|
},
|
(response) => {
|
console.log("获取场景配置失败！");
|
}
|
);
|
});
|
},
|
methods: {
|
menuclick() {
|
this.rightshowzy.zymlmenu = false;
|
},
|
zymlisopen() {
|
this.rightshowzy.zymlmenu = true;
|
},
|
// 递归遍历json，得到checked:true的数据的id，添加到arr中
|
parseJson(jsonObj) {
|
// 声明变量count，记录disabled存在的节点的全部数据
|
var count = 0;
|
for (var v in jsonObj) {
|
var element = jsonObj[v];
|
if (element.children == undefined || element.children.length == 0) {
|
if (element._children == undefined || element._children.length == 0) {
|
if (element.checked) {
|
this.arr.push(element.id);
|
}
|
if (element.urls == undefined || element.urls == "") {
|
element.disabled = true;
|
count++;
|
}
|
} else {
|
this.parseJson(element._children);
|
}
|
} else {
|
this.parseJson(element.children);
|
}
|
}
|
if (count !== 0) {
|
// 添加含有disabled属性的节点数组，
|
this.alldisabled.push(jsonObj);
|
}
|
},
|
|
tem(data) {
|
for (var i = 0; i < data.length; i++) {
|
var temdata = data[i];
|
var count = 0;
|
for (var j = 0; j < temdata.length; j++) {
|
if (temdata[j].disabled) {
|
count++;
|
}
|
}
|
if (temdata.length == count) {
|
this.wholeNode.push(data[i]);
|
}
|
}
|
},
|
|
// 遍历树，得到和children属性相同的节点
|
getItem(tree, children) {
|
var Deep, T, F;
|
for (F = tree.length; F; ) {
|
T = tree[--F];
|
if (children == T.children) return T;
|
if (T.children) {
|
Deep = this.getItem(T.children, children);
|
if (Deep) return Deep;
|
}
|
}
|
},
|
//
|
check(treeNode, data) {
|
let isCheck = data.checkedKeys.indexOf(treeNode.id) > -1;
|
this.setVisiable(treeNode, isCheck);
|
},
|
|
getLayerData(token) {
|
axios({
|
headers: {
|
"Content-Type": "application/json",
|
Authorization: "Bearer " + token,
|
},
|
method: "get",
|
url: common.serverUrl + "/system/user/getfrontdata",
|
}).then(
|
(response) => {
|
console.log(response.data);
|
//获取场景配置
|
this.getSceneConfig(response.data);
|
},
|
(response) => {
|
console.log("error");
|
}
|
);
|
},
|
getSceneConfig(data) {
|
//获取场景配置
|
if (data && data.length) {
|
let sceneConfig = this.defaultSceneData;
|
let configIndex = {};
|
let config;
|
sceneConfig.forEach((item, index) => {
|
configIndex[item.name] = index;
|
});
|
data.forEach((item) => {
|
let _index = configIndex[item.alias];
|
if (
|
item.datatype === "地形" &&
|
item.datasource === "SmartearthServer"
|
) {
|
let url, split;
|
if (item.serverurl.indexOf("Elevation/") > -1) {
|
url = item.serverurl.split("Elevation/");
|
split = "Elevation";
|
} else if (item.serverurl.indexOf("MptElevation.ashx/") > -1) {
|
url = item.serverurl.split("MptElevation.ashx/");
|
split = "MptElevation.ashx";
|
}
|
config = this.getConfigTemplate("sgs-terrain", {
|
name: item.name,
|
url: url[0] + split,
|
layer: url[1],
|
});
|
} else if (
|
item.datatype === "影像" &&
|
item.datasource === "SmartearthServer"
|
) {
|
let url = item.serverurl.split("Imagery/");
|
config = this.getConfigTemplate("wms", {
|
name: item.name,
|
url: url[0] + "Imagery",
|
layer: url[1],
|
});
|
} else if (item.datatype === "模型") {
|
config = this.getConfigTemplate("3dtiles", {
|
checked: false,
|
name: item.name,
|
url: item.serverurl,
|
});
|
} else if (
|
item.datatype === "矢量" &&
|
item.datasource === "SmartearthServer"
|
) {
|
let url;
|
if (item.serverurl.indexOf("streamer.ashx/") > -1) {
|
url = item.serverurl.split("streamer.ashx/");
|
} else {
|
url = item.serverurl.split("Streamer.ashx/");
|
}
|
if (item.alias === "三维注记") {
|
config = this.getConfigTemplate("wfs", {
|
class: "pointLayer",
|
checked: false,
|
name: item.name,
|
url: url[0] + "streamer.ashx",
|
layer: url[1],
|
});
|
} else if (item.alias === "行政区界限") {
|
config = this.getConfigTemplate("wfs", {
|
class: "polylineLayer",
|
checked: false,
|
name: item.name,
|
url: url[0] + "streamer.ashx",
|
layer: url[1],
|
});
|
}
|
}
|
if (item.name === item.alias) {
|
sceneConfig[_index] = Object.assign(config, sceneConfig[_index]);
|
} else {
|
!sceneConfig[_index].children &&
|
(sceneConfig[_index].children = []);
|
config.id =
|
sceneConfig[_index].id +
|
(sceneConfig[_index].children.length + 1);
|
sceneConfig[_index].children.push(config);
|
}
|
});
|
this.treeData = sceneConfig;
|
}
|
},
|
|
getConfigTemplate(type, option) {
|
let data = {};
|
!option && (option = {});
|
if (type === "wms") {
|
data = {
|
id: option.id,
|
class: "imageLayer",
|
name: option.name,
|
sourceType: "wms",
|
checked: defaultValue(option.checked, true),
|
urls: option.url,
|
layer: option.layer,
|
lon: option.lon,
|
lat: option.lat,
|
height: option.height,
|
icon: "./static/img/yx.png",
|
};
|
} else if (type === "sgs-terrain") {
|
data = {
|
id: option.id,
|
class: "terrainLayer",
|
name: option.name,
|
sourceType: "sgsterrain",
|
checked: defaultValue(option.checked, true),
|
urls: option.url,
|
layer: option.layer,
|
};
|
} else if (type === "terrain") {
|
data = {
|
id: option.id,
|
class: "terrainLayer",
|
name: option.name,
|
sourceType: "terrain",
|
checked: defaultValue(option.checked, true),
|
urls: option.url,
|
};
|
} else if (type === "3dtiles") {
|
data = {
|
id: option.id,
|
class: "modelLayer",
|
name: option.name,
|
sourceType: "b3dm",
|
maximumScreenSpaceError: 100,
|
checked: defaultValue(option.checked, false),
|
urls: option.url,
|
};
|
} else if (type === "wfs") {
|
data = {
|
id: option.id,
|
class: option.class,
|
name: option.name,
|
sourceType: "wfs",
|
checked: defaultValue(option.checked, false),
|
urls: option.url,
|
layer: option.layer,
|
sgStyleJSON: "./static/shpstyle.json",
|
minimumLevel: option.minimumLevel,
|
maximumLevel: option.maximumLevel,
|
};
|
}
|
return data;
|
},
|
|
setVisiable(treeNode, checked) {
|
if (checked !== undefined) {
|
treeNode.checked = checked;
|
} else {
|
treeNode.checked = !treeNode.checked;
|
}
|
if (treeNode.children) {
|
treeNode.children.forEach((item) => {
|
this.setVisiable(item, treeNode.checked);
|
});
|
return;
|
} else if (treeNode._children) {
|
if (treeNode.thisView === "ewzj") {
|
treeNode._children[0].checked = treeNode.checked;
|
if (treeNode._children[0].children) {
|
treeNode._children[0].children.forEach((item) => {
|
item.checked = treeNode.checked;
|
this.addTreeData(item);
|
});
|
} else {
|
this.addTreeData(treeNode._children[0]);
|
}
|
} else if (treeNode.thisView === "swzj") {
|
for (let i = 1; i < treeNode._children.length; i++) {
|
treeNode._children[i].checked = treeNode.checked;
|
}
|
treeNode._children.forEach((item, index) => {
|
index !== 0 && this.addTreeData(item);
|
});
|
} else if (!treeNode.thisView) {
|
treeNode._children.forEach((item, index) => {
|
item.checked = treeNode.checked;
|
if (item.children) {
|
item.children.forEach((_item) => {
|
_item.checked = item.checked;
|
this.addTreeData(_item);
|
});
|
} else {
|
this.addTreeData(item);
|
}
|
});
|
}
|
return;
|
}
|
|
if (!treeNode.isAdd) {
|
this.addTreeData(treeNode);
|
return;
|
}
|
|
let data = _getTreeData(treeNode.id);
|
if (data) {
|
data.item &&
|
data.item.setVisibility &&
|
data.item.setVisibility(treeNode.checked);
|
data.item &&
|
data.item.setVisible &&
|
data.item.setVisible(treeNode.checked);
|
data.item &&
|
data.item.show !== undefined &&
|
(data.item.show = treeNode.checked);
|
if (data.datatype === "particle") {
|
data.item.forEach((item) => {
|
item.show = treeNode.checked;
|
});
|
}
|
} else {
|
if (
|
treeNode.id &&
|
treeNode.id.indexOf &&
|
treeNode.id.indexOf("---") > -1
|
) {
|
var ids = id.split("---");
|
ids.forEach((item) => {
|
sgworld.ProjectTree.setVisibility(item, treeNode.checked);
|
});
|
} else {
|
sgworld.ProjectTree.setVisibility(treeNode.id, treeNode.checked);
|
}
|
}
|
},
|
props(data) {
|
if (data.class === "imageLayer") {
|
window.treeObj = {
|
rightClickData: data,
|
};
|
layerOpen("影像", {
|
width: 320,
|
height: 310,
|
url: "./static/html/layerProp.html",
|
fn: {
|
end: function () {},
|
},
|
});
|
} else if (data._children) {
|
if (data.thisView === "ewzj") {
|
data.thisView = "swzj";
|
data.name = "三维注记";
|
data._children[0].checked = false;
|
for (let i = 1; i < data._children.length; i++) {
|
data._children[i].checked = data.checked;
|
}
|
data._children.forEach((item) => {
|
if (item.children) {
|
item.children.forEach((_item) => {
|
_item.checked = item.checked;
|
this.addTreeData(_item);
|
});
|
} else {
|
this.addTreeData(item);
|
}
|
});
|
} else if (data.thisView === "swzj") {
|
data.thisView = "ewzj";
|
data.name = "二维注记";
|
data._children[0].checked = data.checked;
|
for (let i = 1; i < data._children.length; i++) {
|
data._children[i].checked = false;
|
}
|
data._children.forEach((item) => {
|
if (item.children) {
|
item.children.forEach((_item) => {
|
_item.checked = item.checked;
|
this.addTreeData(_item);
|
});
|
} else {
|
this.addTreeData(item);
|
}
|
});
|
}
|
}
|
},
|
flyTo(treeNode) {
|
//
|
if (treeNode.children) return;
|
if (treeNode._children && treeNode._children[0]) {
|
this.flyTo(treeNode._children[0]);
|
return;
|
}
|
this.rightshowzy.zymlmenu = false;
|
if (treeNode && treeNode.flyTo) {
|
if (treeNode && treeNode.flyTo.length === 3) {
|
sgworld.Navigate.flyToPosition(
|
treeNode.flyTo[0],
|
treeNode.flyTo[1],
|
treeNode.flyTo[2]
|
);
|
} else if (treeNode && treeNode.flyTo.length === 4) {
|
sgworld.Navigate.flyToPointsInterest({
|
destination: Cesium.Rectangle.fromDegrees(
|
treeNode.flyTo[0],
|
treeNode.flyTo[1],
|
treeNode.flyTo[2],
|
treeNode.flyTo[3]
|
),
|
});
|
} else {
|
sgworld.Navigate.flyToPointsInterest({
|
destination: Cesium.Cartesian3.fromDegrees(
|
treeNode.flyTo[0],
|
treeNode.flyTo[1],
|
treeNode.flyTo[2]
|
),
|
orientation: {
|
heading: treeNode.flyTo[3],
|
pitch: treeNode.flyTo[4],
|
roll: treeNode.flyTo[5],
|
},
|
});
|
}
|
return;
|
}
|
let data = sgworld.ProjectTree.getObject(treeNode.id);
|
data && data.item
|
? sgworld.Navigate.flyToObj(data.item)
|
: sgworld.Navigate.flyToObj(data);
|
if (data && data.datatype === "editEntity") {
|
data && data.item && sgworld.Navigate.flyToObj(data.item[data.type]);
|
}
|
},
|
renderContent(h, { node, data, store }) {
|
if (!data.children && data.checked && !data.isAdd) {
|
if (data._children) {
|
if (data.thisView) {
|
this.addTreeData(data._children[0]);
|
} else {
|
data._children.forEach((item) => {
|
this.addTreeData(item);
|
});
|
}
|
} else {
|
this.addTreeData(data);
|
}
|
}
|
if (data.checked) {
|
data.eyeIcon = "./static/img/yj.png";
|
} else {
|
data.eyeIcon = "./static/img/yj-y.png";
|
}
|
if (data.icon) {
|
return (
|
// <span class="custom-tree-node" on-dblclick={() => this.flyTo(data)}>
|
// <span class="typeIcon">
|
// <img src={data.icon} />
|
// </span>
|
// <span class="treeName">{data.name}</span>
|
// <span class="customButton">
|
// <el-button size="mini" on-click={() => this.setVisiable(data)}>
|
// <img src={data.eyeIcon} />
|
// </el-button>
|
// <el-button size="mini" on-click={() => this.props(data)}>
|
// <img src="./static/img/006_07.png" />
|
// </el-button>
|
// </span>
|
// </span>
|
<span class="custom-tree-node" on-dblclick={() => this.flyTo(data)}>
|
<span class="typeIcon">
|
<img style="width:0.14rem;height:0.14rem" src={data.icon} />
|
</span>
|
<span class="treeName">{data.name}</span>
|
</span>
|
);
|
} else {
|
return (
|
// <span class="custom-tree-node" on-dblclick={() => this.flyTo(data)}>
|
// <span class="typeNullIcon"></span>
|
// <span class="treeName">{data.name}</span>
|
// <span class="customButton">
|
// <el-button size="mini" on-click={() => this.setVisiable(data)}>
|
// <img src={data.eyeIcon} />
|
// </el-button>
|
// <el-button size="mini" on-click={() => this.heightLing(node, data)}>
|
// <img src="./static/img/006_07.png" />
|
// </el-button>
|
// </span>
|
// </span>
|
<span class="custom-tree-node" on-dblclick={() => this.flyTo(data)}>
|
<span class="treeName">{data.name}</span>
|
</span>
|
);
|
}
|
},
|
async addTreeData(treeNode) {
|
let _data = sgworld.ProjectTree.getObject(treeNode.id);
|
let pID = 0;
|
|
if (_data) {
|
sgworld.ProjectTree.setVisibility(treeNode.id, treeNode.checked);
|
return;
|
} else {
|
_data = _getTreeData(treeNode.id);
|
if (_data) {
|
_data.item &&
|
_data.item.setVisibility &&
|
_data.item.setVisibility(treeNode.checked);
|
_data.item &&
|
_data.item.setVisible &&
|
_data.item.setVisible(treeNode.checked);
|
_data.item &&
|
_data.item.show !== undefined &&
|
(_data.item.show = treeNode.checked);
|
if (_data.datatype === "particle") {
|
_data.item.forEach((item) => {
|
item.show = treeNode.checked;
|
});
|
}
|
return;
|
}
|
}
|
if (!treeNode.urls || treeNode.isAdd) return;
|
treeNode.isAdd = true;
|
|
let layer;
|
treeNode.token &&
|
treeNode.token === "SmartEarthToken" &&
|
(treeNode.token = this.SmartEarthToken);
|
switch (treeNode.sourceType) {
|
case "local-map":
|
//添加本地json地图
|
layer = sgworld.Creator.createUrlTemplateImageryProvider(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls + "/{z}/{x}/{y}.png",
|
enablePickFeatures: false,
|
level: treeNode.Level,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
break;
|
case "kml":
|
//添加kml
|
layer = sgworld.Creator.addKmlLayer(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
},
|
treeNode.checked
|
);
|
break;
|
case "google":
|
//添加谷歌地图
|
layer = sgworld.Creator.createUrlTemplateImageryProvider(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
enablePickFeatures: false,
|
level: treeNode.Level,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "arcgis":
|
layer = sgworld.Creator.createArcGisImageryLayer(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
enablePickFeatures: false,
|
level: treeNode.Level,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "mapbox":
|
Cesium.MapboxApi.defaultAccessToken =
|
"pk.eyJ1IjoibWFyc2dpcyIsImEiOiJja2Fod2xlanIwNjJzMnhvMXBkMnNqcjVpIn0.WnxikCaN2KV_zn9tLZO77A";
|
layer = sgworld.Creator.createImageryProvider(
|
treeNode.name,
|
"MapBox",
|
{
|
id: treeNode.id,
|
name: treeNode.name,
|
level: treeNode.Level,
|
enablePickFeatures: false,
|
mapId: treeNode.mapId,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "tdmap":
|
layer = sgworld.Creator.createWebMapTileServerImageLayer(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
level: treeNode.Level,
|
style: treeNode.style,
|
layer: treeNode.layer,
|
format: treeNode.format,
|
enablePickFeatures: false,
|
tileMatrixSetID: "tiff",
|
show: true,
|
subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "txmap":
|
layer = sgworld.Creator.createUrlTemplateImageryProvider(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
level: treeNode.Level,
|
enablePickFeatures: false,
|
customTags: {
|
sx: function (imageryProvider, x, y, level) {
|
return x >> 4;
|
},
|
sy: function (imageryProvider, x, y, level) {
|
return ((1 << level) - y) >> 4;
|
},
|
},
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "gdmap":
|
layer = sgworld.Creator.createUrlTemplateImageryProvider(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
enablePickFeatures: false,
|
level: treeNode.Level,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "bdmap":
|
layer = sgworld.Creator.createImageryProvider(
|
treeNode.name,
|
"BaiduMap",
|
{
|
id: treeNode.id,
|
level: treeNode.Level,
|
enablePickFeatures: false,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "cesiumblack":
|
layer = sgworld.Creator.createImageryProvider(
|
treeNode.name,
|
"cesiumBlack",
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
credit: "Black Marble imagery courtesy NASA Earth Observatory",
|
flipXY: true,
|
enablePickFeatures: false,
|
level: treeNode.Level,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "osm":
|
layer = sgworld.Creator.createImageryProvider(
|
treeNode.name,
|
"OpenStreetMap",
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
enablePickFeatures: false,
|
level: treeNode.Level,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "wmts":
|
layer = sgworld.Creator.createWebMapTileServerImageLayer(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
level: treeNode.Level,
|
style: treeNode.style,
|
layer: treeNode.layer,
|
enablePickFeatures: false,
|
format: treeNode.format,
|
show: true,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "gis_wmts":
|
layer = sgworld.Creator.createUrlTemplateImageryProvider(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: Cesium.buildModuleUrl(
|
treeNode.urls + "/{z}/{x}/{reverseY}.png"
|
),
|
enablePickFeatures: false,
|
level: treeNode.Level,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "wmts_zj":
|
//行列号差两倍
|
var geotil = new Cesium.GeographicTilingScheme({
|
rectangle: Cesium.Rectangle.MAX_VALUE,
|
});
|
if (treeNode.addLevel && treeNode.addLevel === 2) {
|
geotil.positionToTileXY = function (position, level, result) {
|
level > 0 && level++;
|
var rectangle = this._rectangle;
|
if (!Cesium.Rectangle.contains(rectangle, position)) {
|
// outside the bounds of the tiling scheme
|
return undefined;
|
}
|
|
var xTiles = this.getNumberOfXTilesAtLevel(level);
|
var yTiles = this.getNumberOfYTilesAtLevel(level);
|
|
var xTileWidth = rectangle.width / xTiles;
|
var yTileHeight = rectangle.height / yTiles;
|
|
var longitude = position.longitude;
|
if (rectangle.east < rectangle.west) {
|
longitude += Cesium.Math.TWO_PI;
|
}
|
|
var xTileCoordinate =
|
((longitude - rectangle.west) / xTileWidth) | 0;
|
if (xTileCoordinate >= xTiles) {
|
xTileCoordinate = xTiles - 1;
|
}
|
|
var yTileCoordinate =
|
((rectangle.north - position.latitude) / yTileHeight) | 0;
|
if (yTileCoordinate >= yTiles) {
|
yTileCoordinate = yTiles - 1;
|
}
|
|
if (!Cesium.defined(result)) {
|
return new Cesium.Cartesian2(xTileCoordinate, yTileCoordinate);
|
}
|
|
result.x = xTileCoordinate;
|
result.y = yTileCoordinate;
|
return result;
|
};
|
geotil.tileXYToRectangle = function (x, y, level, result) {
|
level > 0 && level++;
|
var rectangle = this._rectangle;
|
|
var xTiles = this.getNumberOfXTilesAtLevel(level);
|
var yTiles = this.getNumberOfYTilesAtLevel(level);
|
|
var xTileWidth = rectangle.width / xTiles;
|
var west = x * xTileWidth + rectangle.west;
|
var east = (x + 1) * xTileWidth + rectangle.west;
|
|
var yTileHeight = rectangle.height / yTiles;
|
var north = rectangle.north - y * yTileHeight;
|
var south = rectangle.north - (y + 1) * yTileHeight;
|
|
if (!Cesium.defined(result)) {
|
result = new Cesium.Rectangle(west, south, east, north);
|
}
|
|
result.west = west;
|
result.south = south;
|
result.east = east;
|
result.north = north;
|
return result;
|
};
|
}
|
|
layer = sgworld.Creator.createWebMapTileServerImageLayer(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
layer: treeNode.layer,
|
level: treeNode.Level,
|
style: "default",
|
tileMatrixSetID: "esritilematirx",
|
format: "image/png",
|
tilingScheme: geotil,
|
addLevel: treeNode.addLevel || 1, //层级加一
|
enablePickFeatures: false,
|
show: true,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "wms":
|
var parameters = {
|
service: "WMS",
|
format: "image/png",
|
transparent: true,
|
};
|
if (treeNode.removeNullValue) {
|
if (treeNode.nullvalue) {
|
treeNode.nullvalue = treeNode.nullvalue.replace("rgb(", "");
|
treeNode.nullvalue = treeNode.nullvalue.replace(")", "");
|
}
|
parameters.nullvalue = defaultValue(treeNode.nullvalue, "0,0,0");
|
parameters.nulltolerance = defaultValue(treeNode.nulltolerance, 0);
|
}
|
treeNode.token && (treeNode.urls += "?token=" + treeNode.token);
|
layer = sgworld.Creator.createImageryProvider(
|
treeNode.name,
|
"wms",
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
layers: treeNode.layer,
|
level: treeNode.Level,
|
enablePickFeatures: false,
|
parameters: parameters,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
layer.item.alpha = defaultValue(treeNode.alpha, 1);
|
treeNode.id = layer.treeobj.id;
|
|
break;
|
case "wmsc":
|
var parameters = {
|
service: "WMS",
|
format: "image/png",
|
transparent: true,
|
};
|
if (treeNode.removeNullValue) {
|
if (treeNode.nullvalue) {
|
treeNode.nullvalue = treeNode.nullvalue.replace("rgb(", "");
|
treeNode.nullvalue = treeNode.nullvalue.replace(")", "");
|
}
|
parameters.nullvalue = defaultValue(treeNode.nullvalue, "0,0,0");
|
parameters.nulltolerance = defaultValue(treeNode.nulltolerance, 0);
|
}
|
treeNode.token && (treeNode.urls += "?token=" + treeNode.token);
|
layer = sgworld.Creator.createCacheImageryProvider(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
layers: treeNode.layer,
|
level: treeNode.Level,
|
enablePickFeatures: false,
|
cacheUrl: treeNode.cacheUrl,
|
cacheMaxLevel: 16,
|
},
|
pID,
|
undefined,
|
treeNode.checked,
|
""
|
);
|
layer.item.alpha = defaultValue(treeNode.alpha, 1);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "wfs":
|
var de = {};
|
var color;
|
if (treeNode.class === "pointLayer") {
|
if (!treeNode.sgStyleJSON) {
|
color = colorTool.colorRgb(
|
defaultValue(treeNode.color, "#ffffff")
|
);
|
var bgColor = colorTool.colorRgb(
|
defaultValue(treeNode.bgColor, "#010101")
|
);
|
if (treeNode.text) {
|
de = {
|
label: {
|
text: {
|
defaultValue: defaultValue(treeNode.text, "标签"),
|
},
|
scaleMPP: {
|
defaultValue: "15000",
|
},
|
fillColor: {
|
defaultValue: {
|
red: color[0] / 255,
|
green: color[1] / 255,
|
blue: color[2] / 255,
|
alpha: 1,
|
},
|
},
|
scaleByDistance: {
|
near: 150,
|
nearValue: 1,
|
far: 800000,
|
farValue: 0.5,
|
},
|
minViewingHeight: {
|
defaultValue: "0",
|
},
|
font: {
|
defaultValue: "12",
|
},
|
family: {
|
defaultValue: defaultValue(treeNode.font, "Arial"),
|
},
|
backgroundColor: {
|
defaultValue: {
|
red: bgColor[0] / 255,
|
green: bgColor[1] / 255,
|
blue: bgColor[2] / 255,
|
alpha: 1,
|
},
|
},
|
scale: defaultValue(treeNode.scale, 2),
|
backgroundOpacity: {
|
defaultValue: treeNode.bgColor ? "0.5" : "0",
|
},
|
italic: {
|
defaultValue: treeNode.italic ? "1" : "0",
|
},
|
bold: {
|
defaultValue: treeNode.bold ? "1" : "0",
|
},
|
limitGrowth: {
|
defaultValue: "1",
|
},
|
textRelativeToImage: {
|
defaultValue: "0",
|
},
|
showText: {
|
defaultValue: "0",
|
},
|
textAlignment: {
|
defaultValue: "17",
|
},
|
pixelOffset: new Cesium.Cartesian2(
|
defaultValue(treeNode.offsetX, 0),
|
defaultValue(treeNode.offsetY, treeNode.image ? -10 : 0)
|
),
|
outlineColor: Cesium.Color.fromCssColorString(
|
defaultValue(treeNode.outlineColor, "#ffffff")
|
),
|
outlineWidth: defaultValue(treeNode.outlineWidth, 2),
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
},
|
lineToGround: {
|
defaultValue: "0",
|
},
|
lineToGroundLength: {
|
defaultValue: "0",
|
},
|
lineToGroundColor: {
|
defaultValue: {
|
red: 1,
|
green: 1,
|
blue: 1,
|
alpha: 1,
|
},
|
},
|
altitudeMethod: 0,
|
altitudeOffset: {
|
defaultValue: "0",
|
},
|
clampToGround: defaultValue(treeNode.clampToGround, false),
|
//"pointHeight": 100
|
};
|
}
|
if (treeNode.outlineColor) {
|
de.label &&
|
(de.label.style = Cesium.LabelStyle.FILL_AND_OUTLINE);
|
}
|
if (treeNode.image) {
|
de.billboard = {
|
image: treeNode.image,
|
scale: defaultValue(treeNode.imageScale, 1),
|
link: treeNode.link,
|
};
|
}
|
} else {
|
de = await getSGStyle(
|
"point",
|
treeNode.sgStyleJSON,
|
treeNode.name
|
);
|
}
|
} else if (treeNode.class === "polylineLayer") {
|
if (!treeNode.sgStyleJSON) {
|
color = colorTool.colorRgb(
|
defaultValue(treeNode.color, "#ffff00")
|
);
|
de = {
|
polyline: {
|
material: {
|
red: color[0] / 255,
|
green: color[1] / 255,
|
blue: color[2] / 255,
|
alpha: 1,
|
},
|
lineOpacity: defaultValue(treeNode.alpha, 1),
|
width: defaultValue(treeNode.width, 4),
|
clampToGround: defaultValue(treeNode.clampToGround, true),
|
},
|
};
|
} else {
|
de = await getSGStyle(
|
"polyline",
|
treeNode.sgStyleJSON,
|
treeNode.name
|
);
|
}
|
} else if (treeNode.class === "polygonLayer") {
|
if (!treeNode.sgStyleJSON) {
|
color = colorTool.colorRgb(
|
defaultValue(treeNode.color, "#6bbeef")
|
);
|
de = {
|
polygon: {
|
outlineColor: {
|
defaultValue: {
|
red: 1,
|
green: 1,
|
blue: 0,
|
alpha: 1,
|
},
|
},
|
outlineWidth: 1,
|
fill: {
|
defaultValue: defaultValue(treeNode.alpha, 1),
|
},
|
extrudedHeight: treeNode.extrudedHeight || 0,
|
clampToGround: !treeNode.extrudedHeight ? true : false,
|
outline: true,
|
material: {
|
defaultValue: {
|
red: color[0] / 255,
|
green: color[1] / 255,
|
blue: color[2] / 255,
|
alpha: defaultValue(treeNode.alpha, 1),
|
},
|
},
|
fromKml: true,
|
},
|
altitudeMethod: 2,
|
altitudeOffset: {
|
defaultValue: "0",
|
},
|
};
|
} else {
|
de = await getSGStyle(
|
"polygon",
|
treeNode.sgStyleJSON,
|
treeNode.name
|
);
|
}
|
}
|
if (!de && treeNode.sgStyleJSON) {
|
console.log(treeNode.name + "获取样式失败！");
|
return;
|
}
|
if (de.position_x) {
|
treeNode.lon = de.position_x;
|
treeNode.lat = de.position_y;
|
treeNode.height = de.position_z;
|
}
|
layer = sgworld.CreateWfs(
|
Viewer,
|
defaultValue(treeNode.urls, de.urls),
|
defaultValue(treeNode.layer, de.layer),
|
{
|
min: defaultValue(treeNode.minimumLevel, de.minimumLevel || 0),
|
max: defaultValue(treeNode.maximumLevel, de.maximumLevel || 22),
|
},
|
de,
|
defaultValue(treeNode.layer, de.layer),
|
pID,
|
treeNode.checked,
|
undefined
|
);
|
break;
|
case "gis_mvt":
|
var geoOptions = {
|
id: treeNode.id,
|
url: treeNode.urls,
|
layer: treeNode.layer,
|
upperLevelLimit: treeNode.maximumLevel,
|
lowerLevelLimit: treeNode.minimumLevel,
|
minx: treeNode.minx,
|
miny: treeNode.miny,
|
maxx: treeNode.maxx,
|
maxy: treeNode.maxy,
|
};
|
var data;
|
if (treeNode.class === "pointLayer") {
|
data = {
|
level_min: defaultValue(treeNode.minimumLevel, 0),
|
level_max: defaultValue(treeNode.maximumLevel, 22),
|
};
|
if (treeNode.text) {
|
data.lable = {
|
text: treeNode.text,
|
font: " 20px sans-serif",
|
pixelOffset: new Cesium.Cartesian2(
|
defaultValue(treeNode.offsetX, 40),
|
defaultValue(treeNode.offsetY, -20)
|
),
|
fillColor: defaultValue(treeNode.color, "#ffff00"),
|
scale: defaultValue(treeNode.scale, 1),
|
near: defaultValue(treeNode.near, 0),
|
far: defaultValue(treeNode.far, 99999999999999),
|
};
|
}
|
if (treeNode.image) {
|
data.billboard = {
|
image: treeNode.image,
|
scale: defaultValue(treeNode.scale, 1),
|
near: defaultValue(treeNode.near, 0),
|
far: defaultValue(treeNode.far, 99999999999999),
|
};
|
}
|
layer = sgworld.Creator.PointVectorGeoJsonFeatureLayerGis(
|
treeNode.name,
|
geoOptions,
|
data,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
} else if (treeNode.class === "polylineLayer") {
|
data = {
|
level_min: defaultValue(treeNode.minimumLevel, 0),
|
level_max: defaultValue(treeNode.maximumLevel, 22),
|
near: defaultValue(treeNode.near, 0),
|
far: defaultValue(treeNode.far, 99999999999999),
|
material: defaultValue(treeNode.color, "#ff0000"),
|
width: defaultValue(treeNode.width, 2),
|
classificationType: -1,
|
};
|
layer = sgworld.Creator.PolylineVectorGeoJsonFeatureLayerGis(
|
treeNode.name,
|
geoOptions,
|
data,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
} else if (treeNode.class === "polygonLayer") {
|
data = {
|
effect: 0,
|
extrudedHeightReference: 1,
|
far: 9999999999999,
|
fill: "rgba(255, 0, 0, 1)",
|
ground: 1,
|
height: 1,
|
extrudedHeight: treeNode.extrudedHeight,
|
layertype: "polygonbase",
|
level_min: defaultValue(treeNode.minimumLevel, 0),
|
level_max: defaultValue(treeNode.maximumLevel, 22),
|
material: defaultValue(treeNode.color, "#ff0000"),
|
near: 0,
|
outline: false,
|
outlineColor: "rgba(68,66,66,0.5)",
|
outlineWidth: 1,
|
};
|
layer = sgworld.Creator.createGeoJsonFeatureLayerProviderGisOptimization(
|
treeNode.name,
|
geoOptions,
|
data,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
}
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "geojson":
|
var de = {};
|
if (treeNode.class === "polylineVolume") {
|
de = {
|
id: treeNode.id,
|
material: defaultValue(treeNode.color, "#ff0000"),
|
slttype: "0",
|
number: "4",
|
exradius: "1",
|
inradius: "1",
|
orth_width: "2",
|
orth_height: "2",
|
radius: defaultValue(treeNode.radius, 5),
|
cornerType: "0",
|
heightReference: "0",
|
height: defaultValue(treeNode.lineHeight, 0),
|
near: "0",
|
far: "99999999999",
|
radiusScale: treeNode.radiusScale,
|
connect: true,
|
};
|
layer = sgworld.Creator.createpolylineVolumeGeojsonPrimitiveLayer(
|
treeNode.name,
|
treeNode.urls,
|
de,
|
pID,
|
treeNode.checked,
|
function (data) {}
|
);
|
} else if (treeNode.class === "model") {
|
de = {
|
id: treeNode.id,
|
collect: 0,
|
uri: defaultValue(treeNode.model, ""),
|
file: "",
|
color: defaultValue(treeNode.color, "#ffffff"),
|
scale: defaultValue(treeNode.scale, 1),
|
heightReference: 0,
|
height: defaultValue(treeNode.height, 0),
|
near: "0",
|
far: "99999999999",
|
};
|
layer = sgworld.Creator.createModelPointGeoJsonFeatureLayer(
|
treeNode.name,
|
treeNode.urls,
|
de,
|
pID,
|
treeNode.checked,
|
function (data) {}
|
);
|
} else if (treeNode.class === "polygon") {
|
de = {
|
id: treeNode.id,
|
collect: 0,
|
material: defaultValue(treeNode.color, "#ff0000"),
|
heightReference: 1,
|
height: defaultValue(treeNode.height, undefined),
|
classificationType: "0",
|
outline: defaultValue(treeNode.outline, false),
|
outlineColor: defaultValue(treeNode.outlineColor, "#ffff00"),
|
near: defaultValue(treeNode.near, 0),
|
far: defaultValue(treeNode.far, 999999),
|
};
|
layer = sgworld.Creator.createPolygonGeoJsonFeatureLayer(
|
treeNode.name,
|
treeNode.urls,
|
de,
|
pID,
|
treeNode.checked,
|
function (data) {}
|
);
|
}
|
layer && (treeNode.id = layer.treeobj.id);
|
break;
|
case "vector":
|
var de = {};
|
let urls = {
|
url: treeNode.urls,
|
layer: treeNode.layer,
|
minx: treeNode.minx,
|
miny: treeNode.miny,
|
maxx: treeNode.maxx,
|
maxy: treeNode.maxy,
|
srs: treeNode.srs,
|
};
|
if (treeNode.class === "label" || treeNode.class === "image") {
|
treeNode.disableDepthTestDistance === "Infinity" &&
|
(treeNode.disableDepthTestDistance = Number.POSITIVE_INFINITY);
|
de = {
|
id: treeNode.id,
|
level_min: defaultValue(treeNode.minimumLevel, 10),
|
level_max: defaultValue(treeNode.maximumLevel, 22),
|
fillColor: defaultValue(treeNode.color, "#ffffff"),
|
color: defaultValue(treeNode.imageColor, undefined),
|
outlineColor: defaultValue(treeNode.outlineColor, "#ffffff"),
|
backgroundColor: defaultValue(
|
treeNode.backgroundColor,
|
"#ffffff"
|
),
|
heightReference: defaultValue(treeNode.heightReference, 0),
|
pointHeight: defaultValue(treeNode.pointHeight, undefined),
|
near: defaultValue(treeNode.near, 0),
|
far: defaultValue(treeNode.far, 1000000),
|
showBackground: treeNode.showBackground,
|
outlineWidth: defaultValue(treeNode.outlineWidth, 1),
|
text: treeNode.text,
|
image: treeNode.image,
|
font_size: treeNode.size,
|
font_family: defaultValue(treeNode.font_family, "微软雅黑"),
|
disableDepthTestDistance: defaultValue(
|
treeNode.disableDepthTestDistance,
|
undefined
|
),
|
labelData: treeNode.labelData,
|
imageData: treeNode.imageData,
|
};
|
if (
|
treeNode.text &&
|
treeNode.image &&
|
!treeNode.labelData &&
|
!treeNode.imageData
|
) {
|
de.labelData = {
|
horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
|
pixelOffset: new Cesium.Cartesian2(20, 0),
|
};
|
de.imageData = {
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
pixelOffset: new Cesium.Cartesian2(0, 0),
|
};
|
}
|
urls.upperLevelLimit = de.level_max;
|
urls.lowerLevelLimit = de.level_min;
|
layer = sgworld.Creator.createLabelImageGeoJsonFeatureLayerProvider(
|
treeNode.name,
|
urls,
|
de,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
} else if (treeNode.class === "polylineVolume") {
|
de = {
|
id: treeNode.id,
|
level_min: defaultValue(treeNode.minimumLevel, 10),
|
level_max: defaultValue(treeNode.maximumLevel, 22),
|
material: defaultValue(treeNode.color, "#ff0000"),
|
slttype: "0",
|
number: "4",
|
exradius: "1",
|
inradius: "1",
|
orth_width: "2",
|
orth_height: "2",
|
radius: defaultValue(treeNode.radius, 0.5),
|
cornerType: "0",
|
heightReference: "0",
|
height: defaultValue(treeNode.lineHeight, 0),
|
near: "0",
|
far: "99999999999",
|
radiusScale: treeNode.radiusScale,
|
};
|
urls.upperLevelLimit = de.level_max;
|
urls.lowerLevelLimit = de.level_min;
|
layer = sgworld.Creator.createVolumeGeoJsonFeatureLayerProvider(
|
treeNode.name,
|
urls,
|
de,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
} else if (treeNode.class === "polyline") {
|
de = {
|
id: treeNode.id,
|
layertype: "polylinelayer",
|
level_min: defaultValue(treeNode.minimumLevel, 10),
|
level_max: defaultValue(treeNode.maximumLevel, 22),
|
material: defaultValue(treeNode.color, "#ffffff"),
|
height: defaultValue(treeNode.height, undefined),
|
width: defaultValue(treeNode.width, 2),
|
clampToGround: defaultValue(treeNode.clampToGround, true),
|
near: defaultValue(treeNode.near, 0),
|
far: defaultValue(treeNode.far, 1000000),
|
};
|
urls.upperLevelLimit = de.level_max;
|
urls.lowerLevelLimit = de.level_min;
|
|
layer = sgworld.Creator.createPrimitivePolylineVectorGeoJsonFeatureLayerProvider(
|
treeNode.name,
|
urls,
|
de,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
} else if (treeNode.class === "polygon") {
|
de = {
|
id: treeNode.id,
|
layertype: "polygonlayer",
|
classificationType: 0,
|
level_min: defaultValue(treeNode.minimumLevel, 10),
|
level_max: defaultValue(treeNode.maximumLevel, 22),
|
material: defaultValue(treeNode.color, "#ff0000"),
|
fill: defaultValue(treeNode.color, "#ff0000"),
|
heightReference: "1",
|
height: defaultValue(treeNode.height, 0),
|
extrudedHeight: defaultValue(treeNode.extrudedHeight, 0),
|
extrudedHeightReference: "1",
|
clampToGround: defaultValue(treeNode.clampToGround, false),
|
near: "0",
|
far: "99999999999",
|
};
|
urls.upperLevelLimit = de.level_max;
|
urls.lowerLevelLimit = de.level_min;
|
if (treeNode.extrudedHeight) {
|
layer = sgworld.Creator.createGeoJsonFeatureLayerProviderOptimization(
|
treeNode.name,
|
urls,
|
de,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
} else {
|
layer = sgworld.Creator.VolumeVectorGeoJsonFeatureLayerOptimizationGroundtest(
|
treeNode.name,
|
urls,
|
de,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
}
|
} else if (treeNode.class === "model") {
|
de = {
|
id: treeNode.id,
|
level_min: defaultValue(treeNode.minimumLevel, 10),
|
level_max: defaultValue(treeNode.maximumLevel, 22),
|
collect: 0,
|
uri: defaultValue(treeNode.model, ""),
|
file: "",
|
color: defaultValue(treeNode.color, "#ffffff"),
|
scale: defaultValue(treeNode.scale, 1),
|
heightReference: 0,
|
height: defaultValue(treeNode.height, 0),
|
near: "0",
|
far: "99999999999",
|
};
|
//模型点
|
urls.upperLevelLimit = de.level_max;
|
urls.lowerLevelLimit = de.level_min;
|
layer = sgworld.Creator.createModelGeoJsonFeatureLayerProvider(
|
treeNode.name,
|
urls,
|
de,
|
pID,
|
treeNode.checked,
|
function () {}
|
);
|
}
|
layer && (treeNode.id = layer.treeobj.id);
|
break;
|
case "terrain":
|
layer = sgworld.Creator.createTerrain(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
requestVertexNormals: true,
|
url: treeNode.urls,
|
},
|
pID,
|
true,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "sgsterrain":
|
layer = sgworld.Creator.sfsterrainprovider(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
layerName: treeNode.layer,
|
requestVertexNormals: true,
|
url: treeNode.urls,
|
token: treeNode.token,
|
},
|
pID,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "arcgisterrain":
|
layer = sgworld.Creator.createArcGISTerrain(
|
treeNode.name,
|
{
|
id: treeNode.id,
|
requestVertexNormals: true,
|
url: treeNode.urls,
|
},
|
pID,
|
treeNode.checked,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "b3dm":
|
layer = sgworld.Creator.create3DTilesets(
|
treeNode.name,
|
treeNode.urls,
|
{
|
id: treeNode.id,
|
Level: treeNode.Level,
|
maximumScreenSpaceError: treeNode.maximumScreenSpaceError || 50,
|
// preloadWhenHidden: true,
|
cullRequestsWhileMoving: false,
|
preferLeaves: true,
|
skipLevels: 2,
|
},
|
{
|
groundCenter: treeNode.Center,
|
groundheight: treeNode.modelHeight,
|
colors: treeNode.alpha
|
? "rgba(255,255,255," + treeNode.alpha + ")"
|
: treeNode.color || undefined,
|
},
|
pID,
|
treeNode.checked,
|
function (data) {}
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
case "b3dm_copy":
|
var positions = [];
|
var index = 0;
|
|
function addCopy_b3dm() {
|
var data = {
|
id: treeNode.id + index,
|
class: "modelLayer",
|
name: treeNode.name.replace("-1", "-" + (index + 2)),
|
sourceType: "b3dm",
|
Level: treeNode.Level,
|
Center: positions[index],
|
checked: false,
|
urls: treeNode.urls,
|
icon: treeNode.icon,
|
};
|
zTreeObj1.addNodes(treeNode.getParentNode(), data);
|
if (++index < treeNode.copy_num) {
|
addCopy_b3dm();
|
}
|
}
|
layer = sgworld.Creator.create3DTilesets(
|
treeNode.name,
|
treeNode.urls,
|
{
|
id: treeNode.id,
|
Level: treeNode.Level,
|
},
|
{},
|
pID,
|
treeNode.checked,
|
function (data) {
|
var cartographic = Cesium.Cartographic.fromCartesian(
|
layer.item.boundingSphere.center
|
);
|
var degrees = {
|
lon: Cesium.Math.toDegrees(cartographic.longitude),
|
lat: Cesium.Math.toDegrees(cartographic.latitude),
|
height: cartographic.height,
|
};
|
var position, num;
|
var row = (col = parseInt(Math.sqrt(treeNode.copy_num)));
|
num = treeNode.copy_num - row * col;
|
for (var i = 0; i < row; i++) {
|
for (var j = 0; j < col; j++) {
|
if (!i && !j) {
|
continue;
|
}
|
position = [
|
degrees.lon + j * treeNode.offset,
|
degrees.lat + i * treeNode.offset,
|
degrees.height,
|
];
|
positions.push(position);
|
}
|
}
|
//treeNode.flyTo = [degrees.lon, degrees.lat, position[0], position[1]];
|
for (var i = 0; i < num; i++) {
|
positions.push([
|
position[0] + treeNode.offset,
|
position[1] - i * treeNode.offset,
|
position[2],
|
]);
|
}
|
|
treeNode.name += "-1";
|
treeNode.id = layer.treeobj.id;
|
addCopy_b3dm();
|
}
|
);
|
break;
|
case "gltf":
|
var position = [treeNode.lon, treeNode.lat, treeNode.height];
|
layer = sgworld.Creator.createModel(
|
position,
|
treeNode.urls,
|
{
|
id: treeNode.id,
|
scale: treeNode.scale || 1,
|
},
|
pID,
|
treeNode.name,
|
""
|
);
|
treeNode.id = layer.treeobj.id;
|
break;
|
}
|
if (treeNode.sourceType !== "gltf" && (treeNode.lon || treeNode.lat)) {
|
treeNode.flyTo = [
|
treeNode.lon,
|
treeNode.lat,
|
defaultValue(treeNode.height, 10000),
|
];
|
}
|
if (treeNode.minx && treeNode.miny && treeNode.maxx && treeNode.maxy) {
|
treeNode.flyTo = [
|
treeNode.minx,
|
treeNode.miny,
|
treeNode.maxx,
|
treeNode.maxy,
|
];
|
}
|
if (treeNode.sourceType === "wfs") {
|
addTreeData(treeNode, layer);
|
}
|
},
|
},
|
};
|
</script>
|
