11111111

@@ -73,15 +73,14 @@ export default class flood {
             116.44515353439972, 39.90683243165845, 10, 
             116.4437677267605, 39.9069642145195, 10
         ]);
+        let geometry = new Cesium.PolygonGeometry({
+            polygonHierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(this.positions2d)),
+            extrudedHeight: targetHeight,
+            height: waterHeight,
+            vertexFormat : Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT
+        });
         this.river = new Cesium.Primitive({
-            geometryInstances : new Cesium.GeometryInstance({
-                geometry :new Cesium.PolygonGeometry({
-                    polygonHierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(this.positions2d)),
-                    extrudedHeight: targetHeight,
-                    height: waterHeight,
-                    vertexFormat : Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT
-                })
-            }),
+            geometryInstances : new Cesium.GeometryInstance({geometry}),
             appearance : new Cesium.EllipsoidSurfaceAppearance({
                 aboveGround : true,
                 material: new Cesium.Material({

 <template>
     <div>
-
         <div id="arcgisMap"></div>
-
     </div>
 </template>
 <script>
@@ -12,42 +10,10 @@
             return {}
         },
         mounted() {
-            loadModules([
-                "esri/Map",
-                "esri/views/MapView",
-                "esri/layers/WebTileLayer",
-                "esri/geometry/Extent",
-                "dojo/domReady!"
-            ]).then(([Map, MapView, WebTileLayer, Extent]) => {
-                this.$parent.mapView = new MapView({
-                    container: "arcgisMap",
-                    map: new Map({
-                        basemap: {
-                            baseLayers: [
-                                new WebTileLayer({
-                                    urlTemplate: "http://mt{subDomain}.google.cn/vt/lyrs=s&hl=zh-CN&gl=CN&x={col}&y={row}&z={level}&s=Gali",
-                                    subDomains: ["0", "1", "2"]
-                                }), 
-                                new WebTileLayer({
-                                    urlTemplate: "http://mt{subDomain}.google.cn/vt/imgtp=png32&lyrs=h@207000000&hl=zh-CN&gl=cn&x={col}&y={row}&z={level}&s=Galil",
-                                    subDomains: ["0", "1", "2"]
-                                })
-                            ]
-                        }
-                    }), 
-                    extent: new Extent({
-                        xmin: 413417,
-                        ymin: 3715140,
-                        xmax: 665512,
-                        ymax: 3902165,
-                        spatialReference: 4545
-                    }), 
-                    zoom: 5
-                });
-            });
+            
         },
         methods: {
-   
+            
         }
     }
 </script>

@@ -42,7 +42,7 @@
             </div>
             <div class="func-input">
                 <span>当前水位</span>
-                <span style="margin-left: 36px;">1263.7米</span>
+                <span style="margin-left: 36px;">{{swsd}}米</span>
             </div>
             <div class="func-btn">
                 <div class="btn-wrapper add-bg" @click="startAnalysis">

 <template>
-    <div class="home">
+    <div class="home" v-loading.fullscreen.lock="isFullscreenLoading">
         <div class="top">
             <TopTitle></TopTitle>
         </div>
@@ -93,7 +93,8 @@
 
         <!-- <threeMap ref="threeMap"></threeMap>
         <arcgisMap ref="arcgisMap"></arcgisMap> -->
-        <component :is="map"></component> <!-- 动态组件-->
+        <component :is="map" ref="maps"></component> <!-- 动态组件-->
+        <div id="arcgisMap" ref="arcgisMap"></div>
 
     </div>
 </template>
@@ -178,8 +179,8 @@
                     'area', 'marker', 'rollerShutter', 'splitScreen', 'toNorth', 
                     'topSee', 'roundSee', 'horizon', 'allSee', 'ymAnslysis', 
                     'tjxAnslysis', 'yyAnslysis', 'visualField', 'kgAnalusis'],
-
                 addProjectMsg: false, // 建设项目信息表
+                isFullscreenLoading: false, // 全屏loading
             }
         },
         mounted() {
@@ -190,10 +191,51 @@
                 this.commons.log(val)
             },
             is2D(flag) {
-                this.map = flag ? 'arcgisMap' : 'threeMap';
+                this.map = flag ? '' : 'threeMap';
+                this.isFullscreenLoading = true;
+                loadModules([
+                    "esri/Map",
+                    "esri/Basemap",
+                    "esri/views/MapView",
+                    "esri/layers/TileLayer",
+                    "esri/layers/WebTileLayer",
+                    "esri/geometry/Extent",
+                    "dojo/domReady!"
+                ]).then(([Map, Basemap, MapView, TileLayer, WebTileLayer, Extent]) => {
+                    if(!this.mapView) {
+                        this.mapView = new MapView({
+                            map: new Map({
+                                basemap: new Basemap({
+                                    baseLayers: [
+                                        new WebTileLayer({
+                                            urlTemplate: "http://mt{subDomain}.google.cn/vt/lyrs=s&hl=zh-CN&gl=CN&x={col}&y={row}&z={level}&s=Gali",
+                                            subDomains: ["0", "1", "2"]
+                                        }), 
+                                        new WebTileLayer({
+                                            urlTemplate: "http://mt{subDomain}.google.cn/vt/imgtp=png32&lyrs=h@207000000&hl=zh-CN&gl=cn&x={col}&y={row}&z={level}&s=Galil",
+                                            subDomains: ["0", "1", "2"]
+                                        })
+                                    ]
+                                })
+                            }), 
+                            container: "arcgisMap",
+                            center: [117.73289858455101, 36.255126757404966],
+                            zoom: 9,
+                        });
+                        this.mapView.when(() => {
+                            this.isFullscreenLoading = false;
+                        }, function(error){
+                            console.log("The view's resources failed to load: ", error);
+                        });  
+                        return;
+                    }
+                    this.isFullscreenLoading = false;
+                    this.mapView.destroy();
+                    this.mapView = undefined;
+                });
             },
             isCamera(flag) {
-                this.commons.log(flag)
+                // this.commons.log(flag)
             },
             isLayer(flag) {
                 this.commons.log(flag)