|
|
@@ -1,4 +1,7 @@
|
|
|
<template>
|
|
|
+ <div id="loading" class="dataLoading" v-if="loading">
|
|
|
+ <span class="loadText">数据加载中...</span>
|
|
|
+ </div>
|
|
|
<div class="mapBox">
|
|
|
<div id="cesiumContainer" style="width: 100%; height: 100vh"></div>
|
|
|
<div :class="!menuComTStyB ? 'menuComTSty' : 'menuComT'" v-if="0">
|
|
|
@@ -124,6 +127,7 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ loading: true,
|
|
|
viewer: null,
|
|
|
windLayer: null, // 风场图
|
|
|
windLayerTimmer: null, // 风场图计时器
|
|
|
@@ -156,6 +160,9 @@ export default {
|
|
|
},
|
|
|
mounted() {
|
|
|
this.initCesium();
|
|
|
+ setTimeout(() =>{
|
|
|
+ this.loading = false
|
|
|
+ }, 1000)
|
|
|
},
|
|
|
methods: {
|
|
|
async initCesium() {
|
|
|
@@ -1280,6 +1287,25 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
+.dataLoading {
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ background: rgba(0, 0, 0, 0.5);
|
|
|
+ z-index: 999;
|
|
|
+ position: fixed;
|
|
|
+ .loadText{
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ background: rgba(255, 255, 255, 0.7);
|
|
|
+ padding: 15px 20px;
|
|
|
+ border-radius: 6px;
|
|
|
+ color: black;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
.mapBox {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
sunzehao