diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue
new file mode 100644
index 0000000..75516da
--- /dev/null
+++ b/src/views/maps/sinkThreat.vue
@@ -0,0 +1,415 @@
+<!--
+ * @Description: 塌陷专题
+ * @Author: 王晓颖
+ * @Date: 2021-04-09
+ -->
+<template>
+  <div id="centerDiv" class="mapcontainer">
+    <!--时钟-->
+    <clock/>
+    <!--天气-->
+    <weather/>
+    <!--选择区-->
+    <select-all-construction @change="selectChange" />
+    <!--统计结果显示-->
+    <div class="label-div">
+      <div class="label">
+        {{ boardData.name | boardNameFilter }}
+      </div>
+      <div class="value">
+        {{ boardData.value }}
+      </div>
+    </div>
+
+    <!--地图-->
+    <Map :url="configUrl" @onload="onMapload" />
+    <div class="map-btn-group">
+      <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
+      <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
+    </div>
+    <!--遮罩-->
+    <div class="mask">航天二院203所</div>
+  </div>
+</template>
+
+<script>
+import Map from '@/components/Map/MarsMap.vue'
+import 'mars3d-heatmap'
+import axios from 'axios'
+import Weather from '@/components/weather/weather'
+import Clock from '@/components/clock/Clock'
+import SelectAllConstruction from './components/selectAllConstruction'
+import SelectButton from '@/components/SelectTool/components/selectButton'
+import { getTimes } from '@/utils/dateutils'
+export default {
+  name: 'SinkThreat',
+  components: {
+    SelectAllConstruction,
+    Weather,
+    Clock,
+    Map,
+    SelectButton
+  },
+  filters: {
+    boardNameFilter(val) {
+      if (val === '全部' || val === '') {
+        return '全省塌陷'
+      } else {
+        return val + '区域塌陷'
+      }
+    }
+  },
+
+  data() {
+    return {
+      map: null, // 地图
+      configUrl: 'static/config/config.json',
+      alpha: 100, // 透明度
+      underground: null, // ？
+      heatShow: true, // 显示热力图
+      stationShow: true, // 显示管理处
+      positionShow: true, // 显示位置
+      boardData: {
+        name: '全部',
+        value: 196
+      }, // 统计版展示数据
+      threatLevel: {
+        '1': 'A级',
+        '2': 'B级',
+        '3': 'C级',
+        '4': '问题'
+      }, // 隐患等级
+      manageStations: [
+        { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' },
+        { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' },
+        { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' },
+        { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' },
+        { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' },
+        { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' },
+        { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' },
+        { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' }
+      ],
+      highConsequenceStation: [
+        { x: 112.73874, y: 37.693689, id: 0, name: '晋中管理处', count: 158 },
+        { x: 111.121552, y: 37.5245, id: 0, name: '吕梁管理处', count: 10 },
+        { x: 112.929902, y: 39.622888, id: 0, name: '同朔管理处', count: 44 },
+        { x: 112.72496, y: 38.415485, id: 0, name: '忻州管理处', count: 9 },
+        { x: 113.58249, y: 37.851892, id: 0, name: '阳泉管理处', count: 21 },
+        { x: 110.980927, y: 35.010828, id: 0, name: '运城管理处', count: 21 },
+        { x: 113.038394, y: 35.850111, id: 0, name: '长晋管理处', count: 11 },
+        { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
+      ],
+      highConsequence: [], // 高后果区列表
+      threatArea: [], // 第三方隐患列表
+      stationLayer: null, // 管理站图层
+      hqaLayer: null, // 塌陷热力图
+      threatLayer: null, // 塌陷分布图层
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
+      graphicLayer: null // 管理站标签图层
+    }
+  },
+  methods: {
+    // 地图构造完成回调
+    onMapload(map) {
+      // 以下为演示代码
+      this.map = map
+      // 背景透明
+      this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
+      this.map._viewer.scene.globe.baseColor.alpha = 0
+      this.addWaterHeat()
+      // 添加管理处
+      this.addStation()
+      this.addStationDiv()
+      // 添加塌陷隐患点
+      this.addThreatPosition()
+    },
+    // 高后果区热力图
+    addWaterHeat() {
+      const { mars3d } = this
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          const hqaLayer = new mars3d.layer.HeatLayer({
+            positions: this.highConsequence.map(item => {
+              return { lng: item['经度'], lat: item['纬度'], value: 1 }
+            }),
+            heatStyle: {
+              radius: 30, // 半径
+              blur: 1 // 模糊因子
+            },
+            // 以下为矩形矢量对象的样式参数
+            style: {
+              opacity: 0.8,
+              clampToGround: false,
+              height: 10000
+            },
+            redrawZoom: true,
+            flyTo: false
+          })
+          this.hqaLayer = hqaLayer
+          this.map.addLayer(hqaLayer)
+        }
+      })
+    },
+    // 塌陷位置
+    addThreatPosition() {
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.threatArea = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.threatArea.length
+          this.addFeatures(this.threatArea)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium, threatLevel } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />村庄地址：' +
+          item['村庄地址'] +
+          '<br />发现人：' +
+          item['发现人'] +
+          '<br />隐患描述：' +
+          item['隐患描述'] +
+          '<br />创建时间：' +
+          item['创建时间'] +
+          '<br />隐患等级：' +
+          threatLevel[item['隐患等级']]
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(item['隐患等级']) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
+    // 管理处
+    addStation() {
+      const { mars3d } = this
+      const stationLayer = new mars3d.layer.ModelLayer({
+        name: '管理处',
+        url: './static/gltf/output/guanlizhan.gltf',
+        style: {
+          scale: 20,
+          heading: 90,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.manageStations.map(item => {
+          return { lng: item.x, lat: item.y, alt: 0 }
+        })
+      })
+      this.stationLayer = stationLayer
+      this.map.addLayer(stationLayer)
+    },
+    // 选框发生变化
+    selectChange({ area, state, time, level }) {
+      area = area === '全部' ? '' : area
+      time = time === '全部' ? '' : time
+      level = level === '全部' ? '' : level
+      // 解析时间
+      let beginTime = ''
+      let endTime = ''
+      if (time) {
+        const result = getTimes(time)
+        beginTime = result.beginDate
+        endTime = result.endDate
+      }
+      this.boardData.name = area
+      // 查询数据
+      let count = 0
+      debugger
+      for (const hca of this.highConsequence) {
+        let flag = true // 标记是否合格
+        // 比较区域
+        if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) {
+          flag = false
+        }
+        // 比较时间
+        if (time) {
+          const real_date = new Date(hca['识别时间'])
+          if (real_date && (real_date < beginTime || real_date > endTime)) {
+            flag = false
+          }
+        }
+        // 比较级别
+        if (level && hca['隐患等级'] && hca['隐患等级'] === level) {
+          flag = false
+        }
+        if (flag) {
+          count++
+        }
+      }
+      this.boardData.value = count
+    },
+    // 自定义的弹窗
+    addStationDiv() {
+      const { Cesium, mars3d } = this
+      const graphicLayer = new mars3d.layer.GraphicLayer()
+      this.graphicLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      for (const station of this.highConsequenceStation) {
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(station.x, station.y, 10100),
+          style: {
+            html: `<div class="divpoint divpoint-theme-29baf1">
+                    <div class="divpoint-wrap">
+                        <div class="area">
+                            <div class="arrow-lt"></div>
+                            <div class="b-t"></div>
+                            <div class="b-r"></div>
+                            <div class="b-b"></div>
+                            <div class="b-l"></div>
+                            <div class="arrow-rb"></div>
+                            <div class="label-wrap">
+                                <div class="title">${station.name}</div>
+                                <div class="label-content">
+                                    <div class="data-li">
+                                        <div class="data-label">塌陷数量：</div>
+                                        <div class="data-value"><span class="label-num">${station.count}</span><span class="label-unit">个</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">经度：</div>
+                                        <div class="data-value"><span class="label-num">${station.x}</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">纬度：</div>
+                                        <div class="data-value"><span class="label-num">${station.y}</span>
+                                        </div>
+                                    </div>
+                                    `,
+            // anchor: [0, 0],
+            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
+            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10000, 500000), // 按视距距离显示
+            scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 500000, 0.1),
+            clampToGround: true,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
+          },
+          pointerEvents: false // false时不允许拾取和触发任意鼠标事件，但可以穿透div缩放地球
+        })
+        graphicLayer.addGraphic(graphic)
+        graphic.testPoint = false // 打开测试点，与DIV点进行对比位置调整css
+      }
+    },
+    // 是否显示热力图
+    showHeat(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.heatShow = false
+        this.map.removeLayer(this.hqaLayer, true)
+      } else {
+        this.heatShow = true
+        this.addWaterHeat()
+      }
+    },
+    // 显示管理处
+    showStation(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.stationShow = false
+        this.map.removeLayer(this.stationLayer, true)
+        this.map.removeLayer(this.graphicLayer, true)
+      } else {
+        this.stationShow = true
+        this.addStation()
+        this.addStationDiv()
+      }
+    },
+    // 显示隐患分布
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .label-div{
+    position: absolute;
+    top: 140px;
+    left:31rem;
+    z-index:100;
+    color: white;
+    padding:2rem 3rem 1.5rem 3rem;
+    background-image: url("../../assets/button_images/board-box1.png");
+    background-size: 100% 100%;
+    .label{
+      margin-bottom: 1rem;
+      font-size:1.2rem;
+    }
+    .value{
+      font-family: DS-DigitalBold;
+      font-size:2.5rem;
+    }
+  }
+  .map-btn-group{
+    position: absolute;
+    bottom:3rem;
+    left:50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: center;
+  }
+</style>
+
+<style rel="stylesheet/scss" lang="scss">
+  /*整个容器*/
+  .mapcontainer {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    background-color: transparent;
+    /*background-color: #051151;*/
+  }
+  /*logo遮罩*/
+  .mask{
+    position: fixed;
+    padding-left:10px;
+    padding-right:10px;
+    bottom:0px;
+    left:0px;
+    background-color:#000000;
+    color:#ffffff;
+    line-height:2
+  }
+
+</style>

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue
new file mode 100644
index 0000000..75516da
--- /dev/null
+++ b/src/views/maps/sinkThreat.vue
@@ -0,0 +1,415 @@
+<!--
+ * @Description: 塌陷专题
+ * @Author: 王晓颖
+ * @Date: 2021-04-09
+ -->
+<template>
+  <div id="centerDiv" class="mapcontainer">
+    <!--时钟-->
+    <clock/>
+    <!--天气-->
+    <weather/>
+    <!--选择区-->
+    <select-all-construction @change="selectChange" />
+    <!--统计结果显示-->
+    <div class="label-div">
+      <div class="label">
+        {{ boardData.name | boardNameFilter }}
+      </div>
+      <div class="value">
+        {{ boardData.value }}
+      </div>
+    </div>
+
+    <!--地图-->
+    <Map :url="configUrl" @onload="onMapload" />
+    <div class="map-btn-group">
+      <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
+      <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
+    </div>
+    <!--遮罩-->
+    <div class="mask">航天二院203所</div>
+  </div>
+</template>
+
+<script>
+import Map from '@/components/Map/MarsMap.vue'
+import 'mars3d-heatmap'
+import axios from 'axios'
+import Weather from '@/components/weather/weather'
+import Clock from '@/components/clock/Clock'
+import SelectAllConstruction from './components/selectAllConstruction'
+import SelectButton from '@/components/SelectTool/components/selectButton'
+import { getTimes } from '@/utils/dateutils'
+export default {
+  name: 'SinkThreat',
+  components: {
+    SelectAllConstruction,
+    Weather,
+    Clock,
+    Map,
+    SelectButton
+  },
+  filters: {
+    boardNameFilter(val) {
+      if (val === '全部' || val === '') {
+        return '全省塌陷'
+      } else {
+        return val + '区域塌陷'
+      }
+    }
+  },
+
+  data() {
+    return {
+      map: null, // 地图
+      configUrl: 'static/config/config.json',
+      alpha: 100, // 透明度
+      underground: null, // ？
+      heatShow: true, // 显示热力图
+      stationShow: true, // 显示管理处
+      positionShow: true, // 显示位置
+      boardData: {
+        name: '全部',
+        value: 196
+      }, // 统计版展示数据
+      threatLevel: {
+        '1': 'A级',
+        '2': 'B级',
+        '3': 'C级',
+        '4': '问题'
+      }, // 隐患等级
+      manageStations: [
+        { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' },
+        { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' },
+        { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' },
+        { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' },
+        { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' },
+        { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' },
+        { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' },
+        { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' }
+      ],
+      highConsequenceStation: [
+        { x: 112.73874, y: 37.693689, id: 0, name: '晋中管理处', count: 158 },
+        { x: 111.121552, y: 37.5245, id: 0, name: '吕梁管理处', count: 10 },
+        { x: 112.929902, y: 39.622888, id: 0, name: '同朔管理处', count: 44 },
+        { x: 112.72496, y: 38.415485, id: 0, name: '忻州管理处', count: 9 },
+        { x: 113.58249, y: 37.851892, id: 0, name: '阳泉管理处', count: 21 },
+        { x: 110.980927, y: 35.010828, id: 0, name: '运城管理处', count: 21 },
+        { x: 113.038394, y: 35.850111, id: 0, name: '长晋管理处', count: 11 },
+        { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
+      ],
+      highConsequence: [], // 高后果区列表
+      threatArea: [], // 第三方隐患列表
+      stationLayer: null, // 管理站图层
+      hqaLayer: null, // 塌陷热力图
+      threatLayer: null, // 塌陷分布图层
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
+      graphicLayer: null // 管理站标签图层
+    }
+  },
+  methods: {
+    // 地图构造完成回调
+    onMapload(map) {
+      // 以下为演示代码
+      this.map = map
+      // 背景透明
+      this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
+      this.map._viewer.scene.globe.baseColor.alpha = 0
+      this.addWaterHeat()
+      // 添加管理处
+      this.addStation()
+      this.addStationDiv()
+      // 添加塌陷隐患点
+      this.addThreatPosition()
+    },
+    // 高后果区热力图
+    addWaterHeat() {
+      const { mars3d } = this
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          const hqaLayer = new mars3d.layer.HeatLayer({
+            positions: this.highConsequence.map(item => {
+              return { lng: item['经度'], lat: item['纬度'], value: 1 }
+            }),
+            heatStyle: {
+              radius: 30, // 半径
+              blur: 1 // 模糊因子
+            },
+            // 以下为矩形矢量对象的样式参数
+            style: {
+              opacity: 0.8,
+              clampToGround: false,
+              height: 10000
+            },
+            redrawZoom: true,
+            flyTo: false
+          })
+          this.hqaLayer = hqaLayer
+          this.map.addLayer(hqaLayer)
+        }
+      })
+    },
+    // 塌陷位置
+    addThreatPosition() {
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.threatArea = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.threatArea.length
+          this.addFeatures(this.threatArea)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium, threatLevel } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />村庄地址：' +
+          item['村庄地址'] +
+          '<br />发现人：' +
+          item['发现人'] +
+          '<br />隐患描述：' +
+          item['隐患描述'] +
+          '<br />创建时间：' +
+          item['创建时间'] +
+          '<br />隐患等级：' +
+          threatLevel[item['隐患等级']]
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(item['隐患等级']) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
+    // 管理处
+    addStation() {
+      const { mars3d } = this
+      const stationLayer = new mars3d.layer.ModelLayer({
+        name: '管理处',
+        url: './static/gltf/output/guanlizhan.gltf',
+        style: {
+          scale: 20,
+          heading: 90,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.manageStations.map(item => {
+          return { lng: item.x, lat: item.y, alt: 0 }
+        })
+      })
+      this.stationLayer = stationLayer
+      this.map.addLayer(stationLayer)
+    },
+    // 选框发生变化
+    selectChange({ area, state, time, level }) {
+      area = area === '全部' ? '' : area
+      time = time === '全部' ? '' : time
+      level = level === '全部' ? '' : level
+      // 解析时间
+      let beginTime = ''
+      let endTime = ''
+      if (time) {
+        const result = getTimes(time)
+        beginTime = result.beginDate
+        endTime = result.endDate
+      }
+      this.boardData.name = area
+      // 查询数据
+      let count = 0
+      debugger
+      for (const hca of this.highConsequence) {
+        let flag = true // 标记是否合格
+        // 比较区域
+        if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) {
+          flag = false
+        }
+        // 比较时间
+        if (time) {
+          const real_date = new Date(hca['识别时间'])
+          if (real_date && (real_date < beginTime || real_date > endTime)) {
+            flag = false
+          }
+        }
+        // 比较级别
+        if (level && hca['隐患等级'] && hca['隐患等级'] === level) {
+          flag = false
+        }
+        if (flag) {
+          count++
+        }
+      }
+      this.boardData.value = count
+    },
+    // 自定义的弹窗
+    addStationDiv() {
+      const { Cesium, mars3d } = this
+      const graphicLayer = new mars3d.layer.GraphicLayer()
+      this.graphicLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      for (const station of this.highConsequenceStation) {
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(station.x, station.y, 10100),
+          style: {
+            html: `<div class="divpoint divpoint-theme-29baf1">
+                    <div class="divpoint-wrap">
+                        <div class="area">
+                            <div class="arrow-lt"></div>
+                            <div class="b-t"></div>
+                            <div class="b-r"></div>
+                            <div class="b-b"></div>
+                            <div class="b-l"></div>
+                            <div class="arrow-rb"></div>
+                            <div class="label-wrap">
+                                <div class="title">${station.name}</div>
+                                <div class="label-content">
+                                    <div class="data-li">
+                                        <div class="data-label">塌陷数量：</div>
+                                        <div class="data-value"><span class="label-num">${station.count}</span><span class="label-unit">个</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">经度：</div>
+                                        <div class="data-value"><span class="label-num">${station.x}</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">纬度：</div>
+                                        <div class="data-value"><span class="label-num">${station.y}</span>
+                                        </div>
+                                    </div>
+                                    `,
+            // anchor: [0, 0],
+            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
+            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10000, 500000), // 按视距距离显示
+            scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 500000, 0.1),
+            clampToGround: true,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
+          },
+          pointerEvents: false // false时不允许拾取和触发任意鼠标事件，但可以穿透div缩放地球
+        })
+        graphicLayer.addGraphic(graphic)
+        graphic.testPoint = false // 打开测试点，与DIV点进行对比位置调整css
+      }
+    },
+    // 是否显示热力图
+    showHeat(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.heatShow = false
+        this.map.removeLayer(this.hqaLayer, true)
+      } else {
+        this.heatShow = true
+        this.addWaterHeat()
+      }
+    },
+    // 显示管理处
+    showStation(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.stationShow = false
+        this.map.removeLayer(this.stationLayer, true)
+        this.map.removeLayer(this.graphicLayer, true)
+      } else {
+        this.stationShow = true
+        this.addStation()
+        this.addStationDiv()
+      }
+    },
+    // 显示隐患分布
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .label-div{
+    position: absolute;
+    top: 140px;
+    left:31rem;
+    z-index:100;
+    color: white;
+    padding:2rem 3rem 1.5rem 3rem;
+    background-image: url("../../assets/button_images/board-box1.png");
+    background-size: 100% 100%;
+    .label{
+      margin-bottom: 1rem;
+      font-size:1.2rem;
+    }
+    .value{
+      font-family: DS-DigitalBold;
+      font-size:2.5rem;
+    }
+  }
+  .map-btn-group{
+    position: absolute;
+    bottom:3rem;
+    left:50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: center;
+  }
+</style>
+
+<style rel="stylesheet/scss" lang="scss">
+  /*整个容器*/
+  .mapcontainer {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    background-color: transparent;
+    /*background-color: #051151;*/
+  }
+  /*logo遮罩*/
+  .mask{
+    position: fixed;
+    padding-left:10px;
+    padding-right:10px;
+    bottom:0px;
+    left:0px;
+    background-color:#000000;
+    color:#ffffff;
+    line-height:2
+  }
+
+</style>
diff --git a/src/views/maps/storageTopic.vue b/src/views/maps/storageTopic.vue
index fc01f51..8b6cfc0 100644
--- a/src/views/maps/storageTopic.vue
+++ b/src/views/maps/storageTopic.vue
@@ -10,7 +10,7 @@
     <!--天气-->
     <weather/>
     <!--选择区-->
-    <select-all-storage @change="selectChange" />
+    <!--<select-all-storage @change="selectChange" />-->
     <!--统计结果显示-->
     <div class="label-container">
       <div class="label-div">
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import 'mars3d-echarts'
 import Map from '@/components/Map/MarsMap.vue'
 import 'mars3d-heatmap'
 import axios from 'axios'
@@ -51,7 +52,7 @@
 import SelectAllStorage from './components/selectAllStorage'
 import SelectButton from '@/components/SelectTool/components/selectButton'
 export default {
-  name: 'Index',
+  name: 'StorageTopic',
   components: {
     SelectAllStorage,
     Weather,
@@ -74,9 +75,8 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      factoryShow: true, // 显示液化工厂
-      gasStationShow: true, // 显示加气站
-      positionShow: true, // 显示位置
+      factoryShow: false, // 显示液化工厂
+      // gasStationShow: false, // 显示加气站
       factoryStorageShow: true, // 液化工厂储量
       stationStorageShow: false, // 加气站储量
       liquidFactoryData: {
@@ -89,9 +89,11 @@
       }, // 统计版展示数据
       liquidFactory: [], // 液化工厂数据
       gasStation: [], // 加气站
-      stationLayer: null, // 管理站图层
       factoryStorageLayer: null, // 液化工厂分布图层
       stationStorageLayer: null, // 加气站存储层
+      factoryModelLayer: null, // 液化工厂模型层
+      stationModelLayer: null, // 加气站模型层
+      factoryLineLayer: null, // 飞线层
       pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       graphicLayer: null // 管理站标签图层
 
@@ -105,10 +107,10 @@
       // 背景透明
       this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
       this.map._viewer.scene.globe.baseColor.alpha = 0
-      this.addFactoryPosition()
+      this.addFactoryStorage()
     },
-    // 液化工厂位置
-    addFactoryPosition() {
+    // 液化工厂储量效果图
+    addFactoryStorage() {
       axios.get('static/config/liquidFactory.json').then((res) => {
         res = res.data
         if (res.code === 200) {
@@ -121,10 +123,164 @@
           // 添加点位
           this.addFeatures(this.liquidFactory, 'liquidFactory')
           // this.addFeatures(this.gasStation, 'gasStation')
+          // this.addFactoryPosition()
         }
       })
     },
-    // 添加隐患点储量柱状图
+    // 液化工厂三维模型
+    addFactoryModel() {
+      const { mars3d } = this
+      const factoryModelLayer = new mars3d.layer.ModelLayer({
+        name: '液化工厂',
+        url: './static/gltf/output/yehuagongchang.gltf',
+        style: {
+          scale: 20,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.liquidFactory.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.factoryModelLayer = factoryModelLayer
+      this.map.addLayer(factoryModelLayer)
+    },
+    addStationModel() {
+      const { mars3d } = this
+      const stationModelLayer = new mars3d.layer.ModelLayer({
+        name: '加气站',
+        url: './static/gltf/output/jiaqizhan.gltf',
+        style: {
+          scale: 10,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.gasStation.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.stationModelLayer = stationModelLayer
+      this.map.addLayer(stationModelLayer)
+    },
+    // 液化工厂和加气站位置飞线
+    addFactoryPosition() {
+      this.addFactoryModel() // 添加液化工厂三维模型
+      // this.addStationModel() // 添加加气站三维模型
+      const lineColor = ['#f6fb05', '#f6fb05', '#00fcff']
+      // 城市点位图标
+      const symbol1 = 'image://static/images/map/symbol2.png'
+      const symbol2 = 'image://static/images/map/symbol1.png'
+      // 线上的动态运动点图标
+      var pointSymbol = 'image://static/images/map/linePoint1.png'
+      // 工厂加symbol
+      const factorys = this.liquidFactory.map(item => {
+        return { ...item, symbol: symbol1 }
+      })
+      // 加气站加symbol
+      const stations = this.gasStation.map(item => {
+        return { ...item, symbol: symbol2 }
+      })
+      // 遍历获取关联关系
+      const lineArr = []
+      for (const station of stations) {
+        if (station.belong && station.value[0] !== '0') {
+          for (const factory of factorys) {
+            if (station.belong === factory.name && factory.value[0] !== '0') {
+              lineArr.push([
+                { coord: [parseFloat(factory.value[0]), parseFloat(factory.value[1])] },
+                { coord: [parseFloat(station.value[0]), parseFloat(station.value[1])] }
+              ])
+              break
+            }
+          }
+        }
+      }
+      const curveness = 0.5
+      var seriesZero = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [20, 20],
+          symbolOffset: [0, -10],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: factorys
+        }
+      ]
+      var seriesOne = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [16, 16],
+          symbolOffset: [0, -8],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          // label: {
+          //   normal: {
+          //     show: true,
+          //     position: 'bottom',
+          //     formatter: '{b}',
+          //     fontSize: 12,
+          //     color: '#fff',
+          //     textBorderColor: '#2aa4e8',
+          //     offset: [0, 20]
+          //   }
+          // },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: stations
+        }
+      ]
+      var seriesThree = [
+        {
+          name: '',
+          type: 'lines',
+          coordinateSystem: 'GLMap',
+          zlevel: 1,
+          blendMode: 'lighter',
+          effect: {
+            show: true,
+            smooth: false,
+            trailLength: 0,
+            symbol: pointSymbol,
+            symbolSize: [10, 30],
+            period: 4
+          },
+          lineStyle: {
+            width: 2,
+            color: lineColor[0],
+            curveness: curveness
+          },
+          data: lineArr
+        }
+      ]
+      var seriesData = [...seriesZero, ...seriesThree]
+      const option = {
+        animation: false,
+        GLMap: {},
+        series: seriesData
+      }
+      var echartsLayer = new this.mars3d.layer.EchartsLayer(option)
+      this.factoryLineLayer = echartsLayer
+      this.map.addLayer(echartsLayer)
+    },
+    // 添加点位储量柱状图
     addFeatures(arr, type) {
       const { mars3d } = this
       const colorList = ['#d71345', '#f15a22', '#f47920', '#f47920', '#fcaf17', '#fcaf17', '#63AEFF', '#63AEFF', '#1d953f', '#1d953f']
@@ -238,7 +394,6 @@
       // 现在正在显示
       if (show) { // 移除
         this.stationStorageShow = false
-        console.log(this.stationStorageLayer)
         this.map.removeLayer(this.stationStorageLayer, true)
       } else {
         this.stationStorageShow = true
@@ -247,13 +402,15 @@
     },
     // 显示隐患分布
     showPosition(show) {
-      // if (show) { // 移除
-      //   this.positionShow = false
-      //   this.map.removeLayer(this.threatLayer, true)
-      // } else {
-      //   this.positionShow = true
-      //   this.addThreatPosition()
-      // }
+      if (show) { // 移除
+        this.factoryShow = false
+        this.map.removeLayer(this.factoryModelLayer, true)
+        // this.map.removeLayer(this.stationModelLayer, true)
+        this.map.removeLayer(this.factoryLineLayer, true)
+      } else {
+        this.factoryShow = true
+        this.addFactoryPosition()
+      }
     }
   }
 }
@@ -262,7 +419,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-container{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     .label-div{

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue
new file mode 100644
index 0000000..75516da
--- /dev/null
+++ b/src/views/maps/sinkThreat.vue
@@ -0,0 +1,415 @@
+<!--
+ * @Description: 塌陷专题
+ * @Author: 王晓颖
+ * @Date: 2021-04-09
+ -->
+<template>
+  <div id="centerDiv" class="mapcontainer">
+    <!--时钟-->
+    <clock/>
+    <!--天气-->
+    <weather/>
+    <!--选择区-->
+    <select-all-construction @change="selectChange" />
+    <!--统计结果显示-->
+    <div class="label-div">
+      <div class="label">
+        {{ boardData.name | boardNameFilter }}
+      </div>
+      <div class="value">
+        {{ boardData.value }}
+      </div>
+    </div>
+
+    <!--地图-->
+    <Map :url="configUrl" @onload="onMapload" />
+    <div class="map-btn-group">
+      <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
+      <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
+    </div>
+    <!--遮罩-->
+    <div class="mask">航天二院203所</div>
+  </div>
+</template>
+
+<script>
+import Map from '@/components/Map/MarsMap.vue'
+import 'mars3d-heatmap'
+import axios from 'axios'
+import Weather from '@/components/weather/weather'
+import Clock from '@/components/clock/Clock'
+import SelectAllConstruction from './components/selectAllConstruction'
+import SelectButton from '@/components/SelectTool/components/selectButton'
+import { getTimes } from '@/utils/dateutils'
+export default {
+  name: 'SinkThreat',
+  components: {
+    SelectAllConstruction,
+    Weather,
+    Clock,
+    Map,
+    SelectButton
+  },
+  filters: {
+    boardNameFilter(val) {
+      if (val === '全部' || val === '') {
+        return '全省塌陷'
+      } else {
+        return val + '区域塌陷'
+      }
+    }
+  },
+
+  data() {
+    return {
+      map: null, // 地图
+      configUrl: 'static/config/config.json',
+      alpha: 100, // 透明度
+      underground: null, // ？
+      heatShow: true, // 显示热力图
+      stationShow: true, // 显示管理处
+      positionShow: true, // 显示位置
+      boardData: {
+        name: '全部',
+        value: 196
+      }, // 统计版展示数据
+      threatLevel: {
+        '1': 'A级',
+        '2': 'B级',
+        '3': 'C级',
+        '4': '问题'
+      }, // 隐患等级
+      manageStations: [
+        { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' },
+        { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' },
+        { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' },
+        { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' },
+        { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' },
+        { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' },
+        { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' },
+        { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' }
+      ],
+      highConsequenceStation: [
+        { x: 112.73874, y: 37.693689, id: 0, name: '晋中管理处', count: 158 },
+        { x: 111.121552, y: 37.5245, id: 0, name: '吕梁管理处', count: 10 },
+        { x: 112.929902, y: 39.622888, id: 0, name: '同朔管理处', count: 44 },
+        { x: 112.72496, y: 38.415485, id: 0, name: '忻州管理处', count: 9 },
+        { x: 113.58249, y: 37.851892, id: 0, name: '阳泉管理处', count: 21 },
+        { x: 110.980927, y: 35.010828, id: 0, name: '运城管理处', count: 21 },
+        { x: 113.038394, y: 35.850111, id: 0, name: '长晋管理处', count: 11 },
+        { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
+      ],
+      highConsequence: [], // 高后果区列表
+      threatArea: [], // 第三方隐患列表
+      stationLayer: null, // 管理站图层
+      hqaLayer: null, // 塌陷热力图
+      threatLayer: null, // 塌陷分布图层
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
+      graphicLayer: null // 管理站标签图层
+    }
+  },
+  methods: {
+    // 地图构造完成回调
+    onMapload(map) {
+      // 以下为演示代码
+      this.map = map
+      // 背景透明
+      this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
+      this.map._viewer.scene.globe.baseColor.alpha = 0
+      this.addWaterHeat()
+      // 添加管理处
+      this.addStation()
+      this.addStationDiv()
+      // 添加塌陷隐患点
+      this.addThreatPosition()
+    },
+    // 高后果区热力图
+    addWaterHeat() {
+      const { mars3d } = this
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          const hqaLayer = new mars3d.layer.HeatLayer({
+            positions: this.highConsequence.map(item => {
+              return { lng: item['经度'], lat: item['纬度'], value: 1 }
+            }),
+            heatStyle: {
+              radius: 30, // 半径
+              blur: 1 // 模糊因子
+            },
+            // 以下为矩形矢量对象的样式参数
+            style: {
+              opacity: 0.8,
+              clampToGround: false,
+              height: 10000
+            },
+            redrawZoom: true,
+            flyTo: false
+          })
+          this.hqaLayer = hqaLayer
+          this.map.addLayer(hqaLayer)
+        }
+      })
+    },
+    // 塌陷位置
+    addThreatPosition() {
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.threatArea = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.threatArea.length
+          this.addFeatures(this.threatArea)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium, threatLevel } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />村庄地址：' +
+          item['村庄地址'] +
+          '<br />发现人：' +
+          item['发现人'] +
+          '<br />隐患描述：' +
+          item['隐患描述'] +
+          '<br />创建时间：' +
+          item['创建时间'] +
+          '<br />隐患等级：' +
+          threatLevel[item['隐患等级']]
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(item['隐患等级']) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
+    // 管理处
+    addStation() {
+      const { mars3d } = this
+      const stationLayer = new mars3d.layer.ModelLayer({
+        name: '管理处',
+        url: './static/gltf/output/guanlizhan.gltf',
+        style: {
+          scale: 20,
+          heading: 90,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.manageStations.map(item => {
+          return { lng: item.x, lat: item.y, alt: 0 }
+        })
+      })
+      this.stationLayer = stationLayer
+      this.map.addLayer(stationLayer)
+    },
+    // 选框发生变化
+    selectChange({ area, state, time, level }) {
+      area = area === '全部' ? '' : area
+      time = time === '全部' ? '' : time
+      level = level === '全部' ? '' : level
+      // 解析时间
+      let beginTime = ''
+      let endTime = ''
+      if (time) {
+        const result = getTimes(time)
+        beginTime = result.beginDate
+        endTime = result.endDate
+      }
+      this.boardData.name = area
+      // 查询数据
+      let count = 0
+      debugger
+      for (const hca of this.highConsequence) {
+        let flag = true // 标记是否合格
+        // 比较区域
+        if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) {
+          flag = false
+        }
+        // 比较时间
+        if (time) {
+          const real_date = new Date(hca['识别时间'])
+          if (real_date && (real_date < beginTime || real_date > endTime)) {
+            flag = false
+          }
+        }
+        // 比较级别
+        if (level && hca['隐患等级'] && hca['隐患等级'] === level) {
+          flag = false
+        }
+        if (flag) {
+          count++
+        }
+      }
+      this.boardData.value = count
+    },
+    // 自定义的弹窗
+    addStationDiv() {
+      const { Cesium, mars3d } = this
+      const graphicLayer = new mars3d.layer.GraphicLayer()
+      this.graphicLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      for (const station of this.highConsequenceStation) {
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(station.x, station.y, 10100),
+          style: {
+            html: `<div class="divpoint divpoint-theme-29baf1">
+                    <div class="divpoint-wrap">
+                        <div class="area">
+                            <div class="arrow-lt"></div>
+                            <div class="b-t"></div>
+                            <div class="b-r"></div>
+                            <div class="b-b"></div>
+                            <div class="b-l"></div>
+                            <div class="arrow-rb"></div>
+                            <div class="label-wrap">
+                                <div class="title">${station.name}</div>
+                                <div class="label-content">
+                                    <div class="data-li">
+                                        <div class="data-label">塌陷数量：</div>
+                                        <div class="data-value"><span class="label-num">${station.count}</span><span class="label-unit">个</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">经度：</div>
+                                        <div class="data-value"><span class="label-num">${station.x}</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">纬度：</div>
+                                        <div class="data-value"><span class="label-num">${station.y}</span>
+                                        </div>
+                                    </div>
+                                    `,
+            // anchor: [0, 0],
+            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
+            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10000, 500000), // 按视距距离显示
+            scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 500000, 0.1),
+            clampToGround: true,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
+          },
+          pointerEvents: false // false时不允许拾取和触发任意鼠标事件，但可以穿透div缩放地球
+        })
+        graphicLayer.addGraphic(graphic)
+        graphic.testPoint = false // 打开测试点，与DIV点进行对比位置调整css
+      }
+    },
+    // 是否显示热力图
+    showHeat(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.heatShow = false
+        this.map.removeLayer(this.hqaLayer, true)
+      } else {
+        this.heatShow = true
+        this.addWaterHeat()
+      }
+    },
+    // 显示管理处
+    showStation(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.stationShow = false
+        this.map.removeLayer(this.stationLayer, true)
+        this.map.removeLayer(this.graphicLayer, true)
+      } else {
+        this.stationShow = true
+        this.addStation()
+        this.addStationDiv()
+      }
+    },
+    // 显示隐患分布
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .label-div{
+    position: absolute;
+    top: 140px;
+    left:31rem;
+    z-index:100;
+    color: white;
+    padding:2rem 3rem 1.5rem 3rem;
+    background-image: url("../../assets/button_images/board-box1.png");
+    background-size: 100% 100%;
+    .label{
+      margin-bottom: 1rem;
+      font-size:1.2rem;
+    }
+    .value{
+      font-family: DS-DigitalBold;
+      font-size:2.5rem;
+    }
+  }
+  .map-btn-group{
+    position: absolute;
+    bottom:3rem;
+    left:50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: center;
+  }
+</style>
+
+<style rel="stylesheet/scss" lang="scss">
+  /*整个容器*/
+  .mapcontainer {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    background-color: transparent;
+    /*background-color: #051151;*/
+  }
+  /*logo遮罩*/
+  .mask{
+    position: fixed;
+    padding-left:10px;
+    padding-right:10px;
+    bottom:0px;
+    left:0px;
+    background-color:#000000;
+    color:#ffffff;
+    line-height:2
+  }
+
+</style>
diff --git a/src/views/maps/storageTopic.vue b/src/views/maps/storageTopic.vue
index fc01f51..8b6cfc0 100644
--- a/src/views/maps/storageTopic.vue
+++ b/src/views/maps/storageTopic.vue
@@ -10,7 +10,7 @@
     <!--天气-->
     <weather/>
     <!--选择区-->
-    <select-all-storage @change="selectChange" />
+    <!--<select-all-storage @change="selectChange" />-->
     <!--统计结果显示-->
     <div class="label-container">
       <div class="label-div">
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import 'mars3d-echarts'
 import Map from '@/components/Map/MarsMap.vue'
 import 'mars3d-heatmap'
 import axios from 'axios'
@@ -51,7 +52,7 @@
 import SelectAllStorage from './components/selectAllStorage'
 import SelectButton from '@/components/SelectTool/components/selectButton'
 export default {
-  name: 'Index',
+  name: 'StorageTopic',
   components: {
     SelectAllStorage,
     Weather,
@@ -74,9 +75,8 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      factoryShow: true, // 显示液化工厂
-      gasStationShow: true, // 显示加气站
-      positionShow: true, // 显示位置
+      factoryShow: false, // 显示液化工厂
+      // gasStationShow: false, // 显示加气站
       factoryStorageShow: true, // 液化工厂储量
       stationStorageShow: false, // 加气站储量
       liquidFactoryData: {
@@ -89,9 +89,11 @@
       }, // 统计版展示数据
       liquidFactory: [], // 液化工厂数据
       gasStation: [], // 加气站
-      stationLayer: null, // 管理站图层
       factoryStorageLayer: null, // 液化工厂分布图层
       stationStorageLayer: null, // 加气站存储层
+      factoryModelLayer: null, // 液化工厂模型层
+      stationModelLayer: null, // 加气站模型层
+      factoryLineLayer: null, // 飞线层
       pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       graphicLayer: null // 管理站标签图层
 
@@ -105,10 +107,10 @@
       // 背景透明
       this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
       this.map._viewer.scene.globe.baseColor.alpha = 0
-      this.addFactoryPosition()
+      this.addFactoryStorage()
     },
-    // 液化工厂位置
-    addFactoryPosition() {
+    // 液化工厂储量效果图
+    addFactoryStorage() {
       axios.get('static/config/liquidFactory.json').then((res) => {
         res = res.data
         if (res.code === 200) {
@@ -121,10 +123,164 @@
           // 添加点位
           this.addFeatures(this.liquidFactory, 'liquidFactory')
           // this.addFeatures(this.gasStation, 'gasStation')
+          // this.addFactoryPosition()
         }
       })
     },
-    // 添加隐患点储量柱状图
+    // 液化工厂三维模型
+    addFactoryModel() {
+      const { mars3d } = this
+      const factoryModelLayer = new mars3d.layer.ModelLayer({
+        name: '液化工厂',
+        url: './static/gltf/output/yehuagongchang.gltf',
+        style: {
+          scale: 20,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.liquidFactory.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.factoryModelLayer = factoryModelLayer
+      this.map.addLayer(factoryModelLayer)
+    },
+    addStationModel() {
+      const { mars3d } = this
+      const stationModelLayer = new mars3d.layer.ModelLayer({
+        name: '加气站',
+        url: './static/gltf/output/jiaqizhan.gltf',
+        style: {
+          scale: 10,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.gasStation.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.stationModelLayer = stationModelLayer
+      this.map.addLayer(stationModelLayer)
+    },
+    // 液化工厂和加气站位置飞线
+    addFactoryPosition() {
+      this.addFactoryModel() // 添加液化工厂三维模型
+      // this.addStationModel() // 添加加气站三维模型
+      const lineColor = ['#f6fb05', '#f6fb05', '#00fcff']
+      // 城市点位图标
+      const symbol1 = 'image://static/images/map/symbol2.png'
+      const symbol2 = 'image://static/images/map/symbol1.png'
+      // 线上的动态运动点图标
+      var pointSymbol = 'image://static/images/map/linePoint1.png'
+      // 工厂加symbol
+      const factorys = this.liquidFactory.map(item => {
+        return { ...item, symbol: symbol1 }
+      })
+      // 加气站加symbol
+      const stations = this.gasStation.map(item => {
+        return { ...item, symbol: symbol2 }
+      })
+      // 遍历获取关联关系
+      const lineArr = []
+      for (const station of stations) {
+        if (station.belong && station.value[0] !== '0') {
+          for (const factory of factorys) {
+            if (station.belong === factory.name && factory.value[0] !== '0') {
+              lineArr.push([
+                { coord: [parseFloat(factory.value[0]), parseFloat(factory.value[1])] },
+                { coord: [parseFloat(station.value[0]), parseFloat(station.value[1])] }
+              ])
+              break
+            }
+          }
+        }
+      }
+      const curveness = 0.5
+      var seriesZero = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [20, 20],
+          symbolOffset: [0, -10],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: factorys
+        }
+      ]
+      var seriesOne = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [16, 16],
+          symbolOffset: [0, -8],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          // label: {
+          //   normal: {
+          //     show: true,
+          //     position: 'bottom',
+          //     formatter: '{b}',
+          //     fontSize: 12,
+          //     color: '#fff',
+          //     textBorderColor: '#2aa4e8',
+          //     offset: [0, 20]
+          //   }
+          // },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: stations
+        }
+      ]
+      var seriesThree = [
+        {
+          name: '',
+          type: 'lines',
+          coordinateSystem: 'GLMap',
+          zlevel: 1,
+          blendMode: 'lighter',
+          effect: {
+            show: true,
+            smooth: false,
+            trailLength: 0,
+            symbol: pointSymbol,
+            symbolSize: [10, 30],
+            period: 4
+          },
+          lineStyle: {
+            width: 2,
+            color: lineColor[0],
+            curveness: curveness
+          },
+          data: lineArr
+        }
+      ]
+      var seriesData = [...seriesZero, ...seriesThree]
+      const option = {
+        animation: false,
+        GLMap: {},
+        series: seriesData
+      }
+      var echartsLayer = new this.mars3d.layer.EchartsLayer(option)
+      this.factoryLineLayer = echartsLayer
+      this.map.addLayer(echartsLayer)
+    },
+    // 添加点位储量柱状图
     addFeatures(arr, type) {
       const { mars3d } = this
       const colorList = ['#d71345', '#f15a22', '#f47920', '#f47920', '#fcaf17', '#fcaf17', '#63AEFF', '#63AEFF', '#1d953f', '#1d953f']
@@ -238,7 +394,6 @@
       // 现在正在显示
       if (show) { // 移除
         this.stationStorageShow = false
-        console.log(this.stationStorageLayer)
         this.map.removeLayer(this.stationStorageLayer, true)
       } else {
         this.stationStorageShow = true
@@ -247,13 +402,15 @@
     },
     // 显示隐患分布
     showPosition(show) {
-      // if (show) { // 移除
-      //   this.positionShow = false
-      //   this.map.removeLayer(this.threatLayer, true)
-      // } else {
-      //   this.positionShow = true
-      //   this.addThreatPosition()
-      // }
+      if (show) { // 移除
+        this.factoryShow = false
+        this.map.removeLayer(this.factoryModelLayer, true)
+        // this.map.removeLayer(this.stationModelLayer, true)
+        this.map.removeLayer(this.factoryLineLayer, true)
+      } else {
+        this.factoryShow = true
+        this.addFactoryPosition()
+      }
     }
   }
 }
@@ -262,7 +419,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-container{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     .label-div{
diff --git a/src/views/maps/waterThreat.vue b/src/views/maps/waterThreat.vue
index 1db2b84..8070d15 100644
--- a/src/views/maps/waterThreat.vue
+++ b/src/views/maps/waterThreat.vue
@@ -43,7 +43,7 @@
 import SelectButton from '@/components/SelectTool/components/selectButton'
 import { getTimes } from '@/utils/dateutils'
 export default {
-  name: 'Index',
+  name: 'WaterThreat',
   components: {
     SelectAllConstruction,
     Weather,
@@ -218,8 +218,7 @@
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/output/jiaqizhan.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -366,7 +365,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue
new file mode 100644
index 0000000..75516da
--- /dev/null
+++ b/src/views/maps/sinkThreat.vue
@@ -0,0 +1,415 @@
+<!--
+ * @Description: 塌陷专题
+ * @Author: 王晓颖
+ * @Date: 2021-04-09
+ -->
+<template>
+  <div id="centerDiv" class="mapcontainer">
+    <!--时钟-->
+    <clock/>
+    <!--天气-->
+    <weather/>
+    <!--选择区-->
+    <select-all-construction @change="selectChange" />
+    <!--统计结果显示-->
+    <div class="label-div">
+      <div class="label">
+        {{ boardData.name | boardNameFilter }}
+      </div>
+      <div class="value">
+        {{ boardData.value }}
+      </div>
+    </div>
+
+    <!--地图-->
+    <Map :url="configUrl" @onload="onMapload" />
+    <div class="map-btn-group">
+      <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
+      <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
+    </div>
+    <!--遮罩-->
+    <div class="mask">航天二院203所</div>
+  </div>
+</template>
+
+<script>
+import Map from '@/components/Map/MarsMap.vue'
+import 'mars3d-heatmap'
+import axios from 'axios'
+import Weather from '@/components/weather/weather'
+import Clock from '@/components/clock/Clock'
+import SelectAllConstruction from './components/selectAllConstruction'
+import SelectButton from '@/components/SelectTool/components/selectButton'
+import { getTimes } from '@/utils/dateutils'
+export default {
+  name: 'SinkThreat',
+  components: {
+    SelectAllConstruction,
+    Weather,
+    Clock,
+    Map,
+    SelectButton
+  },
+  filters: {
+    boardNameFilter(val) {
+      if (val === '全部' || val === '') {
+        return '全省塌陷'
+      } else {
+        return val + '区域塌陷'
+      }
+    }
+  },
+
+  data() {
+    return {
+      map: null, // 地图
+      configUrl: 'static/config/config.json',
+      alpha: 100, // 透明度
+      underground: null, // ？
+      heatShow: true, // 显示热力图
+      stationShow: true, // 显示管理处
+      positionShow: true, // 显示位置
+      boardData: {
+        name: '全部',
+        value: 196
+      }, // 统计版展示数据
+      threatLevel: {
+        '1': 'A级',
+        '2': 'B级',
+        '3': 'C级',
+        '4': '问题'
+      }, // 隐患等级
+      manageStations: [
+        { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' },
+        { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' },
+        { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' },
+        { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' },
+        { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' },
+        { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' },
+        { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' },
+        { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' }
+      ],
+      highConsequenceStation: [
+        { x: 112.73874, y: 37.693689, id: 0, name: '晋中管理处', count: 158 },
+        { x: 111.121552, y: 37.5245, id: 0, name: '吕梁管理处', count: 10 },
+        { x: 112.929902, y: 39.622888, id: 0, name: '同朔管理处', count: 44 },
+        { x: 112.72496, y: 38.415485, id: 0, name: '忻州管理处', count: 9 },
+        { x: 113.58249, y: 37.851892, id: 0, name: '阳泉管理处', count: 21 },
+        { x: 110.980927, y: 35.010828, id: 0, name: '运城管理处', count: 21 },
+        { x: 113.038394, y: 35.850111, id: 0, name: '长晋管理处', count: 11 },
+        { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
+      ],
+      highConsequence: [], // 高后果区列表
+      threatArea: [], // 第三方隐患列表
+      stationLayer: null, // 管理站图层
+      hqaLayer: null, // 塌陷热力图
+      threatLayer: null, // 塌陷分布图层
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
+      graphicLayer: null // 管理站标签图层
+    }
+  },
+  methods: {
+    // 地图构造完成回调
+    onMapload(map) {
+      // 以下为演示代码
+      this.map = map
+      // 背景透明
+      this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
+      this.map._viewer.scene.globe.baseColor.alpha = 0
+      this.addWaterHeat()
+      // 添加管理处
+      this.addStation()
+      this.addStationDiv()
+      // 添加塌陷隐患点
+      this.addThreatPosition()
+    },
+    // 高后果区热力图
+    addWaterHeat() {
+      const { mars3d } = this
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          const hqaLayer = new mars3d.layer.HeatLayer({
+            positions: this.highConsequence.map(item => {
+              return { lng: item['经度'], lat: item['纬度'], value: 1 }
+            }),
+            heatStyle: {
+              radius: 30, // 半径
+              blur: 1 // 模糊因子
+            },
+            // 以下为矩形矢量对象的样式参数
+            style: {
+              opacity: 0.8,
+              clampToGround: false,
+              height: 10000
+            },
+            redrawZoom: true,
+            flyTo: false
+          })
+          this.hqaLayer = hqaLayer
+          this.map.addLayer(hqaLayer)
+        }
+      })
+    },
+    // 塌陷位置
+    addThreatPosition() {
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.threatArea = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.threatArea.length
+          this.addFeatures(this.threatArea)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium, threatLevel } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />村庄地址：' +
+          item['村庄地址'] +
+          '<br />发现人：' +
+          item['发现人'] +
+          '<br />隐患描述：' +
+          item['隐患描述'] +
+          '<br />创建时间：' +
+          item['创建时间'] +
+          '<br />隐患等级：' +
+          threatLevel[item['隐患等级']]
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(item['隐患等级']) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
+    // 管理处
+    addStation() {
+      const { mars3d } = this
+      const stationLayer = new mars3d.layer.ModelLayer({
+        name: '管理处',
+        url: './static/gltf/output/guanlizhan.gltf',
+        style: {
+          scale: 20,
+          heading: 90,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.manageStations.map(item => {
+          return { lng: item.x, lat: item.y, alt: 0 }
+        })
+      })
+      this.stationLayer = stationLayer
+      this.map.addLayer(stationLayer)
+    },
+    // 选框发生变化
+    selectChange({ area, state, time, level }) {
+      area = area === '全部' ? '' : area
+      time = time === '全部' ? '' : time
+      level = level === '全部' ? '' : level
+      // 解析时间
+      let beginTime = ''
+      let endTime = ''
+      if (time) {
+        const result = getTimes(time)
+        beginTime = result.beginDate
+        endTime = result.endDate
+      }
+      this.boardData.name = area
+      // 查询数据
+      let count = 0
+      debugger
+      for (const hca of this.highConsequence) {
+        let flag = true // 标记是否合格
+        // 比较区域
+        if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) {
+          flag = false
+        }
+        // 比较时间
+        if (time) {
+          const real_date = new Date(hca['识别时间'])
+          if (real_date && (real_date < beginTime || real_date > endTime)) {
+            flag = false
+          }
+        }
+        // 比较级别
+        if (level && hca['隐患等级'] && hca['隐患等级'] === level) {
+          flag = false
+        }
+        if (flag) {
+          count++
+        }
+      }
+      this.boardData.value = count
+    },
+    // 自定义的弹窗
+    addStationDiv() {
+      const { Cesium, mars3d } = this
+      const graphicLayer = new mars3d.layer.GraphicLayer()
+      this.graphicLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      for (const station of this.highConsequenceStation) {
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(station.x, station.y, 10100),
+          style: {
+            html: `<div class="divpoint divpoint-theme-29baf1">
+                    <div class="divpoint-wrap">
+                        <div class="area">
+                            <div class="arrow-lt"></div>
+                            <div class="b-t"></div>
+                            <div class="b-r"></div>
+                            <div class="b-b"></div>
+                            <div class="b-l"></div>
+                            <div class="arrow-rb"></div>
+                            <div class="label-wrap">
+                                <div class="title">${station.name}</div>
+                                <div class="label-content">
+                                    <div class="data-li">
+                                        <div class="data-label">塌陷数量：</div>
+                                        <div class="data-value"><span class="label-num">${station.count}</span><span class="label-unit">个</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">经度：</div>
+                                        <div class="data-value"><span class="label-num">${station.x}</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">纬度：</div>
+                                        <div class="data-value"><span class="label-num">${station.y}</span>
+                                        </div>
+                                    </div>
+                                    `,
+            // anchor: [0, 0],
+            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
+            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10000, 500000), // 按视距距离显示
+            scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 500000, 0.1),
+            clampToGround: true,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
+          },
+          pointerEvents: false // false时不允许拾取和触发任意鼠标事件，但可以穿透div缩放地球
+        })
+        graphicLayer.addGraphic(graphic)
+        graphic.testPoint = false // 打开测试点，与DIV点进行对比位置调整css
+      }
+    },
+    // 是否显示热力图
+    showHeat(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.heatShow = false
+        this.map.removeLayer(this.hqaLayer, true)
+      } else {
+        this.heatShow = true
+        this.addWaterHeat()
+      }
+    },
+    // 显示管理处
+    showStation(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.stationShow = false
+        this.map.removeLayer(this.stationLayer, true)
+        this.map.removeLayer(this.graphicLayer, true)
+      } else {
+        this.stationShow = true
+        this.addStation()
+        this.addStationDiv()
+      }
+    },
+    // 显示隐患分布
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .label-div{
+    position: absolute;
+    top: 140px;
+    left:31rem;
+    z-index:100;
+    color: white;
+    padding:2rem 3rem 1.5rem 3rem;
+    background-image: url("../../assets/button_images/board-box1.png");
+    background-size: 100% 100%;
+    .label{
+      margin-bottom: 1rem;
+      font-size:1.2rem;
+    }
+    .value{
+      font-family: DS-DigitalBold;
+      font-size:2.5rem;
+    }
+  }
+  .map-btn-group{
+    position: absolute;
+    bottom:3rem;
+    left:50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: center;
+  }
+</style>
+
+<style rel="stylesheet/scss" lang="scss">
+  /*整个容器*/
+  .mapcontainer {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    background-color: transparent;
+    /*background-color: #051151;*/
+  }
+  /*logo遮罩*/
+  .mask{
+    position: fixed;
+    padding-left:10px;
+    padding-right:10px;
+    bottom:0px;
+    left:0px;
+    background-color:#000000;
+    color:#ffffff;
+    line-height:2
+  }
+
+</style>
diff --git a/src/views/maps/storageTopic.vue b/src/views/maps/storageTopic.vue
index fc01f51..8b6cfc0 100644
--- a/src/views/maps/storageTopic.vue
+++ b/src/views/maps/storageTopic.vue
@@ -10,7 +10,7 @@
     <!--天气-->
     <weather/>
     <!--选择区-->
-    <select-all-storage @change="selectChange" />
+    <!--<select-all-storage @change="selectChange" />-->
     <!--统计结果显示-->
     <div class="label-container">
       <div class="label-div">
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import 'mars3d-echarts'
 import Map from '@/components/Map/MarsMap.vue'
 import 'mars3d-heatmap'
 import axios from 'axios'
@@ -51,7 +52,7 @@
 import SelectAllStorage from './components/selectAllStorage'
 import SelectButton from '@/components/SelectTool/components/selectButton'
 export default {
-  name: 'Index',
+  name: 'StorageTopic',
   components: {
     SelectAllStorage,
     Weather,
@@ -74,9 +75,8 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      factoryShow: true, // 显示液化工厂
-      gasStationShow: true, // 显示加气站
-      positionShow: true, // 显示位置
+      factoryShow: false, // 显示液化工厂
+      // gasStationShow: false, // 显示加气站
       factoryStorageShow: true, // 液化工厂储量
       stationStorageShow: false, // 加气站储量
       liquidFactoryData: {
@@ -89,9 +89,11 @@
       }, // 统计版展示数据
       liquidFactory: [], // 液化工厂数据
       gasStation: [], // 加气站
-      stationLayer: null, // 管理站图层
       factoryStorageLayer: null, // 液化工厂分布图层
       stationStorageLayer: null, // 加气站存储层
+      factoryModelLayer: null, // 液化工厂模型层
+      stationModelLayer: null, // 加气站模型层
+      factoryLineLayer: null, // 飞线层
       pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       graphicLayer: null // 管理站标签图层
 
@@ -105,10 +107,10 @@
       // 背景透明
       this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
       this.map._viewer.scene.globe.baseColor.alpha = 0
-      this.addFactoryPosition()
+      this.addFactoryStorage()
     },
-    // 液化工厂位置
-    addFactoryPosition() {
+    // 液化工厂储量效果图
+    addFactoryStorage() {
       axios.get('static/config/liquidFactory.json').then((res) => {
         res = res.data
         if (res.code === 200) {
@@ -121,10 +123,164 @@
           // 添加点位
           this.addFeatures(this.liquidFactory, 'liquidFactory')
           // this.addFeatures(this.gasStation, 'gasStation')
+          // this.addFactoryPosition()
         }
       })
     },
-    // 添加隐患点储量柱状图
+    // 液化工厂三维模型
+    addFactoryModel() {
+      const { mars3d } = this
+      const factoryModelLayer = new mars3d.layer.ModelLayer({
+        name: '液化工厂',
+        url: './static/gltf/output/yehuagongchang.gltf',
+        style: {
+          scale: 20,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.liquidFactory.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.factoryModelLayer = factoryModelLayer
+      this.map.addLayer(factoryModelLayer)
+    },
+    addStationModel() {
+      const { mars3d } = this
+      const stationModelLayer = new mars3d.layer.ModelLayer({
+        name: '加气站',
+        url: './static/gltf/output/jiaqizhan.gltf',
+        style: {
+          scale: 10,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.gasStation.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.stationModelLayer = stationModelLayer
+      this.map.addLayer(stationModelLayer)
+    },
+    // 液化工厂和加气站位置飞线
+    addFactoryPosition() {
+      this.addFactoryModel() // 添加液化工厂三维模型
+      // this.addStationModel() // 添加加气站三维模型
+      const lineColor = ['#f6fb05', '#f6fb05', '#00fcff']
+      // 城市点位图标
+      const symbol1 = 'image://static/images/map/symbol2.png'
+      const symbol2 = 'image://static/images/map/symbol1.png'
+      // 线上的动态运动点图标
+      var pointSymbol = 'image://static/images/map/linePoint1.png'
+      // 工厂加symbol
+      const factorys = this.liquidFactory.map(item => {
+        return { ...item, symbol: symbol1 }
+      })
+      // 加气站加symbol
+      const stations = this.gasStation.map(item => {
+        return { ...item, symbol: symbol2 }
+      })
+      // 遍历获取关联关系
+      const lineArr = []
+      for (const station of stations) {
+        if (station.belong && station.value[0] !== '0') {
+          for (const factory of factorys) {
+            if (station.belong === factory.name && factory.value[0] !== '0') {
+              lineArr.push([
+                { coord: [parseFloat(factory.value[0]), parseFloat(factory.value[1])] },
+                { coord: [parseFloat(station.value[0]), parseFloat(station.value[1])] }
+              ])
+              break
+            }
+          }
+        }
+      }
+      const curveness = 0.5
+      var seriesZero = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [20, 20],
+          symbolOffset: [0, -10],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: factorys
+        }
+      ]
+      var seriesOne = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [16, 16],
+          symbolOffset: [0, -8],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          // label: {
+          //   normal: {
+          //     show: true,
+          //     position: 'bottom',
+          //     formatter: '{b}',
+          //     fontSize: 12,
+          //     color: '#fff',
+          //     textBorderColor: '#2aa4e8',
+          //     offset: [0, 20]
+          //   }
+          // },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: stations
+        }
+      ]
+      var seriesThree = [
+        {
+          name: '',
+          type: 'lines',
+          coordinateSystem: 'GLMap',
+          zlevel: 1,
+          blendMode: 'lighter',
+          effect: {
+            show: true,
+            smooth: false,
+            trailLength: 0,
+            symbol: pointSymbol,
+            symbolSize: [10, 30],
+            period: 4
+          },
+          lineStyle: {
+            width: 2,
+            color: lineColor[0],
+            curveness: curveness
+          },
+          data: lineArr
+        }
+      ]
+      var seriesData = [...seriesZero, ...seriesThree]
+      const option = {
+        animation: false,
+        GLMap: {},
+        series: seriesData
+      }
+      var echartsLayer = new this.mars3d.layer.EchartsLayer(option)
+      this.factoryLineLayer = echartsLayer
+      this.map.addLayer(echartsLayer)
+    },
+    // 添加点位储量柱状图
     addFeatures(arr, type) {
       const { mars3d } = this
       const colorList = ['#d71345', '#f15a22', '#f47920', '#f47920', '#fcaf17', '#fcaf17', '#63AEFF', '#63AEFF', '#1d953f', '#1d953f']
@@ -238,7 +394,6 @@
       // 现在正在显示
       if (show) { // 移除
         this.stationStorageShow = false
-        console.log(this.stationStorageLayer)
         this.map.removeLayer(this.stationStorageLayer, true)
       } else {
         this.stationStorageShow = true
@@ -247,13 +402,15 @@
     },
     // 显示隐患分布
     showPosition(show) {
-      // if (show) { // 移除
-      //   this.positionShow = false
-      //   this.map.removeLayer(this.threatLayer, true)
-      // } else {
-      //   this.positionShow = true
-      //   this.addThreatPosition()
-      // }
+      if (show) { // 移除
+        this.factoryShow = false
+        this.map.removeLayer(this.factoryModelLayer, true)
+        // this.map.removeLayer(this.stationModelLayer, true)
+        this.map.removeLayer(this.factoryLineLayer, true)
+      } else {
+        this.factoryShow = true
+        this.addFactoryPosition()
+      }
     }
   }
 }
@@ -262,7 +419,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-container{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     .label-div{
diff --git a/src/views/maps/waterThreat.vue b/src/views/maps/waterThreat.vue
index 1db2b84..8070d15 100644
--- a/src/views/maps/waterThreat.vue
+++ b/src/views/maps/waterThreat.vue
@@ -43,7 +43,7 @@
 import SelectButton from '@/components/SelectTool/components/selectButton'
 import { getTimes } from '@/utils/dateutils'
 export default {
-  name: 'Index',
+  name: 'WaterThreat',
   components: {
     SelectAllConstruction,
     Weather,
@@ -218,8 +218,7 @@
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/output/jiaqizhan.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -366,7 +365,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/static/config/config.json b/static/config/config.json
index 95b4bcd..a21b33a 100644
--- a/static/config/config.json
+++ b/static/config/config.json
@@ -11,7 +11,8 @@
             "showSkyBox":false,
             "showSkyAtmosphere":false,
             "fog":false,
-            "fxaa":false,
+            "fxaa":true,
+            "scene3DOnly":true,
             "globe": {
                 "show":true,
                 "depthTestAgainstTerrain":false,

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue
new file mode 100644
index 0000000..75516da
--- /dev/null
+++ b/src/views/maps/sinkThreat.vue
@@ -0,0 +1,415 @@
+<!--
+ * @Description: 塌陷专题
+ * @Author: 王晓颖
+ * @Date: 2021-04-09
+ -->
+<template>
+  <div id="centerDiv" class="mapcontainer">
+    <!--时钟-->
+    <clock/>
+    <!--天气-->
+    <weather/>
+    <!--选择区-->
+    <select-all-construction @change="selectChange" />
+    <!--统计结果显示-->
+    <div class="label-div">
+      <div class="label">
+        {{ boardData.name | boardNameFilter }}
+      </div>
+      <div class="value">
+        {{ boardData.value }}
+      </div>
+    </div>
+
+    <!--地图-->
+    <Map :url="configUrl" @onload="onMapload" />
+    <div class="map-btn-group">
+      <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
+      <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
+    </div>
+    <!--遮罩-->
+    <div class="mask">航天二院203所</div>
+  </div>
+</template>
+
+<script>
+import Map from '@/components/Map/MarsMap.vue'
+import 'mars3d-heatmap'
+import axios from 'axios'
+import Weather from '@/components/weather/weather'
+import Clock from '@/components/clock/Clock'
+import SelectAllConstruction from './components/selectAllConstruction'
+import SelectButton from '@/components/SelectTool/components/selectButton'
+import { getTimes } from '@/utils/dateutils'
+export default {
+  name: 'SinkThreat',
+  components: {
+    SelectAllConstruction,
+    Weather,
+    Clock,
+    Map,
+    SelectButton
+  },
+  filters: {
+    boardNameFilter(val) {
+      if (val === '全部' || val === '') {
+        return '全省塌陷'
+      } else {
+        return val + '区域塌陷'
+      }
+    }
+  },
+
+  data() {
+    return {
+      map: null, // 地图
+      configUrl: 'static/config/config.json',
+      alpha: 100, // 透明度
+      underground: null, // ？
+      heatShow: true, // 显示热力图
+      stationShow: true, // 显示管理处
+      positionShow: true, // 显示位置
+      boardData: {
+        name: '全部',
+        value: 196
+      }, // 统计版展示数据
+      threatLevel: {
+        '1': 'A级',
+        '2': 'B级',
+        '3': 'C级',
+        '4': '问题'
+      }, // 隐患等级
+      manageStations: [
+        { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' },
+        { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' },
+        { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' },
+        { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' },
+        { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' },
+        { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' },
+        { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' },
+        { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' }
+      ],
+      highConsequenceStation: [
+        { x: 112.73874, y: 37.693689, id: 0, name: '晋中管理处', count: 158 },
+        { x: 111.121552, y: 37.5245, id: 0, name: '吕梁管理处', count: 10 },
+        { x: 112.929902, y: 39.622888, id: 0, name: '同朔管理处', count: 44 },
+        { x: 112.72496, y: 38.415485, id: 0, name: '忻州管理处', count: 9 },
+        { x: 113.58249, y: 37.851892, id: 0, name: '阳泉管理处', count: 21 },
+        { x: 110.980927, y: 35.010828, id: 0, name: '运城管理处', count: 21 },
+        { x: 113.038394, y: 35.850111, id: 0, name: '长晋管理处', count: 11 },
+        { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
+      ],
+      highConsequence: [], // 高后果区列表
+      threatArea: [], // 第三方隐患列表
+      stationLayer: null, // 管理站图层
+      hqaLayer: null, // 塌陷热力图
+      threatLayer: null, // 塌陷分布图层
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
+      graphicLayer: null // 管理站标签图层
+    }
+  },
+  methods: {
+    // 地图构造完成回调
+    onMapload(map) {
+      // 以下为演示代码
+      this.map = map
+      // 背景透明
+      this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
+      this.map._viewer.scene.globe.baseColor.alpha = 0
+      this.addWaterHeat()
+      // 添加管理处
+      this.addStation()
+      this.addStationDiv()
+      // 添加塌陷隐患点
+      this.addThreatPosition()
+    },
+    // 高后果区热力图
+    addWaterHeat() {
+      const { mars3d } = this
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          const hqaLayer = new mars3d.layer.HeatLayer({
+            positions: this.highConsequence.map(item => {
+              return { lng: item['经度'], lat: item['纬度'], value: 1 }
+            }),
+            heatStyle: {
+              radius: 30, // 半径
+              blur: 1 // 模糊因子
+            },
+            // 以下为矩形矢量对象的样式参数
+            style: {
+              opacity: 0.8,
+              clampToGround: false,
+              height: 10000
+            },
+            redrawZoom: true,
+            flyTo: false
+          })
+          this.hqaLayer = hqaLayer
+          this.map.addLayer(hqaLayer)
+        }
+      })
+    },
+    // 塌陷位置
+    addThreatPosition() {
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.threatArea = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.threatArea.length
+          this.addFeatures(this.threatArea)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium, threatLevel } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />村庄地址：' +
+          item['村庄地址'] +
+          '<br />发现人：' +
+          item['发现人'] +
+          '<br />隐患描述：' +
+          item['隐患描述'] +
+          '<br />创建时间：' +
+          item['创建时间'] +
+          '<br />隐患等级：' +
+          threatLevel[item['隐患等级']]
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(item['隐患等级']) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
+    // 管理处
+    addStation() {
+      const { mars3d } = this
+      const stationLayer = new mars3d.layer.ModelLayer({
+        name: '管理处',
+        url: './static/gltf/output/guanlizhan.gltf',
+        style: {
+          scale: 20,
+          heading: 90,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.manageStations.map(item => {
+          return { lng: item.x, lat: item.y, alt: 0 }
+        })
+      })
+      this.stationLayer = stationLayer
+      this.map.addLayer(stationLayer)
+    },
+    // 选框发生变化
+    selectChange({ area, state, time, level }) {
+      area = area === '全部' ? '' : area
+      time = time === '全部' ? '' : time
+      level = level === '全部' ? '' : level
+      // 解析时间
+      let beginTime = ''
+      let endTime = ''
+      if (time) {
+        const result = getTimes(time)
+        beginTime = result.beginDate
+        endTime = result.endDate
+      }
+      this.boardData.name = area
+      // 查询数据
+      let count = 0
+      debugger
+      for (const hca of this.highConsequence) {
+        let flag = true // 标记是否合格
+        // 比较区域
+        if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) {
+          flag = false
+        }
+        // 比较时间
+        if (time) {
+          const real_date = new Date(hca['识别时间'])
+          if (real_date && (real_date < beginTime || real_date > endTime)) {
+            flag = false
+          }
+        }
+        // 比较级别
+        if (level && hca['隐患等级'] && hca['隐患等级'] === level) {
+          flag = false
+        }
+        if (flag) {
+          count++
+        }
+      }
+      this.boardData.value = count
+    },
+    // 自定义的弹窗
+    addStationDiv() {
+      const { Cesium, mars3d } = this
+      const graphicLayer = new mars3d.layer.GraphicLayer()
+      this.graphicLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      for (const station of this.highConsequenceStation) {
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(station.x, station.y, 10100),
+          style: {
+            html: `<div class="divpoint divpoint-theme-29baf1">
+                    <div class="divpoint-wrap">
+                        <div class="area">
+                            <div class="arrow-lt"></div>
+                            <div class="b-t"></div>
+                            <div class="b-r"></div>
+                            <div class="b-b"></div>
+                            <div class="b-l"></div>
+                            <div class="arrow-rb"></div>
+                            <div class="label-wrap">
+                                <div class="title">${station.name}</div>
+                                <div class="label-content">
+                                    <div class="data-li">
+                                        <div class="data-label">塌陷数量：</div>
+                                        <div class="data-value"><span class="label-num">${station.count}</span><span class="label-unit">个</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">经度：</div>
+                                        <div class="data-value"><span class="label-num">${station.x}</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">纬度：</div>
+                                        <div class="data-value"><span class="label-num">${station.y}</span>
+                                        </div>
+                                    </div>
+                                    `,
+            // anchor: [0, 0],
+            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
+            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10000, 500000), // 按视距距离显示
+            scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 500000, 0.1),
+            clampToGround: true,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
+          },
+          pointerEvents: false // false时不允许拾取和触发任意鼠标事件，但可以穿透div缩放地球
+        })
+        graphicLayer.addGraphic(graphic)
+        graphic.testPoint = false // 打开测试点，与DIV点进行对比位置调整css
+      }
+    },
+    // 是否显示热力图
+    showHeat(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.heatShow = false
+        this.map.removeLayer(this.hqaLayer, true)
+      } else {
+        this.heatShow = true
+        this.addWaterHeat()
+      }
+    },
+    // 显示管理处
+    showStation(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.stationShow = false
+        this.map.removeLayer(this.stationLayer, true)
+        this.map.removeLayer(this.graphicLayer, true)
+      } else {
+        this.stationShow = true
+        this.addStation()
+        this.addStationDiv()
+      }
+    },
+    // 显示隐患分布
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .label-div{
+    position: absolute;
+    top: 140px;
+    left:31rem;
+    z-index:100;
+    color: white;
+    padding:2rem 3rem 1.5rem 3rem;
+    background-image: url("../../assets/button_images/board-box1.png");
+    background-size: 100% 100%;
+    .label{
+      margin-bottom: 1rem;
+      font-size:1.2rem;
+    }
+    .value{
+      font-family: DS-DigitalBold;
+      font-size:2.5rem;
+    }
+  }
+  .map-btn-group{
+    position: absolute;
+    bottom:3rem;
+    left:50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: center;
+  }
+</style>
+
+<style rel="stylesheet/scss" lang="scss">
+  /*整个容器*/
+  .mapcontainer {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    background-color: transparent;
+    /*background-color: #051151;*/
+  }
+  /*logo遮罩*/
+  .mask{
+    position: fixed;
+    padding-left:10px;
+    padding-right:10px;
+    bottom:0px;
+    left:0px;
+    background-color:#000000;
+    color:#ffffff;
+    line-height:2
+  }
+
+</style>
diff --git a/src/views/maps/storageTopic.vue b/src/views/maps/storageTopic.vue
index fc01f51..8b6cfc0 100644
--- a/src/views/maps/storageTopic.vue
+++ b/src/views/maps/storageTopic.vue
@@ -10,7 +10,7 @@
     <!--天气-->
     <weather/>
     <!--选择区-->
-    <select-all-storage @change="selectChange" />
+    <!--<select-all-storage @change="selectChange" />-->
     <!--统计结果显示-->
     <div class="label-container">
       <div class="label-div">
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import 'mars3d-echarts'
 import Map from '@/components/Map/MarsMap.vue'
 import 'mars3d-heatmap'
 import axios from 'axios'
@@ -51,7 +52,7 @@
 import SelectAllStorage from './components/selectAllStorage'
 import SelectButton from '@/components/SelectTool/components/selectButton'
 export default {
-  name: 'Index',
+  name: 'StorageTopic',
   components: {
     SelectAllStorage,
     Weather,
@@ -74,9 +75,8 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      factoryShow: true, // 显示液化工厂
-      gasStationShow: true, // 显示加气站
-      positionShow: true, // 显示位置
+      factoryShow: false, // 显示液化工厂
+      // gasStationShow: false, // 显示加气站
       factoryStorageShow: true, // 液化工厂储量
       stationStorageShow: false, // 加气站储量
       liquidFactoryData: {
@@ -89,9 +89,11 @@
       }, // 统计版展示数据
       liquidFactory: [], // 液化工厂数据
       gasStation: [], // 加气站
-      stationLayer: null, // 管理站图层
       factoryStorageLayer: null, // 液化工厂分布图层
       stationStorageLayer: null, // 加气站存储层
+      factoryModelLayer: null, // 液化工厂模型层
+      stationModelLayer: null, // 加气站模型层
+      factoryLineLayer: null, // 飞线层
       pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       graphicLayer: null // 管理站标签图层
 
@@ -105,10 +107,10 @@
       // 背景透明
       this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
       this.map._viewer.scene.globe.baseColor.alpha = 0
-      this.addFactoryPosition()
+      this.addFactoryStorage()
     },
-    // 液化工厂位置
-    addFactoryPosition() {
+    // 液化工厂储量效果图
+    addFactoryStorage() {
       axios.get('static/config/liquidFactory.json').then((res) => {
         res = res.data
         if (res.code === 200) {
@@ -121,10 +123,164 @@
           // 添加点位
           this.addFeatures(this.liquidFactory, 'liquidFactory')
           // this.addFeatures(this.gasStation, 'gasStation')
+          // this.addFactoryPosition()
         }
       })
     },
-    // 添加隐患点储量柱状图
+    // 液化工厂三维模型
+    addFactoryModel() {
+      const { mars3d } = this
+      const factoryModelLayer = new mars3d.layer.ModelLayer({
+        name: '液化工厂',
+        url: './static/gltf/output/yehuagongchang.gltf',
+        style: {
+          scale: 20,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.liquidFactory.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.factoryModelLayer = factoryModelLayer
+      this.map.addLayer(factoryModelLayer)
+    },
+    addStationModel() {
+      const { mars3d } = this
+      const stationModelLayer = new mars3d.layer.ModelLayer({
+        name: '加气站',
+        url: './static/gltf/output/jiaqizhan.gltf',
+        style: {
+          scale: 10,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.gasStation.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.stationModelLayer = stationModelLayer
+      this.map.addLayer(stationModelLayer)
+    },
+    // 液化工厂和加气站位置飞线
+    addFactoryPosition() {
+      this.addFactoryModel() // 添加液化工厂三维模型
+      // this.addStationModel() // 添加加气站三维模型
+      const lineColor = ['#f6fb05', '#f6fb05', '#00fcff']
+      // 城市点位图标
+      const symbol1 = 'image://static/images/map/symbol2.png'
+      const symbol2 = 'image://static/images/map/symbol1.png'
+      // 线上的动态运动点图标
+      var pointSymbol = 'image://static/images/map/linePoint1.png'
+      // 工厂加symbol
+      const factorys = this.liquidFactory.map(item => {
+        return { ...item, symbol: symbol1 }
+      })
+      // 加气站加symbol
+      const stations = this.gasStation.map(item => {
+        return { ...item, symbol: symbol2 }
+      })
+      // 遍历获取关联关系
+      const lineArr = []
+      for (const station of stations) {
+        if (station.belong && station.value[0] !== '0') {
+          for (const factory of factorys) {
+            if (station.belong === factory.name && factory.value[0] !== '0') {
+              lineArr.push([
+                { coord: [parseFloat(factory.value[0]), parseFloat(factory.value[1])] },
+                { coord: [parseFloat(station.value[0]), parseFloat(station.value[1])] }
+              ])
+              break
+            }
+          }
+        }
+      }
+      const curveness = 0.5
+      var seriesZero = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [20, 20],
+          symbolOffset: [0, -10],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: factorys
+        }
+      ]
+      var seriesOne = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [16, 16],
+          symbolOffset: [0, -8],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          // label: {
+          //   normal: {
+          //     show: true,
+          //     position: 'bottom',
+          //     formatter: '{b}',
+          //     fontSize: 12,
+          //     color: '#fff',
+          //     textBorderColor: '#2aa4e8',
+          //     offset: [0, 20]
+          //   }
+          // },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: stations
+        }
+      ]
+      var seriesThree = [
+        {
+          name: '',
+          type: 'lines',
+          coordinateSystem: 'GLMap',
+          zlevel: 1,
+          blendMode: 'lighter',
+          effect: {
+            show: true,
+            smooth: false,
+            trailLength: 0,
+            symbol: pointSymbol,
+            symbolSize: [10, 30],
+            period: 4
+          },
+          lineStyle: {
+            width: 2,
+            color: lineColor[0],
+            curveness: curveness
+          },
+          data: lineArr
+        }
+      ]
+      var seriesData = [...seriesZero, ...seriesThree]
+      const option = {
+        animation: false,
+        GLMap: {},
+        series: seriesData
+      }
+      var echartsLayer = new this.mars3d.layer.EchartsLayer(option)
+      this.factoryLineLayer = echartsLayer
+      this.map.addLayer(echartsLayer)
+    },
+    // 添加点位储量柱状图
     addFeatures(arr, type) {
       const { mars3d } = this
       const colorList = ['#d71345', '#f15a22', '#f47920', '#f47920', '#fcaf17', '#fcaf17', '#63AEFF', '#63AEFF', '#1d953f', '#1d953f']
@@ -238,7 +394,6 @@
       // 现在正在显示
       if (show) { // 移除
         this.stationStorageShow = false
-        console.log(this.stationStorageLayer)
         this.map.removeLayer(this.stationStorageLayer, true)
       } else {
         this.stationStorageShow = true
@@ -247,13 +402,15 @@
     },
     // 显示隐患分布
     showPosition(show) {
-      // if (show) { // 移除
-      //   this.positionShow = false
-      //   this.map.removeLayer(this.threatLayer, true)
-      // } else {
-      //   this.positionShow = true
-      //   this.addThreatPosition()
-      // }
+      if (show) { // 移除
+        this.factoryShow = false
+        this.map.removeLayer(this.factoryModelLayer, true)
+        // this.map.removeLayer(this.stationModelLayer, true)
+        this.map.removeLayer(this.factoryLineLayer, true)
+      } else {
+        this.factoryShow = true
+        this.addFactoryPosition()
+      }
     }
   }
 }
@@ -262,7 +419,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-container{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     .label-div{
diff --git a/src/views/maps/waterThreat.vue b/src/views/maps/waterThreat.vue
index 1db2b84..8070d15 100644
--- a/src/views/maps/waterThreat.vue
+++ b/src/views/maps/waterThreat.vue
@@ -43,7 +43,7 @@
 import SelectButton from '@/components/SelectTool/components/selectButton'
 import { getTimes } from '@/utils/dateutils'
 export default {
-  name: 'Index',
+  name: 'WaterThreat',
   components: {
     SelectAllConstruction,
     Weather,
@@ -218,8 +218,7 @@
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/output/jiaqizhan.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -366,7 +365,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/static/config/config.json b/static/config/config.json
index 95b4bcd..a21b33a 100644
--- a/static/config/config.json
+++ b/static/config/config.json
@@ -11,7 +11,8 @@
             "showSkyBox":false,
             "showSkyAtmosphere":false,
             "fog":false,
-            "fxaa":false,
+            "fxaa":true,
+            "scene3DOnly":true,
             "globe": {
                 "show":true,
                 "depthTestAgainstTerrain":false,
diff --git a/static/config/liquidFactory.json b/static/config/liquidFactory.json
index 5ac0282..02ae8d0 100644
--- a/static/config/liquidFactory.json
+++ b/static/config/liquidFactory.json
@@ -132,6 +132,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西燃气产业集团有限公司原平液化分公司"
         },
         {
@@ -142,6 +143,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团有限公司"
         },
         {
@@ -152,6 +154,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团有限公司"
         },
         {
@@ -162,6 +165,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团朔州有限公司"
         },
         {
@@ -172,6 +176,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气公司长治分公司"
         },
         {
@@ -182,6 +187,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -192,6 +198,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司平陆分公司"
         },
         {
@@ -202,6 +209,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -212,6 +220,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -222,6 +231,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -232,6 +242,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团吕梁有限公司"
         },
         {
@@ -242,6 +253,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -252,6 +264,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -262,6 +275,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -272,6 +286,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -282,6 +297,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -292,6 +308,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司万荣分公司"
         },
         {
@@ -302,6 +319,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司闻喜分公司"
         },
         {
@@ -312,6 +330,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司新绛分公司"
         },
         {
@@ -322,6 +341,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西天然气有限公司"
         },
         {
@@ -332,6 +352,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "太原国新清洁能源保德有限公司"
         },
         {
@@ -342,6 +363,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "交口县国兴新能源利用有限公司"
         },
         {
@@ -352,6 +374,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "襄垣漳江煤层气有限公司"
         },
         {
@@ -362,6 +385,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气(天然气)集输有限公司"
         },
         {
@@ -372,6 +396,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "国新下孔公司"
         },
         {
@@ -382,6 +407,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "长治市国新远东燃气有限公司"
         },
         {
@@ -392,6 +418,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气(天然气)集输有限公司"
         },
         {
@@ -1372,6 +1399,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1382,6 +1410,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1390,8 +1419,9 @@
             "111.7594150",
             "39.5082270"
           ],
-"contain":30,
+          "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1402,6 +1432,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1452,6 +1483,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用新朔公司 "
         },
         {
@@ -1462,6 +1494,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用新朔公司 "
         },
         {

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue
new file mode 100644
index 0000000..75516da
--- /dev/null
+++ b/src/views/maps/sinkThreat.vue
@@ -0,0 +1,415 @@
+<!--
+ * @Description: 塌陷专题
+ * @Author: 王晓颖
+ * @Date: 2021-04-09
+ -->
+<template>
+  <div id="centerDiv" class="mapcontainer">
+    <!--时钟-->
+    <clock/>
+    <!--天气-->
+    <weather/>
+    <!--选择区-->
+    <select-all-construction @change="selectChange" />
+    <!--统计结果显示-->
+    <div class="label-div">
+      <div class="label">
+        {{ boardData.name | boardNameFilter }}
+      </div>
+      <div class="value">
+        {{ boardData.value }}
+      </div>
+    </div>
+
+    <!--地图-->
+    <Map :url="configUrl" @onload="onMapload" />
+    <div class="map-btn-group">
+      <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
+      <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
+    </div>
+    <!--遮罩-->
+    <div class="mask">航天二院203所</div>
+  </div>
+</template>
+
+<script>
+import Map from '@/components/Map/MarsMap.vue'
+import 'mars3d-heatmap'
+import axios from 'axios'
+import Weather from '@/components/weather/weather'
+import Clock from '@/components/clock/Clock'
+import SelectAllConstruction from './components/selectAllConstruction'
+import SelectButton from '@/components/SelectTool/components/selectButton'
+import { getTimes } from '@/utils/dateutils'
+export default {
+  name: 'SinkThreat',
+  components: {
+    SelectAllConstruction,
+    Weather,
+    Clock,
+    Map,
+    SelectButton
+  },
+  filters: {
+    boardNameFilter(val) {
+      if (val === '全部' || val === '') {
+        return '全省塌陷'
+      } else {
+        return val + '区域塌陷'
+      }
+    }
+  },
+
+  data() {
+    return {
+      map: null, // 地图
+      configUrl: 'static/config/config.json',
+      alpha: 100, // 透明度
+      underground: null, // ？
+      heatShow: true, // 显示热力图
+      stationShow: true, // 显示管理处
+      positionShow: true, // 显示位置
+      boardData: {
+        name: '全部',
+        value: 196
+      }, // 统计版展示数据
+      threatLevel: {
+        '1': 'A级',
+        '2': 'B级',
+        '3': 'C级',
+        '4': '问题'
+      }, // 隐患等级
+      manageStations: [
+        { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' },
+        { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' },
+        { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' },
+        { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' },
+        { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' },
+        { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' },
+        { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' },
+        { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' }
+      ],
+      highConsequenceStation: [
+        { x: 112.73874, y: 37.693689, id: 0, name: '晋中管理处', count: 158 },
+        { x: 111.121552, y: 37.5245, id: 0, name: '吕梁管理处', count: 10 },
+        { x: 112.929902, y: 39.622888, id: 0, name: '同朔管理处', count: 44 },
+        { x: 112.72496, y: 38.415485, id: 0, name: '忻州管理处', count: 9 },
+        { x: 113.58249, y: 37.851892, id: 0, name: '阳泉管理处', count: 21 },
+        { x: 110.980927, y: 35.010828, id: 0, name: '运城管理处', count: 21 },
+        { x: 113.038394, y: 35.850111, id: 0, name: '长晋管理处', count: 11 },
+        { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
+      ],
+      highConsequence: [], // 高后果区列表
+      threatArea: [], // 第三方隐患列表
+      stationLayer: null, // 管理站图层
+      hqaLayer: null, // 塌陷热力图
+      threatLayer: null, // 塌陷分布图层
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
+      graphicLayer: null // 管理站标签图层
+    }
+  },
+  methods: {
+    // 地图构造完成回调
+    onMapload(map) {
+      // 以下为演示代码
+      this.map = map
+      // 背景透明
+      this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
+      this.map._viewer.scene.globe.baseColor.alpha = 0
+      this.addWaterHeat()
+      // 添加管理处
+      this.addStation()
+      this.addStationDiv()
+      // 添加塌陷隐患点
+      this.addThreatPosition()
+    },
+    // 高后果区热力图
+    addWaterHeat() {
+      const { mars3d } = this
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          const hqaLayer = new mars3d.layer.HeatLayer({
+            positions: this.highConsequence.map(item => {
+              return { lng: item['经度'], lat: item['纬度'], value: 1 }
+            }),
+            heatStyle: {
+              radius: 30, // 半径
+              blur: 1 // 模糊因子
+            },
+            // 以下为矩形矢量对象的样式参数
+            style: {
+              opacity: 0.8,
+              clampToGround: false,
+              height: 10000
+            },
+            redrawZoom: true,
+            flyTo: false
+          })
+          this.hqaLayer = hqaLayer
+          this.map.addLayer(hqaLayer)
+        }
+      })
+    },
+    // 塌陷位置
+    addThreatPosition() {
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.threatArea = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.threatArea.length
+          this.addFeatures(this.threatArea)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium, threatLevel } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />村庄地址：' +
+          item['村庄地址'] +
+          '<br />发现人：' +
+          item['发现人'] +
+          '<br />隐患描述：' +
+          item['隐患描述'] +
+          '<br />创建时间：' +
+          item['创建时间'] +
+          '<br />隐患等级：' +
+          threatLevel[item['隐患等级']]
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(item['隐患等级']) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
+    // 管理处
+    addStation() {
+      const { mars3d } = this
+      const stationLayer = new mars3d.layer.ModelLayer({
+        name: '管理处',
+        url: './static/gltf/output/guanlizhan.gltf',
+        style: {
+          scale: 20,
+          heading: 90,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.manageStations.map(item => {
+          return { lng: item.x, lat: item.y, alt: 0 }
+        })
+      })
+      this.stationLayer = stationLayer
+      this.map.addLayer(stationLayer)
+    },
+    // 选框发生变化
+    selectChange({ area, state, time, level }) {
+      area = area === '全部' ? '' : area
+      time = time === '全部' ? '' : time
+      level = level === '全部' ? '' : level
+      // 解析时间
+      let beginTime = ''
+      let endTime = ''
+      if (time) {
+        const result = getTimes(time)
+        beginTime = result.beginDate
+        endTime = result.endDate
+      }
+      this.boardData.name = area
+      // 查询数据
+      let count = 0
+      debugger
+      for (const hca of this.highConsequence) {
+        let flag = true // 标记是否合格
+        // 比较区域
+        if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) {
+          flag = false
+        }
+        // 比较时间
+        if (time) {
+          const real_date = new Date(hca['识别时间'])
+          if (real_date && (real_date < beginTime || real_date > endTime)) {
+            flag = false
+          }
+        }
+        // 比较级别
+        if (level && hca['隐患等级'] && hca['隐患等级'] === level) {
+          flag = false
+        }
+        if (flag) {
+          count++
+        }
+      }
+      this.boardData.value = count
+    },
+    // 自定义的弹窗
+    addStationDiv() {
+      const { Cesium, mars3d } = this
+      const graphicLayer = new mars3d.layer.GraphicLayer()
+      this.graphicLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      for (const station of this.highConsequenceStation) {
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(station.x, station.y, 10100),
+          style: {
+            html: `<div class="divpoint divpoint-theme-29baf1">
+                    <div class="divpoint-wrap">
+                        <div class="area">
+                            <div class="arrow-lt"></div>
+                            <div class="b-t"></div>
+                            <div class="b-r"></div>
+                            <div class="b-b"></div>
+                            <div class="b-l"></div>
+                            <div class="arrow-rb"></div>
+                            <div class="label-wrap">
+                                <div class="title">${station.name}</div>
+                                <div class="label-content">
+                                    <div class="data-li">
+                                        <div class="data-label">塌陷数量：</div>
+                                        <div class="data-value"><span class="label-num">${station.count}</span><span class="label-unit">个</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">经度：</div>
+                                        <div class="data-value"><span class="label-num">${station.x}</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">纬度：</div>
+                                        <div class="data-value"><span class="label-num">${station.y}</span>
+                                        </div>
+                                    </div>
+                                    `,
+            // anchor: [0, 0],
+            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
+            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10000, 500000), // 按视距距离显示
+            scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 500000, 0.1),
+            clampToGround: true,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
+          },
+          pointerEvents: false // false时不允许拾取和触发任意鼠标事件，但可以穿透div缩放地球
+        })
+        graphicLayer.addGraphic(graphic)
+        graphic.testPoint = false // 打开测试点，与DIV点进行对比位置调整css
+      }
+    },
+    // 是否显示热力图
+    showHeat(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.heatShow = false
+        this.map.removeLayer(this.hqaLayer, true)
+      } else {
+        this.heatShow = true
+        this.addWaterHeat()
+      }
+    },
+    // 显示管理处
+    showStation(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.stationShow = false
+        this.map.removeLayer(this.stationLayer, true)
+        this.map.removeLayer(this.graphicLayer, true)
+      } else {
+        this.stationShow = true
+        this.addStation()
+        this.addStationDiv()
+      }
+    },
+    // 显示隐患分布
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .label-div{
+    position: absolute;
+    top: 140px;
+    left:31rem;
+    z-index:100;
+    color: white;
+    padding:2rem 3rem 1.5rem 3rem;
+    background-image: url("../../assets/button_images/board-box1.png");
+    background-size: 100% 100%;
+    .label{
+      margin-bottom: 1rem;
+      font-size:1.2rem;
+    }
+    .value{
+      font-family: DS-DigitalBold;
+      font-size:2.5rem;
+    }
+  }
+  .map-btn-group{
+    position: absolute;
+    bottom:3rem;
+    left:50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: center;
+  }
+</style>
+
+<style rel="stylesheet/scss" lang="scss">
+  /*整个容器*/
+  .mapcontainer {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    background-color: transparent;
+    /*background-color: #051151;*/
+  }
+  /*logo遮罩*/
+  .mask{
+    position: fixed;
+    padding-left:10px;
+    padding-right:10px;
+    bottom:0px;
+    left:0px;
+    background-color:#000000;
+    color:#ffffff;
+    line-height:2
+  }
+
+</style>
diff --git a/src/views/maps/storageTopic.vue b/src/views/maps/storageTopic.vue
index fc01f51..8b6cfc0 100644
--- a/src/views/maps/storageTopic.vue
+++ b/src/views/maps/storageTopic.vue
@@ -10,7 +10,7 @@
     <!--天气-->
     <weather/>
     <!--选择区-->
-    <select-all-storage @change="selectChange" />
+    <!--<select-all-storage @change="selectChange" />-->
     <!--统计结果显示-->
     <div class="label-container">
       <div class="label-div">
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import 'mars3d-echarts'
 import Map from '@/components/Map/MarsMap.vue'
 import 'mars3d-heatmap'
 import axios from 'axios'
@@ -51,7 +52,7 @@
 import SelectAllStorage from './components/selectAllStorage'
 import SelectButton from '@/components/SelectTool/components/selectButton'
 export default {
-  name: 'Index',
+  name: 'StorageTopic',
   components: {
     SelectAllStorage,
     Weather,
@@ -74,9 +75,8 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      factoryShow: true, // 显示液化工厂
-      gasStationShow: true, // 显示加气站
-      positionShow: true, // 显示位置
+      factoryShow: false, // 显示液化工厂
+      // gasStationShow: false, // 显示加气站
       factoryStorageShow: true, // 液化工厂储量
       stationStorageShow: false, // 加气站储量
       liquidFactoryData: {
@@ -89,9 +89,11 @@
       }, // 统计版展示数据
       liquidFactory: [], // 液化工厂数据
       gasStation: [], // 加气站
-      stationLayer: null, // 管理站图层
       factoryStorageLayer: null, // 液化工厂分布图层
       stationStorageLayer: null, // 加气站存储层
+      factoryModelLayer: null, // 液化工厂模型层
+      stationModelLayer: null, // 加气站模型层
+      factoryLineLayer: null, // 飞线层
       pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       graphicLayer: null // 管理站标签图层
 
@@ -105,10 +107,10 @@
       // 背景透明
       this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
       this.map._viewer.scene.globe.baseColor.alpha = 0
-      this.addFactoryPosition()
+      this.addFactoryStorage()
     },
-    // 液化工厂位置
-    addFactoryPosition() {
+    // 液化工厂储量效果图
+    addFactoryStorage() {
       axios.get('static/config/liquidFactory.json').then((res) => {
         res = res.data
         if (res.code === 200) {
@@ -121,10 +123,164 @@
           // 添加点位
           this.addFeatures(this.liquidFactory, 'liquidFactory')
           // this.addFeatures(this.gasStation, 'gasStation')
+          // this.addFactoryPosition()
         }
       })
     },
-    // 添加隐患点储量柱状图
+    // 液化工厂三维模型
+    addFactoryModel() {
+      const { mars3d } = this
+      const factoryModelLayer = new mars3d.layer.ModelLayer({
+        name: '液化工厂',
+        url: './static/gltf/output/yehuagongchang.gltf',
+        style: {
+          scale: 20,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.liquidFactory.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.factoryModelLayer = factoryModelLayer
+      this.map.addLayer(factoryModelLayer)
+    },
+    addStationModel() {
+      const { mars3d } = this
+      const stationModelLayer = new mars3d.layer.ModelLayer({
+        name: '加气站',
+        url: './static/gltf/output/jiaqizhan.gltf',
+        style: {
+          scale: 10,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.gasStation.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.stationModelLayer = stationModelLayer
+      this.map.addLayer(stationModelLayer)
+    },
+    // 液化工厂和加气站位置飞线
+    addFactoryPosition() {
+      this.addFactoryModel() // 添加液化工厂三维模型
+      // this.addStationModel() // 添加加气站三维模型
+      const lineColor = ['#f6fb05', '#f6fb05', '#00fcff']
+      // 城市点位图标
+      const symbol1 = 'image://static/images/map/symbol2.png'
+      const symbol2 = 'image://static/images/map/symbol1.png'
+      // 线上的动态运动点图标
+      var pointSymbol = 'image://static/images/map/linePoint1.png'
+      // 工厂加symbol
+      const factorys = this.liquidFactory.map(item => {
+        return { ...item, symbol: symbol1 }
+      })
+      // 加气站加symbol
+      const stations = this.gasStation.map(item => {
+        return { ...item, symbol: symbol2 }
+      })
+      // 遍历获取关联关系
+      const lineArr = []
+      for (const station of stations) {
+        if (station.belong && station.value[0] !== '0') {
+          for (const factory of factorys) {
+            if (station.belong === factory.name && factory.value[0] !== '0') {
+              lineArr.push([
+                { coord: [parseFloat(factory.value[0]), parseFloat(factory.value[1])] },
+                { coord: [parseFloat(station.value[0]), parseFloat(station.value[1])] }
+              ])
+              break
+            }
+          }
+        }
+      }
+      const curveness = 0.5
+      var seriesZero = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [20, 20],
+          symbolOffset: [0, -10],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: factorys
+        }
+      ]
+      var seriesOne = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [16, 16],
+          symbolOffset: [0, -8],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          // label: {
+          //   normal: {
+          //     show: true,
+          //     position: 'bottom',
+          //     formatter: '{b}',
+          //     fontSize: 12,
+          //     color: '#fff',
+          //     textBorderColor: '#2aa4e8',
+          //     offset: [0, 20]
+          //   }
+          // },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: stations
+        }
+      ]
+      var seriesThree = [
+        {
+          name: '',
+          type: 'lines',
+          coordinateSystem: 'GLMap',
+          zlevel: 1,
+          blendMode: 'lighter',
+          effect: {
+            show: true,
+            smooth: false,
+            trailLength: 0,
+            symbol: pointSymbol,
+            symbolSize: [10, 30],
+            period: 4
+          },
+          lineStyle: {
+            width: 2,
+            color: lineColor[0],
+            curveness: curveness
+          },
+          data: lineArr
+        }
+      ]
+      var seriesData = [...seriesZero, ...seriesThree]
+      const option = {
+        animation: false,
+        GLMap: {},
+        series: seriesData
+      }
+      var echartsLayer = new this.mars3d.layer.EchartsLayer(option)
+      this.factoryLineLayer = echartsLayer
+      this.map.addLayer(echartsLayer)
+    },
+    // 添加点位储量柱状图
     addFeatures(arr, type) {
       const { mars3d } = this
       const colorList = ['#d71345', '#f15a22', '#f47920', '#f47920', '#fcaf17', '#fcaf17', '#63AEFF', '#63AEFF', '#1d953f', '#1d953f']
@@ -238,7 +394,6 @@
       // 现在正在显示
       if (show) { // 移除
         this.stationStorageShow = false
-        console.log(this.stationStorageLayer)
         this.map.removeLayer(this.stationStorageLayer, true)
       } else {
         this.stationStorageShow = true
@@ -247,13 +402,15 @@
     },
     // 显示隐患分布
     showPosition(show) {
-      // if (show) { // 移除
-      //   this.positionShow = false
-      //   this.map.removeLayer(this.threatLayer, true)
-      // } else {
-      //   this.positionShow = true
-      //   this.addThreatPosition()
-      // }
+      if (show) { // 移除
+        this.factoryShow = false
+        this.map.removeLayer(this.factoryModelLayer, true)
+        // this.map.removeLayer(this.stationModelLayer, true)
+        this.map.removeLayer(this.factoryLineLayer, true)
+      } else {
+        this.factoryShow = true
+        this.addFactoryPosition()
+      }
     }
   }
 }
@@ -262,7 +419,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-container{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     .label-div{
diff --git a/src/views/maps/waterThreat.vue b/src/views/maps/waterThreat.vue
index 1db2b84..8070d15 100644
--- a/src/views/maps/waterThreat.vue
+++ b/src/views/maps/waterThreat.vue
@@ -43,7 +43,7 @@
 import SelectButton from '@/components/SelectTool/components/selectButton'
 import { getTimes } from '@/utils/dateutils'
 export default {
-  name: 'Index',
+  name: 'WaterThreat',
   components: {
     SelectAllConstruction,
     Weather,
@@ -218,8 +218,7 @@
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/output/jiaqizhan.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -366,7 +365,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/static/config/config.json b/static/config/config.json
index 95b4bcd..a21b33a 100644
--- a/static/config/config.json
+++ b/static/config/config.json
@@ -11,7 +11,8 @@
             "showSkyBox":false,
             "showSkyAtmosphere":false,
             "fog":false,
-            "fxaa":false,
+            "fxaa":true,
+            "scene3DOnly":true,
             "globe": {
                 "show":true,
                 "depthTestAgainstTerrain":false,
diff --git a/static/config/liquidFactory.json b/static/config/liquidFactory.json
index 5ac0282..02ae8d0 100644
--- a/static/config/liquidFactory.json
+++ b/static/config/liquidFactory.json
@@ -132,6 +132,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西燃气产业集团有限公司原平液化分公司"
         },
         {
@@ -142,6 +143,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团有限公司"
         },
         {
@@ -152,6 +154,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团有限公司"
         },
         {
@@ -162,6 +165,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团朔州有限公司"
         },
         {
@@ -172,6 +176,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气公司长治分公司"
         },
         {
@@ -182,6 +187,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -192,6 +198,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司平陆分公司"
         },
         {
@@ -202,6 +209,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -212,6 +220,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -222,6 +231,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -232,6 +242,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团吕梁有限公司"
         },
         {
@@ -242,6 +253,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -252,6 +264,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -262,6 +275,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -272,6 +286,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -282,6 +297,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -292,6 +308,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司万荣分公司"
         },
         {
@@ -302,6 +319,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司闻喜分公司"
         },
         {
@@ -312,6 +330,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司新绛分公司"
         },
         {
@@ -322,6 +341,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西天然气有限公司"
         },
         {
@@ -332,6 +352,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "太原国新清洁能源保德有限公司"
         },
         {
@@ -342,6 +363,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "交口县国兴新能源利用有限公司"
         },
         {
@@ -352,6 +374,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "襄垣漳江煤层气有限公司"
         },
         {
@@ -362,6 +385,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气(天然气)集输有限公司"
         },
         {
@@ -372,6 +396,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "国新下孔公司"
         },
         {
@@ -382,6 +407,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "长治市国新远东燃气有限公司"
         },
         {
@@ -392,6 +418,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气(天然气)集输有限公司"
         },
         {
@@ -1372,6 +1399,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1382,6 +1410,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1390,8 +1419,9 @@
             "111.7594150",
             "39.5082270"
           ],
-"contain":30,
+          "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1402,6 +1432,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1452,6 +1483,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用新朔公司 "
         },
         {
@@ -1462,6 +1494,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用新朔公司 "
         },
         {
diff --git a/static/images/map/linePoint1.png b/static/images/map/linePoint1.png
new file mode 100644
index 0000000..90aff53
--- /dev/null
+++ b/static/images/map/linePoint1.png
Binary files differ

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue
new file mode 100644
index 0000000..75516da
--- /dev/null
+++ b/src/views/maps/sinkThreat.vue
@@ -0,0 +1,415 @@
+<!--
+ * @Description: 塌陷专题
+ * @Author: 王晓颖
+ * @Date: 2021-04-09
+ -->
+<template>
+  <div id="centerDiv" class="mapcontainer">
+    <!--时钟-->
+    <clock/>
+    <!--天气-->
+    <weather/>
+    <!--选择区-->
+    <select-all-construction @change="selectChange" />
+    <!--统计结果显示-->
+    <div class="label-div">
+      <div class="label">
+        {{ boardData.name | boardNameFilter }}
+      </div>
+      <div class="value">
+        {{ boardData.value }}
+      </div>
+    </div>
+
+    <!--地图-->
+    <Map :url="configUrl" @onload="onMapload" />
+    <div class="map-btn-group">
+      <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
+      <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
+    </div>
+    <!--遮罩-->
+    <div class="mask">航天二院203所</div>
+  </div>
+</template>
+
+<script>
+import Map from '@/components/Map/MarsMap.vue'
+import 'mars3d-heatmap'
+import axios from 'axios'
+import Weather from '@/components/weather/weather'
+import Clock from '@/components/clock/Clock'
+import SelectAllConstruction from './components/selectAllConstruction'
+import SelectButton from '@/components/SelectTool/components/selectButton'
+import { getTimes } from '@/utils/dateutils'
+export default {
+  name: 'SinkThreat',
+  components: {
+    SelectAllConstruction,
+    Weather,
+    Clock,
+    Map,
+    SelectButton
+  },
+  filters: {
+    boardNameFilter(val) {
+      if (val === '全部' || val === '') {
+        return '全省塌陷'
+      } else {
+        return val + '区域塌陷'
+      }
+    }
+  },
+
+  data() {
+    return {
+      map: null, // 地图
+      configUrl: 'static/config/config.json',
+      alpha: 100, // 透明度
+      underground: null, // ？
+      heatShow: true, // 显示热力图
+      stationShow: true, // 显示管理处
+      positionShow: true, // 显示位置
+      boardData: {
+        name: '全部',
+        value: 196
+      }, // 统计版展示数据
+      threatLevel: {
+        '1': 'A级',
+        '2': 'B级',
+        '3': 'C级',
+        '4': '问题'
+      }, // 隐患等级
+      manageStations: [
+        { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' },
+        { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' },
+        { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' },
+        { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' },
+        { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' },
+        { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' },
+        { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' },
+        { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' }
+      ],
+      highConsequenceStation: [
+        { x: 112.73874, y: 37.693689, id: 0, name: '晋中管理处', count: 158 },
+        { x: 111.121552, y: 37.5245, id: 0, name: '吕梁管理处', count: 10 },
+        { x: 112.929902, y: 39.622888, id: 0, name: '同朔管理处', count: 44 },
+        { x: 112.72496, y: 38.415485, id: 0, name: '忻州管理处', count: 9 },
+        { x: 113.58249, y: 37.851892, id: 0, name: '阳泉管理处', count: 21 },
+        { x: 110.980927, y: 35.010828, id: 0, name: '运城管理处', count: 21 },
+        { x: 113.038394, y: 35.850111, id: 0, name: '长晋管理处', count: 11 },
+        { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
+      ],
+      highConsequence: [], // 高后果区列表
+      threatArea: [], // 第三方隐患列表
+      stationLayer: null, // 管理站图层
+      hqaLayer: null, // 塌陷热力图
+      threatLayer: null, // 塌陷分布图层
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
+      graphicLayer: null // 管理站标签图层
+    }
+  },
+  methods: {
+    // 地图构造完成回调
+    onMapload(map) {
+      // 以下为演示代码
+      this.map = map
+      // 背景透明
+      this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
+      this.map._viewer.scene.globe.baseColor.alpha = 0
+      this.addWaterHeat()
+      // 添加管理处
+      this.addStation()
+      this.addStationDiv()
+      // 添加塌陷隐患点
+      this.addThreatPosition()
+    },
+    // 高后果区热力图
+    addWaterHeat() {
+      const { mars3d } = this
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          const hqaLayer = new mars3d.layer.HeatLayer({
+            positions: this.highConsequence.map(item => {
+              return { lng: item['经度'], lat: item['纬度'], value: 1 }
+            }),
+            heatStyle: {
+              radius: 30, // 半径
+              blur: 1 // 模糊因子
+            },
+            // 以下为矩形矢量对象的样式参数
+            style: {
+              opacity: 0.8,
+              clampToGround: false,
+              height: 10000
+            },
+            redrawZoom: true,
+            flyTo: false
+          })
+          this.hqaLayer = hqaLayer
+          this.map.addLayer(hqaLayer)
+        }
+      })
+    },
+    // 塌陷位置
+    addThreatPosition() {
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.threatArea = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.threatArea.length
+          this.addFeatures(this.threatArea)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium, threatLevel } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />村庄地址：' +
+          item['村庄地址'] +
+          '<br />发现人：' +
+          item['发现人'] +
+          '<br />隐患描述：' +
+          item['隐患描述'] +
+          '<br />创建时间：' +
+          item['创建时间'] +
+          '<br />隐患等级：' +
+          threatLevel[item['隐患等级']]
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(item['隐患等级']) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
+    // 管理处
+    addStation() {
+      const { mars3d } = this
+      const stationLayer = new mars3d.layer.ModelLayer({
+        name: '管理处',
+        url: './static/gltf/output/guanlizhan.gltf',
+        style: {
+          scale: 20,
+          heading: 90,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.manageStations.map(item => {
+          return { lng: item.x, lat: item.y, alt: 0 }
+        })
+      })
+      this.stationLayer = stationLayer
+      this.map.addLayer(stationLayer)
+    },
+    // 选框发生变化
+    selectChange({ area, state, time, level }) {
+      area = area === '全部' ? '' : area
+      time = time === '全部' ? '' : time
+      level = level === '全部' ? '' : level
+      // 解析时间
+      let beginTime = ''
+      let endTime = ''
+      if (time) {
+        const result = getTimes(time)
+        beginTime = result.beginDate
+        endTime = result.endDate
+      }
+      this.boardData.name = area
+      // 查询数据
+      let count = 0
+      debugger
+      for (const hca of this.highConsequence) {
+        let flag = true // 标记是否合格
+        // 比较区域
+        if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) {
+          flag = false
+        }
+        // 比较时间
+        if (time) {
+          const real_date = new Date(hca['识别时间'])
+          if (real_date && (real_date < beginTime || real_date > endTime)) {
+            flag = false
+          }
+        }
+        // 比较级别
+        if (level && hca['隐患等级'] && hca['隐患等级'] === level) {
+          flag = false
+        }
+        if (flag) {
+          count++
+        }
+      }
+      this.boardData.value = count
+    },
+    // 自定义的弹窗
+    addStationDiv() {
+      const { Cesium, mars3d } = this
+      const graphicLayer = new mars3d.layer.GraphicLayer()
+      this.graphicLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      for (const station of this.highConsequenceStation) {
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(station.x, station.y, 10100),
+          style: {
+            html: `<div class="divpoint divpoint-theme-29baf1">
+                    <div class="divpoint-wrap">
+                        <div class="area">
+                            <div class="arrow-lt"></div>
+                            <div class="b-t"></div>
+                            <div class="b-r"></div>
+                            <div class="b-b"></div>
+                            <div class="b-l"></div>
+                            <div class="arrow-rb"></div>
+                            <div class="label-wrap">
+                                <div class="title">${station.name}</div>
+                                <div class="label-content">
+                                    <div class="data-li">
+                                        <div class="data-label">塌陷数量：</div>
+                                        <div class="data-value"><span class="label-num">${station.count}</span><span class="label-unit">个</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">经度：</div>
+                                        <div class="data-value"><span class="label-num">${station.x}</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">纬度：</div>
+                                        <div class="data-value"><span class="label-num">${station.y}</span>
+                                        </div>
+                                    </div>
+                                    `,
+            // anchor: [0, 0],
+            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
+            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10000, 500000), // 按视距距离显示
+            scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 500000, 0.1),
+            clampToGround: true,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
+          },
+          pointerEvents: false // false时不允许拾取和触发任意鼠标事件，但可以穿透div缩放地球
+        })
+        graphicLayer.addGraphic(graphic)
+        graphic.testPoint = false // 打开测试点，与DIV点进行对比位置调整css
+      }
+    },
+    // 是否显示热力图
+    showHeat(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.heatShow = false
+        this.map.removeLayer(this.hqaLayer, true)
+      } else {
+        this.heatShow = true
+        this.addWaterHeat()
+      }
+    },
+    // 显示管理处
+    showStation(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.stationShow = false
+        this.map.removeLayer(this.stationLayer, true)
+        this.map.removeLayer(this.graphicLayer, true)
+      } else {
+        this.stationShow = true
+        this.addStation()
+        this.addStationDiv()
+      }
+    },
+    // 显示隐患分布
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .label-div{
+    position: absolute;
+    top: 140px;
+    left:31rem;
+    z-index:100;
+    color: white;
+    padding:2rem 3rem 1.5rem 3rem;
+    background-image: url("../../assets/button_images/board-box1.png");
+    background-size: 100% 100%;
+    .label{
+      margin-bottom: 1rem;
+      font-size:1.2rem;
+    }
+    .value{
+      font-family: DS-DigitalBold;
+      font-size:2.5rem;
+    }
+  }
+  .map-btn-group{
+    position: absolute;
+    bottom:3rem;
+    left:50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: center;
+  }
+</style>
+
+<style rel="stylesheet/scss" lang="scss">
+  /*整个容器*/
+  .mapcontainer {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    background-color: transparent;
+    /*background-color: #051151;*/
+  }
+  /*logo遮罩*/
+  .mask{
+    position: fixed;
+    padding-left:10px;
+    padding-right:10px;
+    bottom:0px;
+    left:0px;
+    background-color:#000000;
+    color:#ffffff;
+    line-height:2
+  }
+
+</style>
diff --git a/src/views/maps/storageTopic.vue b/src/views/maps/storageTopic.vue
index fc01f51..8b6cfc0 100644
--- a/src/views/maps/storageTopic.vue
+++ b/src/views/maps/storageTopic.vue
@@ -10,7 +10,7 @@
     <!--天气-->
     <weather/>
     <!--选择区-->
-    <select-all-storage @change="selectChange" />
+    <!--<select-all-storage @change="selectChange" />-->
     <!--统计结果显示-->
     <div class="label-container">
       <div class="label-div">
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import 'mars3d-echarts'
 import Map from '@/components/Map/MarsMap.vue'
 import 'mars3d-heatmap'
 import axios from 'axios'
@@ -51,7 +52,7 @@
 import SelectAllStorage from './components/selectAllStorage'
 import SelectButton from '@/components/SelectTool/components/selectButton'
 export default {
-  name: 'Index',
+  name: 'StorageTopic',
   components: {
     SelectAllStorage,
     Weather,
@@ -74,9 +75,8 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      factoryShow: true, // 显示液化工厂
-      gasStationShow: true, // 显示加气站
-      positionShow: true, // 显示位置
+      factoryShow: false, // 显示液化工厂
+      // gasStationShow: false, // 显示加气站
       factoryStorageShow: true, // 液化工厂储量
       stationStorageShow: false, // 加气站储量
       liquidFactoryData: {
@@ -89,9 +89,11 @@
       }, // 统计版展示数据
       liquidFactory: [], // 液化工厂数据
       gasStation: [], // 加气站
-      stationLayer: null, // 管理站图层
       factoryStorageLayer: null, // 液化工厂分布图层
       stationStorageLayer: null, // 加气站存储层
+      factoryModelLayer: null, // 液化工厂模型层
+      stationModelLayer: null, // 加气站模型层
+      factoryLineLayer: null, // 飞线层
       pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       graphicLayer: null // 管理站标签图层
 
@@ -105,10 +107,10 @@
       // 背景透明
       this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
       this.map._viewer.scene.globe.baseColor.alpha = 0
-      this.addFactoryPosition()
+      this.addFactoryStorage()
     },
-    // 液化工厂位置
-    addFactoryPosition() {
+    // 液化工厂储量效果图
+    addFactoryStorage() {
       axios.get('static/config/liquidFactory.json').then((res) => {
         res = res.data
         if (res.code === 200) {
@@ -121,10 +123,164 @@
           // 添加点位
           this.addFeatures(this.liquidFactory, 'liquidFactory')
           // this.addFeatures(this.gasStation, 'gasStation')
+          // this.addFactoryPosition()
         }
       })
     },
-    // 添加隐患点储量柱状图
+    // 液化工厂三维模型
+    addFactoryModel() {
+      const { mars3d } = this
+      const factoryModelLayer = new mars3d.layer.ModelLayer({
+        name: '液化工厂',
+        url: './static/gltf/output/yehuagongchang.gltf',
+        style: {
+          scale: 20,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.liquidFactory.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.factoryModelLayer = factoryModelLayer
+      this.map.addLayer(factoryModelLayer)
+    },
+    addStationModel() {
+      const { mars3d } = this
+      const stationModelLayer = new mars3d.layer.ModelLayer({
+        name: '加气站',
+        url: './static/gltf/output/jiaqizhan.gltf',
+        style: {
+          scale: 10,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.gasStation.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.stationModelLayer = stationModelLayer
+      this.map.addLayer(stationModelLayer)
+    },
+    // 液化工厂和加气站位置飞线
+    addFactoryPosition() {
+      this.addFactoryModel() // 添加液化工厂三维模型
+      // this.addStationModel() // 添加加气站三维模型
+      const lineColor = ['#f6fb05', '#f6fb05', '#00fcff']
+      // 城市点位图标
+      const symbol1 = 'image://static/images/map/symbol2.png'
+      const symbol2 = 'image://static/images/map/symbol1.png'
+      // 线上的动态运动点图标
+      var pointSymbol = 'image://static/images/map/linePoint1.png'
+      // 工厂加symbol
+      const factorys = this.liquidFactory.map(item => {
+        return { ...item, symbol: symbol1 }
+      })
+      // 加气站加symbol
+      const stations = this.gasStation.map(item => {
+        return { ...item, symbol: symbol2 }
+      })
+      // 遍历获取关联关系
+      const lineArr = []
+      for (const station of stations) {
+        if (station.belong && station.value[0] !== '0') {
+          for (const factory of factorys) {
+            if (station.belong === factory.name && factory.value[0] !== '0') {
+              lineArr.push([
+                { coord: [parseFloat(factory.value[0]), parseFloat(factory.value[1])] },
+                { coord: [parseFloat(station.value[0]), parseFloat(station.value[1])] }
+              ])
+              break
+            }
+          }
+        }
+      }
+      const curveness = 0.5
+      var seriesZero = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [20, 20],
+          symbolOffset: [0, -10],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: factorys
+        }
+      ]
+      var seriesOne = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [16, 16],
+          symbolOffset: [0, -8],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          // label: {
+          //   normal: {
+          //     show: true,
+          //     position: 'bottom',
+          //     formatter: '{b}',
+          //     fontSize: 12,
+          //     color: '#fff',
+          //     textBorderColor: '#2aa4e8',
+          //     offset: [0, 20]
+          //   }
+          // },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: stations
+        }
+      ]
+      var seriesThree = [
+        {
+          name: '',
+          type: 'lines',
+          coordinateSystem: 'GLMap',
+          zlevel: 1,
+          blendMode: 'lighter',
+          effect: {
+            show: true,
+            smooth: false,
+            trailLength: 0,
+            symbol: pointSymbol,
+            symbolSize: [10, 30],
+            period: 4
+          },
+          lineStyle: {
+            width: 2,
+            color: lineColor[0],
+            curveness: curveness
+          },
+          data: lineArr
+        }
+      ]
+      var seriesData = [...seriesZero, ...seriesThree]
+      const option = {
+        animation: false,
+        GLMap: {},
+        series: seriesData
+      }
+      var echartsLayer = new this.mars3d.layer.EchartsLayer(option)
+      this.factoryLineLayer = echartsLayer
+      this.map.addLayer(echartsLayer)
+    },
+    // 添加点位储量柱状图
     addFeatures(arr, type) {
       const { mars3d } = this
       const colorList = ['#d71345', '#f15a22', '#f47920', '#f47920', '#fcaf17', '#fcaf17', '#63AEFF', '#63AEFF', '#1d953f', '#1d953f']
@@ -238,7 +394,6 @@
       // 现在正在显示
       if (show) { // 移除
         this.stationStorageShow = false
-        console.log(this.stationStorageLayer)
         this.map.removeLayer(this.stationStorageLayer, true)
       } else {
         this.stationStorageShow = true
@@ -247,13 +402,15 @@
     },
     // 显示隐患分布
     showPosition(show) {
-      // if (show) { // 移除
-      //   this.positionShow = false
-      //   this.map.removeLayer(this.threatLayer, true)
-      // } else {
-      //   this.positionShow = true
-      //   this.addThreatPosition()
-      // }
+      if (show) { // 移除
+        this.factoryShow = false
+        this.map.removeLayer(this.factoryModelLayer, true)
+        // this.map.removeLayer(this.stationModelLayer, true)
+        this.map.removeLayer(this.factoryLineLayer, true)
+      } else {
+        this.factoryShow = true
+        this.addFactoryPosition()
+      }
     }
   }
 }
@@ -262,7 +419,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-container{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     .label-div{
diff --git a/src/views/maps/waterThreat.vue b/src/views/maps/waterThreat.vue
index 1db2b84..8070d15 100644
--- a/src/views/maps/waterThreat.vue
+++ b/src/views/maps/waterThreat.vue
@@ -43,7 +43,7 @@
 import SelectButton from '@/components/SelectTool/components/selectButton'
 import { getTimes } from '@/utils/dateutils'
 export default {
-  name: 'Index',
+  name: 'WaterThreat',
   components: {
     SelectAllConstruction,
     Weather,
@@ -218,8 +218,7 @@
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/output/jiaqizhan.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -366,7 +365,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/static/config/config.json b/static/config/config.json
index 95b4bcd..a21b33a 100644
--- a/static/config/config.json
+++ b/static/config/config.json
@@ -11,7 +11,8 @@
             "showSkyBox":false,
             "showSkyAtmosphere":false,
             "fog":false,
-            "fxaa":false,
+            "fxaa":true,
+            "scene3DOnly":true,
             "globe": {
                 "show":true,
                 "depthTestAgainstTerrain":false,
diff --git a/static/config/liquidFactory.json b/static/config/liquidFactory.json
index 5ac0282..02ae8d0 100644
--- a/static/config/liquidFactory.json
+++ b/static/config/liquidFactory.json
@@ -132,6 +132,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西燃气产业集团有限公司原平液化分公司"
         },
         {
@@ -142,6 +143,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团有限公司"
         },
         {
@@ -152,6 +154,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团有限公司"
         },
         {
@@ -162,6 +165,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团朔州有限公司"
         },
         {
@@ -172,6 +176,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气公司长治分公司"
         },
         {
@@ -182,6 +187,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -192,6 +198,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司平陆分公司"
         },
         {
@@ -202,6 +209,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -212,6 +220,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -222,6 +231,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -232,6 +242,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团吕梁有限公司"
         },
         {
@@ -242,6 +253,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -252,6 +264,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -262,6 +275,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -272,6 +286,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -282,6 +297,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -292,6 +308,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司万荣分公司"
         },
         {
@@ -302,6 +319,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司闻喜分公司"
         },
         {
@@ -312,6 +330,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司新绛分公司"
         },
         {
@@ -322,6 +341,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西天然气有限公司"
         },
         {
@@ -332,6 +352,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "太原国新清洁能源保德有限公司"
         },
         {
@@ -342,6 +363,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "交口县国兴新能源利用有限公司"
         },
         {
@@ -352,6 +374,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "襄垣漳江煤层气有限公司"
         },
         {
@@ -362,6 +385,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气(天然气)集输有限公司"
         },
         {
@@ -372,6 +396,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "国新下孔公司"
         },
         {
@@ -382,6 +407,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "长治市国新远东燃气有限公司"
         },
         {
@@ -392,6 +418,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气(天然气)集输有限公司"
         },
         {
@@ -1372,6 +1399,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1382,6 +1410,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1390,8 +1419,9 @@
             "111.7594150",
             "39.5082270"
           ],
-"contain":30,
+          "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1402,6 +1432,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1452,6 +1483,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用新朔公司 "
         },
         {
@@ -1462,6 +1494,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用新朔公司 "
         },
         {
diff --git a/static/images/map/linePoint1.png b/static/images/map/linePoint1.png
new file mode 100644
index 0000000..90aff53
--- /dev/null
+++ b/static/images/map/linePoint1.png
Binary files differ
diff --git a/static/images/map/symbol1.png b/static/images/map/symbol1.png
new file mode 100644
index 0000000..3016695
--- /dev/null
+++ b/static/images/map/symbol1.png
Binary files differ

diff --git a/favicon.ico b/favicon.ico
index 586e43b..ee64a52 100644
--- a/favicon.ico
+++ b/favicon.ico
Binary files differ
diff --git a/src/components/Map/MarsMap.vue b/src/components/Map/MarsMap.vue
index ee7f2a4..e6c3b12 100644
--- a/src/components/Map/MarsMap.vue
+++ b/src/components/Map/MarsMap.vue
@@ -47,7 +47,11 @@
       default: ''
     }
   },
-
+  data() {
+    return {
+      lastEntity: null
+    }
+  },
   mounted() {
     const { mars3d } = this
     if (this.appendToBody) {
@@ -194,6 +198,7 @@
       })
       this.map.addLayer(geoJsonLayer1)
     },
+    // 添加省地块
     addProvincePolygon() {
       const { mars3d, Cesium } = this
       var graphicLayer = new mars3d.layer.DivLayer()
@@ -206,7 +211,6 @@
             const coordinates = (features[i].geometry.coordinates[0][0]).map(item => {
               return [item[0], item[1], 0]
             })
-            console.log(features[i].geometry.coordinates)
             const graphic = new mars3d.graphic.PolygonEntity({
               positions: coordinates,
               style: {
@@ -246,8 +250,48 @@
             })
             graphicLayer.addGraphic(graphic)
           }
+          // graphicLayer.on(mars3d.EventType.mouseOver, event => {
+          //   console.log('鼠标移入图层', event)
+          //   console.log(event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.highlightedEntity(entity)
+          //   }
+          // })
+          // graphicLayer.on(mars3d.EventType.mouseOut, event => {
+          //   console.log('鼠标移出图层', event)
+          //   var entity = event.czmObject
+          //   if (entity && entity.polygon) {
+          //     this.clearLastHighlightedEntity()
+          //   }
+          // })
         }
       })
+    },
+    // 高亮
+    highlightedEntity(entity) {
+      if (!entity || !entity.polygon) {
+        return
+      }
+      const color = entity.polygon.material.color
+      const outline = entity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#1ff5ff')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = entity
+    },
+    // 清除高亮
+    clearLastHighlightedEntity() {
+      const { lastEntity } = this
+      if (lastEntity == null) {
+        return
+      }
+      var color = lastEntity.polygon.material.color
+      const outline = lastEntity.polygon.outlineColor
+      const nclr = this.mars3d.Cesium.Color.fromCssColorString('#3a77da')
+      color.setValue(nclr)
+      outline.setValue(nclr)
+      this.lastEntity = null
     }
   }
 }
diff --git a/src/permission.js b/src/permission.js
index 0d677e4..eb6c110 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -8,7 +8,7 @@
 
 NProgress.configure({ showSpinner: false })// NProgress configuration
 
-const whiteList = ['/login', 'config/baseconfig', '/full/mapLayer'] // 不重定向白名单
+const whiteList = ['/login', 'config/baseconfig', '/full/storageTopic', '/full/waterThreat', '/full/highConsequence', '/full/constructionThreat', '/full/waterThreat', '/full/sinkThreat'] // 不重定向白名单
 // 全局钩子
 router.beforeEach((to, from, next) => {
   NProgress.start() // 加载进度条
diff --git a/src/router/index.js b/src/router/index.js
index 3a2a60e..2378caa 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,22 +54,34 @@
   },
   {
     path: '/full/highConsequence',
-    name: 'MapLayer',
+    name: 'HighConsequence',
     component: () => import('@/views/maps/highConsequenceArea'),
     meta: { title: '高后果区', icon: '' }
   },
   {
-    path: '/full/mapLayer',
-    name: 'MapLayer',
-    component: () => import('@/views/maps/mapOverview'),
-    meta: { title: '测试大屏', icon: '' }
+    path: '/full/storageTopic',
+    name: 'StorageTopic',
+    component: () => import('@/views/maps/storageTopic'),
+    meta: { title: '储备专题', icon: '' }
   },
   {
     path: '/full/constructionThreat',
-    name: 'MapLayer',
+    name: 'ConstructionThreat',
     component: () => import('@/views/maps/constructionThreat'),
     meta: { title: '第三方施工', icon: '' }
   },
+  {
+    path: '/full/waterThreat',
+    name: 'WaterThreat',
+    component: () => import('@/views/maps/waterThreat'),
+    meta: { title: '水保隐患', icon: '' }
+  },
+  {
+    path: '/full/sinkThreat',
+    name: 'SinkThreat',
+    component: () => import('@/views/maps/sinkThreat'),
+    meta: { title: '塌陷专题', icon: '' }
+  },
   // 九宫格
   { path: '/dashboard', component: () => import('@/views/dashboard/index'), hidden: true }
 ]
diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js
index f9672fd..02a883d 100644
--- a/src/router/modules/marsMap.js
+++ b/src/router/modules/marsMap.js
@@ -89,7 +89,7 @@
       }, {
         path: '/sinkTopic',
         name: 'SinkTopic',
-        component: () => import('@/views/maps/mapOverview'),
+        component: () => import('@/views/maps/sinkThreat'),
         meta: { title: '塌陷专题', icon: '' }
       }, {
         path: '/waterThreatTopic',
diff --git a/src/views/maps/constructionThreat.vue b/src/views/maps/constructionThreat.vue
index 8778698..afc00a5 100644
--- a/src/views/maps/constructionThreat.vue
+++ b/src/views/maps/constructionThreat.vue
@@ -366,7 +366,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/highConsequenceArea.vue b/src/views/maps/highConsequenceArea.vue
index ad3e81b..251e45f 100644
--- a/src/views/maps/highConsequenceArea.vue
+++ b/src/views/maps/highConsequenceArea.vue
@@ -25,6 +25,7 @@
     <Map :url="configUrl" @onload="onMapload" />
     <div class="map-btn-group">
       <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
       <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
     </div>
     <!--遮罩-->
@@ -66,8 +67,9 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      heatShow: true,
-      stationShow: true,
+      heatShow: true, // 热力图显示
+      stationShow: true, // 管理站显示
+      positionShow: false, // 点位显示
       boardData: {
         name: '全部',
         value: 196
@@ -93,7 +95,14 @@
         { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
       ],
       highConsequence: [],
+      threatLevel: {
+        'I级': '1',
+        'II级': '2',
+        'III级': '3'
+      }, // 隐患等级
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       stationLayer: null, // 管理站图层
+      threatLayer: null, // 隐患位置
       hqaLayer: null, // 高后果区热力图
       graphicLayer: null // 管理站标签图层
     }
@@ -142,13 +151,70 @@
         }
       })
     },
+    // 高后果区位置
+    addThreatPosition() {
+      axios.get('static/config/highConsequence.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          this.addFeatures(this.highConsequence)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />所属管理处：' +
+          item['所属管理处'] +
+          '<br />高后果区长度：' +
+          item['高后果区长度'] +
+          '<br />高后果区特征描述：' +
+          item['高后果区特征描述'] +
+          '<br />识别时间：' +
+          item['识别时间'] +
+          '<br />高后果区级别：' +
+          item['高后果区级别']
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(this.threatLevel[item['高后果区级别']]) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
     // 管理处
     addStation() {
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/house02.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -301,6 +367,16 @@
         this.addStation()
         this.addStationDiv()
       }
+    },
+    // 显示位置
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
     }
   }
 }
@@ -309,7 +385,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/src/views/maps/sinkThreat.vue b/src/views/maps/sinkThreat.vue
new file mode 100644
index 0000000..75516da
--- /dev/null
+++ b/src/views/maps/sinkThreat.vue
@@ -0,0 +1,415 @@
+<!--
+ * @Description: 塌陷专题
+ * @Author: 王晓颖
+ * @Date: 2021-04-09
+ -->
+<template>
+  <div id="centerDiv" class="mapcontainer">
+    <!--时钟-->
+    <clock/>
+    <!--天气-->
+    <weather/>
+    <!--选择区-->
+    <select-all-construction @change="selectChange" />
+    <!--统计结果显示-->
+    <div class="label-div">
+      <div class="label">
+        {{ boardData.name | boardNameFilter }}
+      </div>
+      <div class="value">
+        {{ boardData.value }}
+      </div>
+    </div>
+
+    <!--地图-->
+    <Map :url="configUrl" @onload="onMapload" />
+    <div class="map-btn-group">
+      <select-button :select="heatShow" name="热力图" icon="icon-heat" @click="showHeat"/>
+      <select-button :select="positionShow" name="点位分布" icon="icon-position" @click="showPosition"/>
+      <select-button :select="stationShow" name="管理处" icon="icon-station" @click="showStation"/>
+    </div>
+    <!--遮罩-->
+    <div class="mask">航天二院203所</div>
+  </div>
+</template>
+
+<script>
+import Map from '@/components/Map/MarsMap.vue'
+import 'mars3d-heatmap'
+import axios from 'axios'
+import Weather from '@/components/weather/weather'
+import Clock from '@/components/clock/Clock'
+import SelectAllConstruction from './components/selectAllConstruction'
+import SelectButton from '@/components/SelectTool/components/selectButton'
+import { getTimes } from '@/utils/dateutils'
+export default {
+  name: 'SinkThreat',
+  components: {
+    SelectAllConstruction,
+    Weather,
+    Clock,
+    Map,
+    SelectButton
+  },
+  filters: {
+    boardNameFilter(val) {
+      if (val === '全部' || val === '') {
+        return '全省塌陷'
+      } else {
+        return val + '区域塌陷'
+      }
+    }
+  },
+
+  data() {
+    return {
+      map: null, // 地图
+      configUrl: 'static/config/config.json',
+      alpha: 100, // 透明度
+      underground: null, // ？
+      heatShow: true, // 显示热力图
+      stationShow: true, // 显示管理处
+      positionShow: true, // 显示位置
+      boardData: {
+        name: '全部',
+        value: 196
+      }, // 统计版展示数据
+      threatLevel: {
+        '1': 'A级',
+        '2': 'B级',
+        '3': 'C级',
+        '4': '问题'
+      }, // 隐患等级
+      manageStations: [
+        { 'x': 112.73874, 'y': 37.693689, 'z': 0, 'name': '晋中管理处' },
+        { 'x': 111.121552, 'y': 37.5245, 'z': 0, 'name': '吕梁管理处' },
+        { 'x': 112.929902, 'y': 39.622888, 'z': 0, 'name': '同朔管理处' },
+        { 'x': 112.72496, 'y': 38.415485, 'z': 0, 'name': '忻州管理处' },
+        { 'x': 113.58249, 'y': 37.851892, 'z': 0, 'name': '阳泉管理处' },
+        { 'x': 110.980927, 'y': 35.010828, 'z': 0, 'name': '运城管理处' },
+        { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' },
+        { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' }
+      ],
+      highConsequenceStation: [
+        { x: 112.73874, y: 37.693689, id: 0, name: '晋中管理处', count: 158 },
+        { x: 111.121552, y: 37.5245, id: 0, name: '吕梁管理处', count: 10 },
+        { x: 112.929902, y: 39.622888, id: 0, name: '同朔管理处', count: 44 },
+        { x: 112.72496, y: 38.415485, id: 0, name: '忻州管理处', count: 9 },
+        { x: 113.58249, y: 37.851892, id: 0, name: '阳泉管理处', count: 21 },
+        { x: 110.980927, y: 35.010828, id: 0, name: '运城管理处', count: 21 },
+        { x: 113.038394, y: 35.850111, id: 0, name: '长晋管理处', count: 11 },
+        { x: 111.491467, y: 36.064572, id: 0, name: '临汾管理处', count: 30 }
+      ],
+      highConsequence: [], // 高后果区列表
+      threatArea: [], // 第三方隐患列表
+      stationLayer: null, // 管理站图层
+      hqaLayer: null, // 塌陷热力图
+      threatLayer: null, // 塌陷分布图层
+      pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
+      graphicLayer: null // 管理站标签图层
+    }
+  },
+  methods: {
+    // 地图构造完成回调
+    onMapload(map) {
+      // 以下为演示代码
+      this.map = map
+      // 背景透明
+      this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
+      this.map._viewer.scene.globe.baseColor.alpha = 0
+      this.addWaterHeat()
+      // 添加管理处
+      this.addStation()
+      this.addStationDiv()
+      // 添加塌陷隐患点
+      this.addThreatPosition()
+    },
+    // 高后果区热力图
+    addWaterHeat() {
+      const { mars3d } = this
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.highConsequence = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.highConsequence.length
+          const hqaLayer = new mars3d.layer.HeatLayer({
+            positions: this.highConsequence.map(item => {
+              return { lng: item['经度'], lat: item['纬度'], value: 1 }
+            }),
+            heatStyle: {
+              radius: 30, // 半径
+              blur: 1 // 模糊因子
+            },
+            // 以下为矩形矢量对象的样式参数
+            style: {
+              opacity: 0.8,
+              clampToGround: false,
+              height: 10000
+            },
+            redrawZoom: true,
+            flyTo: false
+          })
+          this.hqaLayer = hqaLayer
+          this.map.addLayer(hqaLayer)
+        }
+      })
+    },
+    // 塌陷位置
+    addThreatPosition() {
+      axios.get('static/config/waterThreat.json').then((res) => {
+        res = res.data
+        if (res.code === 200) {
+          // 过滤掉经度为null的
+          this.threatArea = res.data.filter(item => item['经度'] !== null)
+          this.boardData.value = this.threatArea.length
+          this.addFeatures(this.threatArea)
+        }
+      })
+    },
+    // 添加隐患点
+    addFeatures(arr) {
+      const { mars3d, Cesium, threatLevel } = this
+      // 创建DIV数据图层
+      var graphicLayer = new mars3d.layer.DivLayer()
+      this.threatLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      // 在layer上绑定监听事件
+      graphicLayer.on(mars3d.EventType.click, function(event) {
+        console.log('监听layer，单击了矢量对象', event)
+      })
+      graphicLayer.bindPopup(function(event) {
+        const item = event.graphic.attr
+        var html =
+          '位置描述：' +
+          item['位置描述'] +
+          '<br />村庄地址：' +
+          item['村庄地址'] +
+          '<br />发现人：' +
+          item['发现人'] +
+          '<br />隐患描述：' +
+          item['隐患描述'] +
+          '<br />创建时间：' +
+          item['创建时间'] +
+          '<br />隐患等级：' +
+          threatLevel[item['隐患等级']]
+        return html
+      })
+
+      for (var i = 0, len = arr.length; i < len; i++) {
+        const item = arr[i]
+        var jd = item['经度']
+        var wd = item['纬度']
+        const level = parseInt(item['隐患等级']) - 1
+        var clr = this.pointColorArr[level]
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(jd, wd, 0),
+          style: {
+            html: '<div class="mars3d-animation-point" style="color:' + clr + ';"><p></p></div>',
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000) // 按视距距离显示
+          },
+          attr: item
+        })
+        graphicLayer.addGraphic(graphic)
+      }
+    },
+    // 管理处
+    addStation() {
+      const { mars3d } = this
+      const stationLayer = new mars3d.layer.ModelLayer({
+        name: '管理处',
+        url: './static/gltf/output/guanlizhan.gltf',
+        style: {
+          scale: 20,
+          heading: 90,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.manageStations.map(item => {
+          return { lng: item.x, lat: item.y, alt: 0 }
+        })
+      })
+      this.stationLayer = stationLayer
+      this.map.addLayer(stationLayer)
+    },
+    // 选框发生变化
+    selectChange({ area, state, time, level }) {
+      area = area === '全部' ? '' : area
+      time = time === '全部' ? '' : time
+      level = level === '全部' ? '' : level
+      // 解析时间
+      let beginTime = ''
+      let endTime = ''
+      if (time) {
+        const result = getTimes(time)
+        beginTime = result.beginDate
+        endTime = result.endDate
+      }
+      this.boardData.name = area
+      // 查询数据
+      let count = 0
+      debugger
+      for (const hca of this.highConsequence) {
+        let flag = true // 标记是否合格
+        // 比较区域
+        if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) {
+          flag = false
+        }
+        // 比较时间
+        if (time) {
+          const real_date = new Date(hca['识别时间'])
+          if (real_date && (real_date < beginTime || real_date > endTime)) {
+            flag = false
+          }
+        }
+        // 比较级别
+        if (level && hca['隐患等级'] && hca['隐患等级'] === level) {
+          flag = false
+        }
+        if (flag) {
+          count++
+        }
+      }
+      this.boardData.value = count
+    },
+    // 自定义的弹窗
+    addStationDiv() {
+      const { Cesium, mars3d } = this
+      const graphicLayer = new mars3d.layer.GraphicLayer()
+      this.graphicLayer = graphicLayer
+      this.map.addLayer(graphicLayer)
+      for (const station of this.highConsequenceStation) {
+        var graphic = new mars3d.graphic.DivGraphic({
+          position: Cesium.Cartesian3.fromDegrees(station.x, station.y, 10100),
+          style: {
+            html: `<div class="divpoint divpoint-theme-29baf1">
+                    <div class="divpoint-wrap">
+                        <div class="area">
+                            <div class="arrow-lt"></div>
+                            <div class="b-t"></div>
+                            <div class="b-r"></div>
+                            <div class="b-b"></div>
+                            <div class="b-l"></div>
+                            <div class="arrow-rb"></div>
+                            <div class="label-wrap">
+                                <div class="title">${station.name}</div>
+                                <div class="label-content">
+                                    <div class="data-li">
+                                        <div class="data-label">塌陷数量：</div>
+                                        <div class="data-value"><span class="label-num">${station.count}</span><span class="label-unit">个</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">经度：</div>
+                                        <div class="data-value"><span class="label-num">${station.x}</span>
+                                        </div>
+                                    </div>
+                                    <div class="data-li">
+                                        <div class="data-label">纬度：</div>
+                                        <div class="data-value"><span class="label-num">${station.y}</span>
+                                        </div>
+                                    </div>
+                                    `,
+            // anchor: [0, 0],
+            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
+            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10000, 500000), // 按视距距离显示
+            scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 500000, 0.1),
+            clampToGround: true,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
+          },
+          pointerEvents: false // false时不允许拾取和触发任意鼠标事件，但可以穿透div缩放地球
+        })
+        graphicLayer.addGraphic(graphic)
+        graphic.testPoint = false // 打开测试点，与DIV点进行对比位置调整css
+      }
+    },
+    // 是否显示热力图
+    showHeat(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.heatShow = false
+        this.map.removeLayer(this.hqaLayer, true)
+      } else {
+        this.heatShow = true
+        this.addWaterHeat()
+      }
+    },
+    // 显示管理处
+    showStation(show) {
+      // 现在正在显示
+      if (show) { // 移除
+        this.stationShow = false
+        this.map.removeLayer(this.stationLayer, true)
+        this.map.removeLayer(this.graphicLayer, true)
+      } else {
+        this.stationShow = true
+        this.addStation()
+        this.addStationDiv()
+      }
+    },
+    // 显示隐患分布
+    showPosition(show) {
+      if (show) { // 移除
+        this.positionShow = false
+        this.map.removeLayer(this.threatLayer, true)
+      } else {
+        this.positionShow = true
+        this.addThreatPosition()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .label-div{
+    position: absolute;
+    top: 140px;
+    left:31rem;
+    z-index:100;
+    color: white;
+    padding:2rem 3rem 1.5rem 3rem;
+    background-image: url("../../assets/button_images/board-box1.png");
+    background-size: 100% 100%;
+    .label{
+      margin-bottom: 1rem;
+      font-size:1.2rem;
+    }
+    .value{
+      font-family: DS-DigitalBold;
+      font-size:2.5rem;
+    }
+  }
+  .map-btn-group{
+    position: absolute;
+    bottom:3rem;
+    left:50%;
+    transform: translateX(-50%);
+    display: flex;
+    justify-content: center;
+  }
+</style>
+
+<style rel="stylesheet/scss" lang="scss">
+  /*整个容器*/
+  .mapcontainer {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    background-color: transparent;
+    /*background-color: #051151;*/
+  }
+  /*logo遮罩*/
+  .mask{
+    position: fixed;
+    padding-left:10px;
+    padding-right:10px;
+    bottom:0px;
+    left:0px;
+    background-color:#000000;
+    color:#ffffff;
+    line-height:2
+  }
+
+</style>
diff --git a/src/views/maps/storageTopic.vue b/src/views/maps/storageTopic.vue
index fc01f51..8b6cfc0 100644
--- a/src/views/maps/storageTopic.vue
+++ b/src/views/maps/storageTopic.vue
@@ -10,7 +10,7 @@
     <!--天气-->
     <weather/>
     <!--选择区-->
-    <select-all-storage @change="selectChange" />
+    <!--<select-all-storage @change="selectChange" />-->
     <!--统计结果显示-->
     <div class="label-container">
       <div class="label-div">
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import 'mars3d-echarts'
 import Map from '@/components/Map/MarsMap.vue'
 import 'mars3d-heatmap'
 import axios from 'axios'
@@ -51,7 +52,7 @@
 import SelectAllStorage from './components/selectAllStorage'
 import SelectButton from '@/components/SelectTool/components/selectButton'
 export default {
-  name: 'Index',
+  name: 'StorageTopic',
   components: {
     SelectAllStorage,
     Weather,
@@ -74,9 +75,8 @@
       configUrl: 'static/config/config.json',
       alpha: 100, // 透明度
       underground: null, // ？
-      factoryShow: true, // 显示液化工厂
-      gasStationShow: true, // 显示加气站
-      positionShow: true, // 显示位置
+      factoryShow: false, // 显示液化工厂
+      // gasStationShow: false, // 显示加气站
       factoryStorageShow: true, // 液化工厂储量
       stationStorageShow: false, // 加气站储量
       liquidFactoryData: {
@@ -89,9 +89,11 @@
       }, // 统计版展示数据
       liquidFactory: [], // 液化工厂数据
       gasStation: [], // 加气站
-      stationLayer: null, // 管理站图层
       factoryStorageLayer: null, // 液化工厂分布图层
       stationStorageLayer: null, // 加气站存储层
+      factoryModelLayer: null, // 液化工厂模型层
+      stationModelLayer: null, // 加气站模型层
+      factoryLineLayer: null, // 飞线层
       pointColorArr: ['#f33349', '#f79a2c', '#f2fa19', '#95e40c', '#1ffee6'],
       graphicLayer: null // 管理站标签图层
 
@@ -105,10 +107,10 @@
       // 背景透明
       this.map._viewer.scene.backgroundColor = new this.Cesium.Color(0.0, 0.0, 0.0, 0.0)
       this.map._viewer.scene.globe.baseColor.alpha = 0
-      this.addFactoryPosition()
+      this.addFactoryStorage()
     },
-    // 液化工厂位置
-    addFactoryPosition() {
+    // 液化工厂储量效果图
+    addFactoryStorage() {
       axios.get('static/config/liquidFactory.json').then((res) => {
         res = res.data
         if (res.code === 200) {
@@ -121,10 +123,164 @@
           // 添加点位
           this.addFeatures(this.liquidFactory, 'liquidFactory')
           // this.addFeatures(this.gasStation, 'gasStation')
+          // this.addFactoryPosition()
         }
       })
     },
-    // 添加隐患点储量柱状图
+    // 液化工厂三维模型
+    addFactoryModel() {
+      const { mars3d } = this
+      const factoryModelLayer = new mars3d.layer.ModelLayer({
+        name: '液化工厂',
+        url: './static/gltf/output/yehuagongchang.gltf',
+        style: {
+          scale: 20,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.liquidFactory.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.factoryModelLayer = factoryModelLayer
+      this.map.addLayer(factoryModelLayer)
+    },
+    addStationModel() {
+      const { mars3d } = this
+      const stationModelLayer = new mars3d.layer.ModelLayer({
+        name: '加气站',
+        url: './static/gltf/output/jiaqizhan.gltf',
+        style: {
+          scale: 10,
+          heading: 0,
+          minimumPixelSize: 30,
+          clampToGround: true
+        },
+        positions: this.gasStation.map(item => {
+          return { lng: parseFloat(item.value[0]), lat: parseFloat(item.value[1]), alt: 0 }
+        })
+      })
+      this.stationModelLayer = stationModelLayer
+      this.map.addLayer(stationModelLayer)
+    },
+    // 液化工厂和加气站位置飞线
+    addFactoryPosition() {
+      this.addFactoryModel() // 添加液化工厂三维模型
+      // this.addStationModel() // 添加加气站三维模型
+      const lineColor = ['#f6fb05', '#f6fb05', '#00fcff']
+      // 城市点位图标
+      const symbol1 = 'image://static/images/map/symbol2.png'
+      const symbol2 = 'image://static/images/map/symbol1.png'
+      // 线上的动态运动点图标
+      var pointSymbol = 'image://static/images/map/linePoint1.png'
+      // 工厂加symbol
+      const factorys = this.liquidFactory.map(item => {
+        return { ...item, symbol: symbol1 }
+      })
+      // 加气站加symbol
+      const stations = this.gasStation.map(item => {
+        return { ...item, symbol: symbol2 }
+      })
+      // 遍历获取关联关系
+      const lineArr = []
+      for (const station of stations) {
+        if (station.belong && station.value[0] !== '0') {
+          for (const factory of factorys) {
+            if (station.belong === factory.name && factory.value[0] !== '0') {
+              lineArr.push([
+                { coord: [parseFloat(factory.value[0]), parseFloat(factory.value[1])] },
+                { coord: [parseFloat(station.value[0]), parseFloat(station.value[1])] }
+              ])
+              break
+            }
+          }
+        }
+      }
+      const curveness = 0.5
+      var seriesZero = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [20, 20],
+          symbolOffset: [0, -10],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: factorys
+        }
+      ]
+      var seriesOne = [
+        {
+          type: 'effectScatter',
+          layout: 'none',
+          coordinateSystem: 'GLMap',
+          symbolSize: [16, 16],
+          symbolOffset: [0, -8],
+          zlevel: 3,
+          circular: {
+            rotateLabel: true
+          },
+          // label: {
+          //   normal: {
+          //     show: true,
+          //     position: 'bottom',
+          //     formatter: '{b}',
+          //     fontSize: 12,
+          //     color: '#fff',
+          //     textBorderColor: '#2aa4e8',
+          //     offset: [0, 20]
+          //   }
+          // },
+          itemStyle: {
+            normal: {
+              shadowColor: 'none'
+            }
+          },
+          data: stations
+        }
+      ]
+      var seriesThree = [
+        {
+          name: '',
+          type: 'lines',
+          coordinateSystem: 'GLMap',
+          zlevel: 1,
+          blendMode: 'lighter',
+          effect: {
+            show: true,
+            smooth: false,
+            trailLength: 0,
+            symbol: pointSymbol,
+            symbolSize: [10, 30],
+            period: 4
+          },
+          lineStyle: {
+            width: 2,
+            color: lineColor[0],
+            curveness: curveness
+          },
+          data: lineArr
+        }
+      ]
+      var seriesData = [...seriesZero, ...seriesThree]
+      const option = {
+        animation: false,
+        GLMap: {},
+        series: seriesData
+      }
+      var echartsLayer = new this.mars3d.layer.EchartsLayer(option)
+      this.factoryLineLayer = echartsLayer
+      this.map.addLayer(echartsLayer)
+    },
+    // 添加点位储量柱状图
     addFeatures(arr, type) {
       const { mars3d } = this
       const colorList = ['#d71345', '#f15a22', '#f47920', '#f47920', '#fcaf17', '#fcaf17', '#63AEFF', '#63AEFF', '#1d953f', '#1d953f']
@@ -238,7 +394,6 @@
       // 现在正在显示
       if (show) { // 移除
         this.stationStorageShow = false
-        console.log(this.stationStorageLayer)
         this.map.removeLayer(this.stationStorageLayer, true)
       } else {
         this.stationStorageShow = true
@@ -247,13 +402,15 @@
     },
     // 显示隐患分布
     showPosition(show) {
-      // if (show) { // 移除
-      //   this.positionShow = false
-      //   this.map.removeLayer(this.threatLayer, true)
-      // } else {
-      //   this.positionShow = true
-      //   this.addThreatPosition()
-      // }
+      if (show) { // 移除
+        this.factoryShow = false
+        this.map.removeLayer(this.factoryModelLayer, true)
+        // this.map.removeLayer(this.stationModelLayer, true)
+        this.map.removeLayer(this.factoryLineLayer, true)
+      } else {
+        this.factoryShow = true
+        this.addFactoryPosition()
+      }
     }
   }
 }
@@ -262,7 +419,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-container{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     .label-div{
diff --git a/src/views/maps/waterThreat.vue b/src/views/maps/waterThreat.vue
index 1db2b84..8070d15 100644
--- a/src/views/maps/waterThreat.vue
+++ b/src/views/maps/waterThreat.vue
@@ -43,7 +43,7 @@
 import SelectButton from '@/components/SelectTool/components/selectButton'
 import { getTimes } from '@/utils/dateutils'
 export default {
-  name: 'Index',
+  name: 'WaterThreat',
   components: {
     SelectAllConstruction,
     Weather,
@@ -218,8 +218,7 @@
       const { mars3d } = this
       const stationLayer = new mars3d.layer.ModelLayer({
         name: '管理处',
-        url: './static/gltf/output/jiaqizhan.gltf',
-        // url: './static/gltf/qwe.gltf',
+        url: './static/gltf/output/guanlizhan.gltf',
         style: {
           scale: 20,
           heading: 0,
@@ -366,7 +365,7 @@
 <style rel="stylesheet/scss" lang="scss" scoped>
   .label-div{
     position: absolute;
-    top: 6.5rem;
+    top: 140px;
     left:31rem;
     z-index:100;
     color: white;
diff --git a/static/config/config.json b/static/config/config.json
index 95b4bcd..a21b33a 100644
--- a/static/config/config.json
+++ b/static/config/config.json
@@ -11,7 +11,8 @@
             "showSkyBox":false,
             "showSkyAtmosphere":false,
             "fog":false,
-            "fxaa":false,
+            "fxaa":true,
+            "scene3DOnly":true,
             "globe": {
                 "show":true,
                 "depthTestAgainstTerrain":false,
diff --git a/static/config/liquidFactory.json b/static/config/liquidFactory.json
index 5ac0282..02ae8d0 100644
--- a/static/config/liquidFactory.json
+++ b/static/config/liquidFactory.json
@@ -132,6 +132,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西燃气产业集团有限公司原平液化分公司"
         },
         {
@@ -142,6 +143,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团有限公司"
         },
         {
@@ -152,6 +154,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团有限公司"
         },
         {
@@ -162,6 +165,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团朔州有限公司"
         },
         {
@@ -172,6 +176,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气公司长治分公司"
         },
         {
@@ -182,6 +187,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -192,6 +198,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司平陆分公司"
         },
         {
@@ -202,6 +209,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -212,6 +220,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -222,6 +231,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团临汾有限公司"
         },
         {
@@ -232,6 +242,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团吕梁有限公司"
         },
         {
@@ -242,6 +253,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -252,6 +264,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -262,6 +275,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -272,6 +286,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -282,6 +297,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团晋东有限公司"
         },
         {
@@ -292,6 +308,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司万荣分公司"
         },
         {
@@ -302,6 +319,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司闻喜分公司"
         },
         {
@@ -312,6 +330,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西压缩天然气集团运城有限公司新绛分公司"
         },
         {
@@ -322,6 +341,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西天然气有限公司"
         },
         {
@@ -332,6 +352,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "太原国新清洁能源保德有限公司"
         },
         {
@@ -342,6 +363,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "交口县国兴新能源利用有限公司"
         },
         {
@@ -352,6 +374,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "襄垣漳江煤层气有限公司"
         },
         {
@@ -362,6 +385,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气(天然气)集输有限公司"
         },
         {
@@ -372,6 +396,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "国新下孔公司"
         },
         {
@@ -382,6 +407,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "长治市国新远东燃气有限公司"
         },
         {
@@ -392,6 +418,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong": "山西平遥液化天然气有限责任公司",
           "company": "山西煤层气(天然气)集输有限公司"
         },
         {
@@ -1372,6 +1399,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1382,6 +1410,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1390,8 +1419,9 @@
             "111.7594150",
             "39.5082270"
           ],
-"contain":30,
+          "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1402,6 +1432,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用忻州公司"
         },
         {
@@ -1452,6 +1483,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用新朔公司 "
         },
         {
@@ -1462,6 +1494,7 @@
           ],
           "contain":30,
           "liquid_level": 5.85,
+          "belong":"太原国新洁净液化天然气有限公司",
           "company": "国新利用新朔公司 "
         },
         {
diff --git a/static/images/map/linePoint1.png b/static/images/map/linePoint1.png
new file mode 100644
index 0000000..90aff53
--- /dev/null
+++ b/static/images/map/linePoint1.png
Binary files differ
diff --git a/static/images/map/symbol1.png b/static/images/map/symbol1.png
new file mode 100644
index 0000000..3016695
--- /dev/null
+++ b/static/images/map/symbol1.png
Binary files differ
diff --git a/static/images/map/symbol2.png b/static/images/map/symbol2.png
new file mode 100644
index 0000000..2961b50
--- /dev/null
+++ b/static/images/map/symbol2.png
Binary files differ