<template>
|
<div>
|
<div id="sdkContainer1" style="height: 100%"></div>
|
<div class="listBox" v-show="!isLand">
|
<ul>
|
<li
|
v-for="(item, index) in arr"
|
:key="index"
|
@click="changeLeftMap($event, item, index)"
|
>
|
{{ item }}
|
</li>
|
</ul>
|
</div>
|
<layerTreeTwoScreenRight
|
v-if="layerTreeTwoScreen"
|
id="layerTreeTwoScreen111"
|
/>
|
<div class="tdInfo" v-if="showTDinfo">
|
<div class="tdInfo_close" @click="tdInfoClose">×</div>
|
<p v-if="dikuanxinxi" class="noInfo">暂无该地块信息</p>
|
<ul v-else>
|
<div class="title">
|
<li>基本信息</li>
|
</div>
|
<div class="content1">
|
<li>用地编码： {{ ydbm }}</li>
|
<li>用地类型： {{ ydlx }}</li>
|
<li>产业方向： {{ cyfx }}</li>
|
</div>
|
<div class="title">
|
<li>出让信息</li>
|
</div>
|
<div class="content2">
|
<li>出让状态： {{ crzt }}</li>
|
<li>用地面积： {{ ydmj }}平方米</li>
|
<li>出让年限： {{ crnx }}</li>
|
<li>出让年份： {{ crnf }}</li>
|
</div>
|
<div class="title">
|
<li>规划指标</li>
|
</div>
|
<div class="content3">
|
<li>容积率： {{ rjl }}</li>
|
<li>建筑限高： {{ jzxg }}</li>
|
<li>建筑密度： {{ jzmd }}</li>
|
</div>
|
<div v-if="qysl == 0" class="title">
|
<li>暂无企业</li>
|
</div>
|
|
<div v-else class="title">
|
<li>
|
企业
|
<el-tooltip
|
class="item"
|
effect="dark"
|
content="点击查看企业信息"
|
placement="bottom"
|
>
|
<a @click="showYZCQY"> {{ qysl }}</a>
|
</el-tooltip>
|
家
|
</li>
|
</div>
|
</ul>
|
</div>
|
<div
|
:style="{
|
width: `${size}`,
|
height: `${size}`,
|
transform: `scale(${scale}) translate(${offset},${offset})`,
|
'-webkit-transform': `scale(${scale}) translate(${offset},${offset})`,
|
'-moz-transform': `scale(${scale}) translate(${offset},${offset})`,
|
'-o-transform': `scale(${scale}) translate(${offset},${offset})`,
|
'-ms-transform': `scale(${scale}) translate(${offset},${offset})`,
|
}"
|
>
|
<el-dialog
|
class="aboutDialog"
|
title="企业信息"
|
append-to-body
|
width="60%"
|
height="60%"
|
style="overflow: auto"
|
:visible.sync="QYbox"
|
:before-close="dialogClose"
|
>
|
<div class="el-dialog-div">
|
<div class="inquire">
|
<el-form
|
size="medium"
|
ref="queryForm"
|
:model="queryForm"
|
:inline="true"
|
>
|
<el-form-item label="查询内容" prop="name">
|
<el-input
|
v-model="queryForm.content"
|
placeholder="请输入查询内容"
|
/>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
@click="queryInfo('queryForm')"
|
icon="el-icon-search"
|
class="primary"
|
>查询</el-button
|
>
|
</el-form-item>
|
</el-form>
|
</div>
|
<el-table
|
fit
|
style="width: 100%"
|
:data="tableData"
|
highlight-current-row
|
>
|
<el-table-column type="index" width="50"></el-table-column>
|
<el-table-column
|
property="企业名称"
|
label="企业名称"
|
></el-table-column>
|
<el-table-column
|
property="企业类型"
|
label="企业类型"
|
></el-table-column>
|
<el-table-column
|
property="成立时间"
|
label="成立时间"
|
></el-table-column>
|
<el-table-column
|
property="所属行业"
|
label="所属行业"
|
></el-table-column>
|
<el-table-column
|
property="法人"
|
label="法人"
|
width="100"
|
></el-table-column>
|
<el-table-column
|
property="注册地址"
|
label="注册地址"
|
width="200"
|
></el-table-column>
|
</el-table>
|
<div
|
slot="footer"
|
class="dialog-footer"
|
style="text-align: center; margin-top: 5px"
|
>
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page.sync="currentPage"
|
:page-size="10"
|
:pager-count="11"
|
layout="total, pager"
|
:total="searchNum"
|
>
|
</el-pagination>
|
</div>
|
</div>
|
</el-dialog>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import common from "@/components/common";
|
import { mapState } from "vuex";
|
import axios from "axios";
|
import layerTreeTwoScreenRight from "@/components/left/layerTreeTwoScreenRight";
|
import URLInCode from "@/assets/js/urlInCode";
|
|
import Bus from "../tools/Bus";
|
|
let line,
|
line1,
|
handler,
|
handler1,
|
divPoint,
|
divPoint1,
|
dx,
|
activeLi,
|
nLayer,
|
TDLayer,
|
LWLayer;
|
export default {
|
name: "viewer1",
|
components: { layerTreeTwoScreenRight },
|
data() {
|
return {
|
cHeight: "770千米",
|
date: "",
|
bottomInfo: "",
|
hb: "",
|
jd: "",
|
wd: "",
|
dikuanxinxi: false,
|
showTDinfo: false,
|
ydbm: "",
|
ydlx: "",
|
cyfx: "",
|
crzt: "",
|
ydmj: null,
|
crnx: "",
|
crnf: "",
|
rjl: "",
|
jzxg: "",
|
jzmd: "",
|
qysl: null,
|
qiyexinxi: [],
|
QYbox: false,
|
search: "",
|
currentPage: 1,
|
pageSize: 10,
|
searchNum: 0,
|
arr: [
|
2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012,
|
2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021,
|
],
|
tableData: [],
|
|
queryForm: {
|
type: "企业名称",
|
content: "",
|
},
|
size: "100%",
|
scale: "1",
|
offset: "0%",
|
};
|
},
|
created() {},
|
computed: {
|
...mapState(["viewer1Show", "isLand", "layerTreeTwoScreen"]),
|
},
|
watch: {
|
viewer1Show: {
|
immediate: true,
|
handler(newvalue, oldvalue) {
|
setTimeout(() => {
|
if (newvalue) {
|
window.sgworld1.Viewer.camera.moveEnd.addEventListener(
|
this.cameraMoveEnd
|
);
|
} else {
|
this.viewerStyle = "";
|
this.viewer1Style = "";
|
window.sgworld1.Viewer.camera.moveEnd.removeEventListener(
|
this.cameraMoveEnd
|
);
|
}
|
}, 2000);
|
},
|
},
|
isLand(newvalue, oldvalue) {
|
if (!newvalue) {
|
if (TDLayer) {
|
TDLayer.deleteObject();
|
TDLayer = null;
|
}
|
if (line) {
|
sgworld.Creator.DeleteObject(line);
|
}
|
if (line1) {
|
sgworld1.Creator.DeleteObject(line1);
|
}
|
} else {
|
this.destroyImageLayer();
|
if (!TDLayer) {
|
this.loadTDGLLayer();
|
}
|
}
|
},
|
},
|
mounted() {
|
let size = this.detectZoom();
|
this.scale = (100 / size).toFixed(2);
|
this.offset = "-" + ((size - 100) / 2).toFixed(2) + "%";
|
this.size = size + "%";
|
this.$nextTick(function () {
|
let that = this;
|
let option = {
|
fullscreenButton: true,
|
licenseServer: "http://183.162.245.49:18080",
|
minViewHeight: parseFloat(common.minviewheight),
|
contextOptions: {
|
failIfMajorPerformanceCaveat: false,
|
webgl: {
|
alpha: true,
|
preserveDrawingBuffer: true,
|
},
|
},
|
};
|
|
// 北京
|
window.sgworld1 = new SmartEarth.EarthCtrl(
|
"sdkContainer1",
|
{
|
StaticFileBaseUrl: "../../static/CimSDK/",
|
// StaticFileBaseUrl: "../../../SW/static/CimSDK/",
|
},
|
{},
|
null,
|
() => {
|
sgworld1.Creator.createArcGisImageryLayer(
|
"ARCGIS",
|
{
|
url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
|
enablePickFeatures: false,
|
},
|
"0",
|
1,
|
true,
|
""
|
);
|
if (this.isLand) {
|
this.loadTDGLLayer();
|
}
|
var p = {
|
destination: sgworld.Navigate.getPosition(),
|
orientation: {
|
heading: sgworld.Viewer.camera.heading,
|
pitch: sgworld.Viewer.camera.pitch,
|
roll: sgworld.Viewer.camera.roll,
|
},
|
};
|
sgworld1.Viewer.camera.setView(p);
|
setTimeout(() => {
|
window.loading && window.loading.close();
|
}, 100);
|
setTimeout(() => {
|
window.APPLoading && window.APPLoading.close();
|
}, 100);
|
}
|
);
|
|
window.Viewer1 = sgworld1._Viewer;
|
Viewer1.shadows = false;
|
|
//深度检测
|
sgworld1.Analysis.depthTestAgainstTerrain(true);
|
|
//地下模式距离参数
|
// Viewer.scene.screenSpaceCameraController.enableCollisionDetection = false;
|
Viewer1.scene.globe.translucency.frontFaceAlpha = 0.5;
|
Viewer1.scene.globe.undergroundColor = undefined;
|
|
this.addEvent();
|
});
|
//关闭弹窗
|
Bus.$on("closeLandInfoPop", (data) => {
|
if (data) {
|
this.showTDinfo = false;
|
}
|
});
|
},
|
methods: {
|
setImageComparison(isStart) {
|
this.isImage = isStart;
|
if (!this.isImage) {
|
this.destroyImageLayer();
|
}
|
},
|
destroyImageLayer() {
|
if (activeLi) {
|
activeLi.classList.remove("active");
|
activeLi = null;
|
}
|
if (nLayer) {
|
Viewer1.imageryLayers.remove(nLayer, true);
|
nLayer = null;
|
}
|
if (LWLayer) {
|
Viewer1.imageryLayers.remove(LWLayer, true);
|
LWLayer = null;
|
}
|
},
|
changeLeftMap(event, item, index) {
|
let liObj = event.currentTarget;
|
if (activeLi) {
|
activeLi.classList.remove("active");
|
activeLi = null;
|
}
|
liObj.classList.add("active");
|
activeLi = liObj;
|
this.loadImageLayer(item);
|
},
|
loadImageLayer(year) {
|
if (nLayer) {
|
Viewer1.imageryLayers.remove(nLayer, true);
|
nLayer = null;
|
}
|
nLayer = this.loadBJ54ImageLayer(year);
|
if (!LWLayer) {
|
LWLayer = this.loadBJ54LWLayer();
|
}
|
},
|
loadBJ54LWLayer() {
|
let url = "http://172.26.64.84/service/ImageEngine/picdis/abc";
|
//let url = option.url;
|
//let year = option.year;
|
let paramUrl = `${url}?user=jjjskfq&password=Jjjskfq@2022&layer=Shiliang_Lw_2019&style=&Service=WMTS&Request=GetTile&Version=1.0.0&Format=image%2Fpng&TileMatrix={z}&TileCol={nx}&TileRow={ny}`;
|
let minx = (113.168199 * Math.PI) / 180.0;
|
let miny = (39.230551 * Math.PI) / 180.0;
|
let maxx = (118.562362 * Math.PI) / 180.0;
|
let maxy = (41.294714 * Math.PI) / 180.0;
|
let rectangle = new Cesium.Rectangle(minx, miny, maxx, maxy);
|
let tilingScheme = new Cesium.GeographicTilingScheme({
|
rectangle: rectangle,
|
numberOfLevelZeroTilesX: 2,
|
numberOfLevelZeroTilesY: 1,
|
});
|
var dx = {
|
url: paramUrl,
|
tilingScheme: tilingScheme,
|
customTags: {
|
nx: function (imageryProvider, x, y, level) {
|
return (2 << (level - 1)) + x;
|
},
|
ny: function (imageryProvider, x, y, level) {
|
return (2 << (level - 1)) + y;
|
},
|
},
|
};
|
var imageryProvider = new Cesium.UrlTemplateImageryProvider(dx);
|
let imageLayer = new Cesium.ImageryLayer(imageryProvider, {
|
alpha: 1,
|
brightness: 1.0,
|
});
|
Viewer1.imageryLayers.add(imageLayer, 3);
|
return imageLayer;
|
},
|
loadBJ54ImageLayer(year) {
|
let url = "http://172.26.64.84/service/ImageEngine/picdis/abc";
|
//let url = option.url;
|
//let year = option.year;
|
let paramUrl = `${url}?user=jjjskfq&password=Jjjskfq@2022&layer=Sate_${year}&style=&Service=WMTS&Request=GetTile&Version=1.0.0&Format=image%2Fpng&TileMatrix={z}&TileCol={nx}&TileRow={ny}`;
|
let minx = (113.168199 * Math.PI) / 180.0;
|
let miny = (39.230551 * Math.PI) / 180.0;
|
let maxx = (118.562362 * Math.PI) / 180.0;
|
let maxy = (41.294714 * Math.PI) / 180.0;
|
let rectangle = new Cesium.Rectangle(minx, miny, maxx, maxy);
|
let tilingScheme = new Cesium.GeographicTilingScheme({
|
rectangle: rectangle,
|
numberOfLevelZeroTilesX: 2,
|
numberOfLevelZeroTilesY: 1,
|
});
|
var dx = {
|
url: paramUrl,
|
tilingScheme: tilingScheme,
|
customTags: {
|
nx: function (imageryProvider, x, y, level) {
|
return (2 << (level - 1)) + x;
|
},
|
ny: function (imageryProvider, x, y, level) {
|
return (2 << (level - 1)) + y;
|
},
|
},
|
};
|
var imageryProvider = new Cesium.UrlTemplateImageryProvider(dx);
|
let imageLayer = new Cesium.ImageryLayer(imageryProvider, {
|
alpha: 1,
|
brightness: 1.0,
|
});
|
Viewer1.imageryLayers.add(imageLayer, 2);
|
return imageLayer;
|
},
|
loadTDGLLayer() {
|
let treeNode = URLInCode.tdglTmsCode;
|
TDLayer = sgworld1.Creator.createImageryProvider(
|
treeNode.name,
|
"tms",
|
{
|
id: treeNode.id,
|
url: treeNode.urls,
|
fileExtension: treeNode.img || "png",
|
enablePickFeatures: false,
|
level: treeNode.Level,
|
minimumLevel: treeNode.minimumLevel,
|
maximumLevel: treeNode.maximumLevel,
|
tilingScheme:
|
treeNode.tileType === "Geo"
|
? new Cesium.GeographicTilingScheme()
|
: new Cesium.WebMercatorTilingScheme(),
|
alpha: treeNode.alpha,
|
},
|
"0",
|
treeNode.zIndex,
|
true,
|
""
|
);
|
},
|
addEvent() {
|
let type = 0;
|
//点击左侧显示范围、详情
|
handler1 = new Cesium.ScreenSpaceEventHandler(Viewer1.scene.canvas);
|
handler1.setInputAction((event) => {
|
if (this.isLand) {
|
let that = this;
|
this.clearInfoPanel();
|
let p;
|
if (type === 0) {
|
p = sgworld1.Navigate.getMouseDegrees(event);
|
} else {
|
p = sgworld1.Navigate.getMousePosition(event);
|
}
|
// alert(JSON.stringify(p))
|
// console.log(p);
|
if (p) {
|
if (line) {
|
sgworld.Creator.DeleteObject(line);
|
line = null;
|
}
|
if (line1) {
|
sgworld1.Creator.DeleteObject(line1);
|
line1 = null;
|
}
|
if (divPoint) {
|
sgworld.Creator.DeleteObject(divPoint);
|
divPoint = null;
|
}
|
if (divPoint1) {
|
sgworld1.Creator.DeleteObject(divPoint1);
|
divPoint1 = null;
|
}
|
axios
|
.get(
|
"http://10.10.4.115:8022/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" +
|
p.lon +
|
"&lat=" +
|
p.lat +
|
"&geom=true&requesttype=json"
|
)
|
.then((response) => {
|
let center = { lon: 0, lat: 0 };
|
let polygon = that.read(response.data.geometry);
|
if (polygon.length > 0) {
|
var geometry = [];
|
let points = polygon[0].split(",");
|
for (let i = 0; i < points.length; i++) {
|
let point = points[i].replace(/^\s+|\s+$/g, "").split(" ");
|
center.lon += parseFloat(point[0]) / points.length;
|
center.lat += parseFloat(point[1]) / points.length;
|
geometry.push({
|
x: parseFloat(point[0]),
|
y: parseFloat(point[1]),
|
z: 0,
|
});
|
}
|
if (line) {
|
sgworld.Creator.DeleteObject(line);
|
line = null;
|
}
|
if (line1) {
|
sgworld1.Creator.DeleteObject(line1);
|
line1 = null;
|
}
|
line = sgworld.Creator.createPolyline(
|
geometry,
|
"#ff0000",
|
1,
|
0,
|
"线"
|
);
|
line1 = sgworld1.Creator.createPolyline(
|
geometry,
|
"#ff0000",
|
1,
|
0,
|
"线"
|
);
|
}
|
if (center.lon != 0 && center.lat != 0) {
|
axios
|
.get(
|
"http://10.10.4.115:8022//poisearch/guihuacon/getInfo?ydbm=" +
|
response.data.NO
|
)
|
.then(
|
(info) => {
|
try {
|
if (divPoint) {
|
sgworld.Creator.DeleteObject(divPoint);
|
divPoint = null;
|
}
|
if (divPoint1) {
|
sgworld1.Creator.DeleteObject(divPoint1);
|
divPoint1 = null;
|
}
|
// console.log(info.data.data);
|
//关闭弹窗
|
layuiLayer.close(SmartEarthPopupData.layerProp);
|
//关闭右侧信息弹窗
|
Bus.$emit("closeRightPop", true);
|
this.showTDinfo = true;
|
let data = info.data.data;
|
if (data.yongdishuju === null) {
|
this.dikuanxinxi = true;
|
return;
|
} else {
|
this.dikuanxinxi = false;
|
}
|
this.qiyexinxi = info.data.data.qiyexinxi;
|
this.qysl = data.qiyexinxi.length;
|
|
if (this.qysl > 0) {
|
this.ydbm = data.qiyexinxi[0]["地块编号"];
|
} else {
|
this.ydbm = data.churangxinxi["ydbh"];
|
}
|
try {
|
this.ydlx = data.yongdishuju["ydlxmc"];
|
} catch (e) {}
|
try {
|
this.cyfx = data.yongdishuju["cyfx"];
|
} catch (e) {}
|
try {
|
// this.crzt = response.data["ZT"];
|
switch (response.data["ZT"]) {
|
case 3:
|
this.crzt = "已出让";
|
break;
|
case 4:
|
this.crzt = "未出让";
|
break;
|
}
|
} catch (e) {}
|
try {
|
this.ydmj = parseFloat(
|
"" + data.yongdishuju["ydmj"]
|
).toFixed(0);
|
} catch (e) {}
|
try {
|
this.crnx = data.churangxinxi["crnx"];
|
} catch (e) {}
|
try {
|
this.crnf = data.churangxinxi["crnf"];
|
} catch (e) {}
|
try {
|
this.rjl = data.yongdishuju["rjl"];
|
} catch (e) {}
|
try {
|
this.jzxg = data.yongdishuju["jzxg"];
|
} catch (e) {}
|
try {
|
this.jzmd = data.yongdishuju["jzmd"];
|
} catch (e) {}
|
} catch (e) {}
|
},
|
(info) => {
|
this.$notify.error({
|
title: "提示",
|
message: "未查询到数据！",
|
});
|
// alert("未查询到数据！");
|
console.log("查询失败！");
|
}
|
);
|
}
|
});
|
}
|
}
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
},
|
dialogClose() {
|
this.queryForm.content = "";
|
this.queryForm.type = "企业名称";
|
this.QYbox = false;
|
},
|
// 关闭信息框
|
tdInfoClose() {
|
this.showTDinfo = false;
|
},
|
// 初始加载已注册企业
|
showYZCQY() {
|
this.showTDinfo = false;
|
this.QYbox = !this.QYbox;
|
this.searchYZCQY("企业名称");
|
},
|
// 初始加载实际企业
|
|
queryInfo() {
|
this.searchYZCQY(this.queryForm.type);
|
},
|
|
// 每页多少条
|
handleSizeChange(val) {
|
this.pageSize = val;
|
},
|
// 当前页
|
handleCurrentChange(val) {
|
this.currentPage = val;
|
this.searchYZCQY(this.queryForm.type);
|
},
|
// 查询企业
|
searchYZCQY(param) {
|
const tableData = this.qiyexinxi;
|
// 搜索出的结果
|
let searchTable = this.tableRes(this.queryForm.content, tableData);
|
|
// 搜索出的数量进行分页
|
this.searchNum = searchTable.length;
|
//根据页码展示内容
|
setTimeout(() => {
|
this.tableData = searchTable.slice(
|
(this.currentPage - 1) * this.pageSize,
|
this.currentPage * this.pageSize
|
);
|
}, 200);
|
},
|
//全局搜索
|
tableRes(searchData, table, array) {
|
const search = searchData;
|
if (search) {
|
return table.filter((data) => {
|
return Object.keys(data).some((key) => {
|
if (array) {
|
if (array.indexOf(key) == -1) {
|
return String(data[key]).toLowerCase().indexOf(search) > -1;
|
}
|
} else {
|
return String(data[key]).toLowerCase().indexOf(search) > -1;
|
}
|
});
|
});
|
}
|
return table;
|
},
|
|
detectZoom() {
|
var ratio = 0,
|
screen = window.screen,
|
ua = navigator.userAgent.toLowerCase();
|
if (window.devicePixelRatio !== undefined) {
|
ratio = window.devicePixelRatio;
|
} else if (~ua.indexOf("msie")) {
|
if (screen.deviceXDPI && screen.logicalXDPI) {
|
ratio = screen.deviceXDPI / screen.logicalXDPI;
|
}
|
} else if (
|
window.outerWidth !== undefined &&
|
window.innerWidth !== undefined
|
) {
|
ratio = window.outerWidth / window.innerWidth;
|
}
|
|
if (ratio) {
|
ratio = Math.round(ratio * 100);
|
}
|
// ratio 就是获取到的百分比
|
// console.log(ratio);
|
return ratio;
|
//this.onresize_height = ratio;
|
// return ratio;
|
},
|
read(wkt) {
|
var regExes = {
|
typeStr: /^\s*(\w+)\s*\(\s*(.*)\s*\)\s*$/,
|
emptyTypeStr: /^\s*(\w+)\s*EMPTY\s*$/,
|
spaces: /\s+/,
|
parenComma: /\)\s*,\s*\(/,
|
doubleParenComma: /\)\s*\)\s*,\s*\(\s*\(/, // can't use {2} here
|
trimParens: /^\s*\(?(.*?)\)?\s*$/,
|
};
|
/**
|
* Object with properties corresponding to the geometry types. Property values
|
* are functions that do the actual parsing.
|
* @private
|
*/
|
var parse$1 = {
|
/**
|
* Return point geometry given a point WKT fragment.
|
*
|
* @param {String} str A WKT fragment representing the point.
|
* @return {Point} A point geometry.
|
* @private
|
*/
|
point: function point(str) {
|
if (str === undefined) {
|
return [];
|
}
|
|
var coords = str.trim().split(regExes.spaces);
|
return [Number.parseFloat(coords[0]), Number.parseFloat(coords[1])];
|
},
|
|
/**
|
* Return a multipoint geometry given a multipoint WKT fragment.
|
*
|
* @param {String} str A WKT fragment representing the multipoint.
|
* @return {Point} A multipoint feature.
|
* @private
|
*/
|
multipoint: function multipoint(str) {
|
var this$1 = this;
|
|
if (str === undefined) {
|
return [];
|
}
|
|
var point;
|
var points = str.trim().split(",");
|
var components = [];
|
for (var i = 0, len = points.length; i < len; ++i) {
|
point = points[i].replace(regExes.trimParens, "$1");
|
components.push(parse$1.point(point));
|
}
|
return components;
|
},
|
|
/**
|
* Return a linestring geometry given a linestring WKT fragment.
|
*
|
* @param {String} str A WKT fragment representing the linestring.
|
* @return {LineString} A linestring geometry.
|
* @private
|
*/
|
linestring: function linestring(str) {
|
if (str === undefined) {
|
return [];
|
}
|
|
var points = str.trim().split(",");
|
var components = [];
|
var coords;
|
for (var i = 0, len = points.length; i < len; ++i) {
|
coords = points[i].trim().split(regExes.spaces);
|
components.push([
|
Number.parseFloat(coords[0]),
|
Number.parseFloat(coords[1]),
|
]);
|
}
|
return components;
|
},
|
|
/**
|
* Return a linearring geometry given a linearring WKT fragment.
|
*
|
* @param {String} str A WKT fragment representing the linearring.
|
* @return {LinearRing} A linearring geometry.
|
* @private
|
*/
|
linearring: function linearring(str) {
|
if (str === undefined) {
|
return [];
|
}
|
|
var points = str.trim().split(",");
|
var components = [];
|
var coords;
|
for (var i = 0, len = points.length; i < len; ++i) {
|
coords = points[i].trim().split(regExes.spaces);
|
components.push([
|
Number.parseFloat(coords[0]),
|
Number.parseFloat(coords[1]),
|
]);
|
}
|
return components;
|
},
|
|
/**
|
* Return a multilinestring geometry given a multilinestring WKT fragment.
|
*
|
* @param {String} str A WKT fragment representing the multilinestring.
|
* @return {MultiLineString} A multilinestring geometry.
|
* @private
|
*/
|
multilinestring: function multilinestring(str) {
|
var this$1 = this;
|
|
if (str === undefined) {
|
return [];
|
}
|
|
var line;
|
var lines = str.trim().split(regExes.parenComma);
|
var components = [];
|
for (var i = 0, len = lines.length; i < len; ++i) {
|
line = lines[i].replace(regExes.trimParens, "$1");
|
components.push(parse$1.linestring(line));
|
}
|
return components;
|
},
|
|
/**
|
* Return a polygon geometry given a polygon WKT fragment.
|
*
|
* @param {String} str A WKT fragment representing the polygon.
|
* @return {Polygon} A polygon geometry.
|
* @private
|
*/
|
polygon: function polygon(str) {
|
var this$1 = this;
|
|
if (str === undefined) {
|
return [];
|
}
|
|
var ring, linestring, linearring;
|
var rings = str.trim().split(regExes.parenComma);
|
var shell;
|
var holes = [];
|
//for (var i = 0, len = rings.length; i < len; ++i) {
|
ring = rings[0].replace(regExes.trimParens, "$1");
|
linestring = ring;
|
//}
|
return linestring;
|
},
|
|
/**
|
* Return a multipolygon geometry given a multipolygon WKT fragment.
|
*
|
* @param {String} str A WKT fragment representing the multipolygon.
|
* @return {MultiPolygon} A multipolygon geometry.
|
* @private
|
*/
|
multipolygon: function multipolygon(str) {
|
var this$1 = this;
|
|
if (str === undefined) {
|
return [];
|
}
|
|
var polygon;
|
var polygons = str.trim().split(regExes.doubleParenComma);
|
var components = [];
|
for (var i = 0, len = polygons.length; i < len; ++i) {
|
polygon = polygons[i].replace(regExes.trimParens, "$1");
|
components.push(parse$1.polygon(polygon));
|
}
|
return components;
|
},
|
};
|
|
var geometry, type, str;
|
wkt = wkt.replace(/[\n\r]/g, " ");
|
var matches = regExes.typeStr.exec(wkt);
|
if (wkt.search("EMPTY") !== -1) {
|
matches = regExes.emptyTypeStr.exec(wkt);
|
matches[2] = undefined;
|
}
|
if (matches) {
|
type = matches[1].toLowerCase();
|
str = matches[2];
|
if (parse$1[type]) {
|
geometry = parse$1[type].apply(this, [str]);
|
}
|
}
|
|
if (geometry === undefined) {
|
throw new Error("Could not parse WKT " + wkt);
|
}
|
|
return geometry;
|
},
|
cameraMoveEnd() {
|
var p = {
|
destination: sgworld1.Navigate.getPosition(),
|
orientation: {
|
heading: sgworld1.Viewer.camera.heading,
|
pitch: sgworld1.Viewer.camera.pitch,
|
roll: sgworld1.Viewer.camera.roll,
|
},
|
};
|
sgworld.Viewer.camera.setView(p);
|
},
|
clearInfoPanel() {
|
this.showTDinfo = false;
|
// console.log(info.data.data);
|
//已注册企业（企业链）
|
|
this.qiyexinxi = "";
|
this.qysl = 0;
|
this.ydbm = "";
|
this.ydlx = "";
|
this.cyfx = "";
|
this.crzt = "";
|
this.ydmj = "";
|
this.crnx = "";
|
this.crnf = "";
|
this.rjl = "";
|
this.jzxg = "";
|
this.jzmd = "";
|
},
|
//初始化弹窗事件
|
initLayerOpen() {
|
window.layerOpen = function (name, options) {
|
layuiLayer.close(SmartEarthPopupData.layerProp);
|
|
let width = options.width;
|
let height = options.height;
|
let fn = options.fn || {};
|
|
//获取相关回调事件
|
let cancelFn = null;
|
let successFn = null;
|
let endFn = null;
|
for (let key in fn) {
|
cancelFn = key == "cancel" ? fn[key] : cancelFn;
|
successFn = key == "success" ? fn[key] : successFn;
|
endFn = key == "end" ? fn[key] : endFn;
|
}
|
|
SmartEarthPopupData.layerProp = layuiLayer.open({
|
title: name,
|
skin: "other-class",
|
type: 2, //0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
|
shade: 0,
|
shadeClose: true,
|
resize: false,
|
offset: options.offset || undefined,
|
area: [
|
typeof width === "number" ? width + "px" : width,
|
typeof height === "number" ? height + "px" : height,
|
],
|
content: options.url,
|
success: function (layero, index) {
|
layero.css({
|
"border-radius": "8px",
|
});
|
if (successFn && typeof successFn === "function") {
|
successFn(layero, index);
|
}
|
},
|
cancel: function () {
|
if (cancelFn && typeof cancelFn === "function") {
|
cancelFn();
|
}
|
},
|
end: function () {
|
if (endFn && typeof endFn === "function") {
|
endFn();
|
}
|
},
|
});
|
};
|
},
|
//地图底部工具栏显示地图坐标信息
|
showBottom() {
|
this.bottomInfo =
|
"<div style='color: #FFFFFF;float: left;height: 28px;line-height: 28px;'></div>";
|
|
let handler3D = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas);
|
handler3D.setInputAction((wheelment) => {
|
// 滚动滚轴，得到当前的视点高度
|
// 单位换算，当大于1000米的时候显示“千米”，小于1000米的时候显示单位为“米”
|
var cHeightM = Viewer.camera.positionCartographic.height;
|
var cHeightKm = (cHeightM / 1000).toFixed(0);
|
if (cHeightKm > 1) {
|
this.cHeight = cHeightKm + "千米";
|
} else {
|
this.cHeight = cHeightM.toFixed(0) + "米";
|
}
|
// 当cHeight的值改变时，赋值给window中的sdHeight
|
window.sdHeight = this.cHeight;
|
this.bottomInfo =
|
"<div style='color: #FFFFFF;float: left;height: 28px;line-height: 28px;'></div>" +
|
"<span id='cd_label' style='font-size:13px;text-align:center;font-family:微软雅黑;color:#FFFFFF;float: right;height: 28px;line-height: 28px;'>" +
|
"<span style='margin-right:40px'>海拔:" +
|
this.hb +
|
"米</span>" +
|
"<span style='margin-right:40px'>经度：" +
|
this.jd +
|
"</span>" +
|
"<span style='margin-right:40px'>纬度：" +
|
this.wd +
|
"</span>" +
|
"<span style='margin-right:40px'>视点高度：" +
|
this.cHeight +
|
"</span>" +
|
"</span>";
|
}, Cesium.ScreenSpaceEventType.WHEEL);
|
handler3D.setInputAction((movement) => {
|
if (window.sdHeight == "") {
|
this.cHeight = "862.1千米";
|
}
|
let cartesian = Viewer.scene.pickPosition(movement.endPosition);
|
if (!cartesian) return;
|
let degrees = sgworld.Core.toDegrees(cartesian);
|
if (degrees) {
|
let height = degrees.height;
|
//地理坐标（弧度）转经纬度坐标
|
let point = [degrees.lon, degrees.lat];
|
this.hb = height.toFixed(0);
|
this.jd = point[0].toFixed(2);
|
this.wd = point[1].toFixed(2);
|
this.bottomInfo =
|
"<div style='color: #FFFFFF;float: left;height: 28px;line-height: 28px;'></div>" +
|
"<span id='cd_label' style='font-size:13px;text-align:center;font-family:微软雅黑;color:#FFFFFF;float: right;height: 28px;line-height: 28px;'>" +
|
"<span style='margin-right:40px'>海拔:" +
|
this.hb +
|
"米</span>" +
|
"<span style='margin-right:40px'>经度：" +
|
this.jd +
|
"</span>" +
|
"<span style='margin-right:40px'>纬度：" +
|
this.wd +
|
"</span>" +
|
"<span style='margin-right:40px'>视点高度：" +
|
this.cHeight +
|
"</span>" +
|
"</span>";
|
}
|
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
|
},
|
},
|
beforeDestroy() {
|
Bus.$off("closeLandInfoPop");
|
if (line) {
|
sgworld.Creator.DeleteObject(line);
|
}
|
if (line1) {
|
sgworld1.Creator.DeleteObject(line1);
|
}
|
if (divPoint) {
|
sgworld.Creator.DeleteObject(divPoint);
|
}
|
if (divPoint1) {
|
sgworld1.Creator.DeleteObject(divPoint1);
|
}
|
if (dx) {
|
dx.deleteObject();
|
//sgworld.Creator.DeleteObject(dx);
|
}
|
|
if (handler) {
|
handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
}
|
if (handler1) {
|
handler1.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
}
|
},
|
};
|
</script>
|
<style scoped>
|
.tdInfo_close {
|
position: absolute;
|
right: 10px;
|
top: 10px;
|
border-radius: 3px;
|
width: 30px;
|
height: 30px;
|
background-color: rgba(0, 0, 0, 0.2);
|
cursor: pointer;
|
text-align: center;
|
line-height: 25px;
|
font-size: 30px;
|
}
|
|
#bottomInfo {
|
position: absolute;
|
bottom: 0;
|
width: 100%;
|
height: 28px;
|
background: rgba(0, 0, 0, 0.27);
|
}
|
|
.noInfo {
|
margin: 30px 20px 20px;
|
width: 200px;
|
text-align: center;
|
}
|
|
.tdInfo {
|
position: absolute;
|
z-index: 999;
|
top: 15%;
|
right: 0%;
|
transform: translateX(50%);
|
padding: 20px 0;
|
/* height: 529px; */
|
/* box-sizing: border-box; */
|
background: rgba(14, 50, 143, 0.85);
|
border: 1px solid #205fbc;
|
box-shadow: 0px 1px 10px 0px rgba(3, 10, 26, 0.38);
|
border-radius: 6px;
|
color: #fff;
|
text-align: left;
|
}
|
|
.tdInfo .title {
|
background-image: url("~@/assets/img/new/tdgltitle.png");
|
background-size: 100% 100%;
|
}
|
|
.tdInfo .title li {
|
margin-left: 32px;
|
line-height: 30px;
|
font-size: 18px;
|
font-weight: bold;
|
background: linear-gradient(0deg, #9cd2ff 0%, #ffffff 100%);
|
-webkit-background-clip: text;
|
-webkit-text-fill-color: transparent;
|
}
|
|
.content1,
|
.content2,
|
.content3 {
|
/* width: 100%; */
|
box-sizing: border-box;
|
/* margin-left: 42px; */
|
min-width: 220px;
|
max-width: 280px;
|
margin: 0 40px;
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
padding: 19px 0;
|
}
|
|
.content1 li,
|
.content2 li,
|
.content3 li {
|
font-size: 16px;
|
font-weight: 400;
|
color: #ffffff;
|
/* background-color: rgb(255, 218, 170); */
|
line-height: 26px;
|
text-shadow: 0px 1px 6px rgba(3, 10, 26, 0.5);
|
}
|
|
.tdInfo a {
|
color: #459df9;
|
text-decoration: underline;
|
/* margin-right: 5px; */
|
width: 11px;
|
height: 18px;
|
font-size: 22px;
|
font-family: Source Han Sans SC;
|
font-weight: bold;
|
color: #ebb01e;
|
/* text-shadow: 0px 2px 9px #003f85; */
|
background: linear-gradient(0deg, #ecaa0b 0%, #ffffff 100%);
|
-webkit-background-clip: text;
|
-webkit-text-fill-color: transparent;
|
}
|
|
.aboutDialog /deep/ .el-dialog {
|
background: rgba(14, 50, 143, 0.8);
|
border: 2px solid #205fbc;
|
border-radius: 10px;
|
box-shadow: 0px 1px 10px 0px rgba(3, 10, 26, 0.38);
|
}
|
|
.aboutDialog >>> .el-dialog__body {
|
height: 77%;
|
padding: 0px !important;
|
padding: 15px !important;
|
}
|
|
.aboutDialog >>> .el-dialog__header {
|
padding: 10px 20px;
|
height: 25px;
|
line-height: 25px;
|
font-weight: bold;
|
text-align: left;
|
background: transparent;
|
}
|
|
.aboutDialog >>> .el-dialog__title {
|
color: #fff;
|
font-size: 1.1rem;
|
}
|
|
.aboutDialog >>> .el-dialog__headerbtn .el-dialog__close {
|
color: #fff;
|
}
|
|
.aboutDialog >>> .el-dialog__headerbtn:hover .el-dialog__close {
|
color: #fff;
|
}
|
|
.aboutDialog >>> .el-dialog__headerbtn {
|
top: 13px;
|
}
|
|
.aboutDialog >>> .el-form-item {
|
margin-bottom: 10px;
|
}
|
|
.el-form >>> .el-form-item__label {
|
color: #fff;
|
}
|
|
.aboutDialog .el-dialog-div {
|
height: 60vh;
|
overflow: auto;
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
}
|
|
.el-table {
|
/*font-size: 1rem;*/
|
height: 80% !important;
|
overflow: auto;
|
}
|
|
.el-table thead {
|
font-weight: 500;
|
}
|
|
.el-table__header /deep/ {
|
width: 383px;
|
}
|
|
.el-table /deep/ th {
|
background-color: transparent;
|
}
|
|
.el-table /deep/ tr {
|
background-color: transparent;
|
color: #fff;
|
}
|
|
.el-table::before {
|
border-bottom: none;
|
height: 0;
|
}
|
|
.el-table,
|
.el-table /deep/ .el-table__expanded-cell {
|
background-color: transparent;
|
}
|
|
.el-table /deep/ .el-table__empty-block {
|
background-color: transparent;
|
}
|
|
.el-table /deep/ .el-table__body tr.current-row > td {
|
background-color: transparent;
|
}
|
|
.el-table--enable-row-hover /deep/ .el-table__body tr:hover > td {
|
background-color: rgba(0, 32, 70, 0.7) !important;
|
}
|
|
.el-table__body /deep/ tr.current-row > td {
|
background-color: rgba(0, 32, 70, 0.7) !important;
|
}
|
|
.aboutDialog .el-dialog-div .dialog-footer {
|
}
|
|
.el-pagination {
|
color: #fff;
|
}
|
|
.el-pagination >>> .el-pagination__total,
|
.el-pagination >>> .btn-next,
|
.el-pagination >>> .btn-prev {
|
background: transparent;
|
color: #fff;
|
font-size: 1rem;
|
}
|
|
.el-pagination >>> .el-pager li {
|
line-height: 27px;
|
background-color: transparent;
|
font-size: 1rem;
|
}
|
|
.el-pagination >>> .el-pager li.btn-quicknext,
|
.el-pagination >>> .el-pager li.btn-quickprev {
|
font-size: 1rem;
|
line-height: 28px;
|
color: #fff;
|
}
|
|
.listBox {
|
position: absolute;
|
right: 20px;
|
top: 100px;
|
}
|
|
.listBox .active {
|
background: rgba(255, 166, 0, 0.808);
|
}
|
|
.listBox li {
|
padding: 2px;
|
margin-top: 1px;
|
border-radius: 2px;
|
color: white;
|
background: rgba(14, 50, 143, 0.6);
|
font-size: 14px;
|
cursor: pointer;
|
}
|
|
/* 屏幕分辨率放大为 125 */
|
@media (-webkit-min-device-pixel-ratio: 1.25) {
|
.listBox li {
|
font-size: 12px;
|
}
|
.el-table {
|
font-size: 12px;
|
}
|
}
|
|
.listBox li:hover {
|
background: rgba(255, 166, 0, 0.808);
|
}
|
|
::-webkit-scrollbar {
|
/*滚动条整体样式*/
|
width: 4px;
|
/*高宽分别对应横竖滚动条的尺寸*/
|
height: 4px;
|
scrollbar-arrow-color: red;
|
}
|
|
::-webkit-scrollbar-thumb {
|
border-radius: 5px;
|
-webkit-box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.2);
|
box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.2);
|
background: rgba(255, 255, 255, 0.5);
|
scrollbar-arrow-color: red;
|
}
|
|
::-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>
|
