|
@@ -3,14 +3,14 @@
|
|
|
<div id="cesiumContainer" style="width: 100%; height: 100%;background: none;">
|
|
|
<!--地图top 显示 开始-->
|
|
|
<transition name='fade'>
|
|
|
- <div className="map-tit" v-show="mapshow">
|
|
|
- <div className="top-tit">
|
|
|
- <i className="iconfont sj-icon-jkzx"></i>
|
|
|
- <span><img src="../assets/images/close.svg" @click="mapShow"/></span>
|
|
|
+ <div class="map-tit" v-show="mapshow">
|
|
|
+ <div class="top-tit">
|
|
|
+ <i class="iconfont sj-icon-jkzx"></i>
|
|
|
+ <span><img src="../assets/images/close.svg" @click="mapShow" /></span>
|
|
|
</div>
|
|
|
- <div className="map-txt" v-html="bindPopupHtml">
|
|
|
+ <div class="map-txt" v-html="bindPopupHtml">
|
|
|
</div>
|
|
|
- <div id="super2"/>
|
|
|
+ <div id="super2" />
|
|
|
</div>
|
|
|
</transition>
|
|
|
<!--地图top 显示 结束-->
|
|
@@ -27,7 +27,6 @@ import Cookies from 'js-cookie'
|
|
|
import {
|
|
|
getConfigKey
|
|
|
} from "@/api/system/config";
|
|
|
-
|
|
|
export default {
|
|
|
name: 'supermap-2.5d',
|
|
|
data() {
|
|
@@ -68,7 +67,7 @@ export default {
|
|
|
mapData: null,
|
|
|
mapName: null
|
|
|
},
|
|
|
- showLayer: null,
|
|
|
+ showLayer:null,
|
|
|
clickTime: new Date().getTime(),
|
|
|
cacheData: {
|
|
|
ProvinceRoad: "",
|
|
@@ -201,7 +200,7 @@ export default {
|
|
|
created() {
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.showLayer = this.showLayer != undefined ? this.showLayer : false;
|
|
|
+ this.showLayer = this.showLayer != undefined ? this.showLayer:false;
|
|
|
},
|
|
|
props: {
|
|
|
showLayer: [Boolean],
|
|
@@ -245,18 +244,17 @@ export default {
|
|
|
that.handlerDis = new Cesium.MeasureHandler(that.viewer, Cesium.MeasureMode.Distance, that.clampMode);
|
|
|
that.handlerDis.clampMode = 1;
|
|
|
//注册测距功能事件
|
|
|
- that.handlerDis.measureEvt.addEventListener(function (result) {
|
|
|
+ that.handlerDis.measureEvt.addEventListener(function(result) {
|
|
|
var dis = Number(result.distance);
|
|
|
var selOptV = that.selOptV;
|
|
|
if (selOptV == 3 || selOptV == 4) {
|
|
|
dis = Number(calcClampDistance(positions));
|
|
|
- }
|
|
|
- ;
|
|
|
+ };
|
|
|
var distance = dis > 1000 ? (dis / 1000).toFixed(2) + 'km' : dis.toFixed(2) + 'm';
|
|
|
that.handlerDis.disLabel.text = '距离:' + distance;
|
|
|
|
|
|
});
|
|
|
- that.handlerDis.activeEvt.addEventListener(function (isActive) {
|
|
|
+ that.handlerDis.activeEvt.addEventListener(function(isActive) {
|
|
|
if (isActive == true) {
|
|
|
that.viewer.enableCursorStyle = false;
|
|
|
that.viewer._element.style.cursor = '';
|
|
@@ -282,12 +280,12 @@ export default {
|
|
|
that.handlerArea = new Cesium.MeasureHandler(that.viewer, Cesium.MeasureMode.Area, that.clampMode);
|
|
|
|
|
|
that.handlerArea.clampMode = 1;
|
|
|
- that.handlerArea.measureEvt.addEventListener(function (result) {
|
|
|
+ that.handlerArea.measureEvt.addEventListener(function(result) {
|
|
|
var mj = Number(result.area);
|
|
|
var area = mj > 1000000 ? (mj / 1000000).toFixed(2) + 'km²' : mj.toFixed(2) + '㎡'
|
|
|
that.handlerArea.areaLabel.text = '面积:' + area;
|
|
|
});
|
|
|
- that.handlerArea.activeEvt.addEventListener(function (isActive) {
|
|
|
+ that.handlerArea.activeEvt.addEventListener(function(isActive) {
|
|
|
if (isActive == true) {
|
|
|
that.viewer.enableCursorStyle = false;
|
|
|
that.viewer._element.style.cursor = '';
|
|
@@ -617,9 +615,9 @@ export default {
|
|
|
}
|
|
|
|
|
|
//开始加载专题图等数据,8秒后开始执行
|
|
|
- setTimeout(function () {
|
|
|
- //3.水系
|
|
|
- // let shuixi = that.superMapRootUrl+withinData[2];
|
|
|
+ setTimeout(function() {
|
|
|
+ // 3.水系
|
|
|
+ // let shuixi = that.superMapRootUrl+"/map-mvt-shuixiMian/restjsr/v1/vectortile/maps/shuixi_Mian";
|
|
|
// that.mvtMap0 = that.scene.addVectorTilesMap({
|
|
|
// url: shuixi,
|
|
|
// canvasWidth: 512,
|
|
@@ -629,8 +627,8 @@ export default {
|
|
|
// show:true,
|
|
|
// });
|
|
|
|
|
|
- //4.林地
|
|
|
- // let lindi = that.superMapRootUrl+withinData[3];
|
|
|
+ // //4.林地
|
|
|
+ // let lindi = that.superMapRootUrl+"/map-mvt-lindi/restjsr/v1/vectortile/maps/lindi";
|
|
|
// that.mvtMap1 = that.scene.addVectorTilesMap({
|
|
|
// url: lindi,
|
|
|
// canvasWidth: 512,
|
|
@@ -639,9 +637,9 @@ export default {
|
|
|
// selectedColor:new Cesium.Color(6,254,181,0.5),
|
|
|
// show:true,
|
|
|
// });
|
|
|
-
|
|
|
+ //
|
|
|
//5.农田
|
|
|
- if (that.showLayer) {
|
|
|
+ if(that.showLayer){
|
|
|
let nongtian = that.superMapRootUrl + withinData[4];
|
|
|
that.mvtMap2 = that.scene.addVectorTilesMap({
|
|
|
url: nongtian,
|
|
@@ -694,10 +692,10 @@ export default {
|
|
|
|
|
|
}, 3000);
|
|
|
that.viewer.selectedEntityChanged.addEventListener(function (entity) {
|
|
|
- if (entity != undefined && Reflect.has(entity, 'layerID')) {
|
|
|
- that.queryParams.name = entity.pickResult[entity.layerID][0].feature.properties.Name;
|
|
|
- that.queryParams.mapData = entity.pickResult[entity.layerID][0].feature.properties.SmUserID;
|
|
|
- that.queryParams.mapName = entity.pickResult[entity.layerID][0].feature.properties.layer;
|
|
|
+ if(entity != undefined && Reflect.has(entity,'layerID')){
|
|
|
+ that.queryParams.name = entity.pickResult[entity.layerID][0].feature.properties.Name;
|
|
|
+ that.queryParams.mapData = entity.pickResult[entity.layerID][0].feature.properties.SmUserID;
|
|
|
+ that.queryParams.mapName = entity.pickResult[entity.layerID][0].feature.properties.layer;
|
|
|
getDeviceList(that.queryParams).then(res => {
|
|
|
const treeLabels = [{
|
|
|
"id": null,
|
|
@@ -707,7 +705,7 @@ export default {
|
|
|
"parentLabelCode": ""
|
|
|
}];
|
|
|
const labelChannels = [];
|
|
|
- for (let i in res.data) {
|
|
|
+ for (let i in res.data){
|
|
|
treeLabels.push({
|
|
|
"id": null,
|
|
|
"labelCode": res.data[i].cameraCode,
|
|
@@ -736,7 +734,7 @@ export default {
|
|
|
"labelChannels": labelChannels
|
|
|
}
|
|
|
]
|
|
|
- that.$emit('fatherMethod', dianshiqiang, res.data[0].longitude, res.data[0].latitude, res.data[0].userList);
|
|
|
+ that.$emit('fatherMethod', dianshiqiang,res.data[0].longitude,res.data[0].latitude,res.data[0].userList);
|
|
|
});
|
|
|
}
|
|
|
});
|
|
@@ -776,7 +774,7 @@ export default {
|
|
|
*/
|
|
|
createLeftClickDescription() {
|
|
|
let that = this;
|
|
|
- that.handler.setInputAction(function (movement) {
|
|
|
+ that.handler.setInputAction(function(movement) {
|
|
|
that.pick = that.viewer.scene.pick(movement.position);
|
|
|
if (that.pick && that.pick) {
|
|
|
let id = Cesium.defaultValue(that.viewer.scene.pick(movement.position).id, that.viewer.scene.pick(
|
|
@@ -788,7 +786,7 @@ export default {
|
|
|
that.bindPopupHtml = html
|
|
|
that.mapshow = true
|
|
|
} else if (html == 'cgq') {
|
|
|
- that.timer = setInterval(function () {
|
|
|
+ that.timer = setInterval(function() {
|
|
|
var color = "green";
|
|
|
var value = Math.random();
|
|
|
var up = "▲";
|
|
@@ -817,7 +815,7 @@ export default {
|
|
|
*/
|
|
|
createRightClickDescription() {
|
|
|
let that = this;
|
|
|
- that.handler.setInputAction(function (movement) {
|
|
|
+ that.handler.setInputAction(function(movement) {
|
|
|
that.mapshow = false
|
|
|
if (new Date().getTime() - that.clickTime < 2000) {
|
|
|
return
|
|
@@ -966,7 +964,8 @@ export default {
|
|
|
i {
|
|
|
color: #10ccff;
|
|
|
font-size: 18px;
|
|
|
- text-shadow: 0px 0px 5px #23b3b3;;
|
|
|
+ text-shadow: 0px 0px 5px #23b3b3;
|
|
|
+ ;
|
|
|
}
|
|
|
|
|
|
span img {
|
|
@@ -984,8 +983,7 @@ export default {
|
|
|
line-height: 20px;
|
|
|
font-size: 12px;
|
|
|
|
|
|
- .d-l-con {
|
|
|
- }
|
|
|
+ .d-l-con {}
|
|
|
}
|
|
|
}
|
|
|
|