diff --git a/index.html b/index.html
index 8e9a515..ad60b94 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <title>big-data</title>
+    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=b6c27a2051691fcb386543c800356e05"></script>
     <!-- <link rel="stylesheet" href="static/Cesium/Widgets/widgets.css"> -->
     <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
     <script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-min.js"></script>

diff --git a/index.html b/index.html
index 8e9a515..ad60b94 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <title>big-data</title>
+    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=b6c27a2051691fcb386543c800356e05"></script>
     <!-- <link rel="stylesheet" href="static/Cesium/Widgets/widgets.css"> -->
     <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
     <script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-min.js"></script>
diff --git a/src/views/layout/layout1.vue b/src/views/layout/layout1.vue
index 43f3d8f..037cd5f 100644
--- a/src/views/layout/layout1.vue
+++ b/src/views/layout/layout1.vue
@@ -13,7 +13,8 @@
       <div class="map-body">
         <div class="middle">
           <!--<map2-d/>-->
-          <JyMap2D/>
+          <!--<JyMap2D/>-->
+          <gaode-map/>
         </div>
       </div>
       <!--图表图层-->
@@ -39,9 +40,11 @@
 import CityConstructionRight from '../cityConstruction/cityConstructionRight'
 import WaitBoardLeft from '../waitBoard/waitBoardLeft'
 import WaitBoardRight from '../waitBoard/waitBoardRight'
+import GaodeMap from "../mapViews/gaodeMap";
 export default {
   name: 'layout1',
   components: {
+    GaodeMap,
     WaitBoardRight,
     WaitBoardLeft,
     JyMap2D,

diff --git a/index.html b/index.html
index 8e9a515..ad60b94 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <title>big-data</title>
+    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=b6c27a2051691fcb386543c800356e05"></script>
     <!-- <link rel="stylesheet" href="static/Cesium/Widgets/widgets.css"> -->
     <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
     <script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-min.js"></script>
diff --git a/src/views/layout/layout1.vue b/src/views/layout/layout1.vue
index 43f3d8f..037cd5f 100644
--- a/src/views/layout/layout1.vue
+++ b/src/views/layout/layout1.vue
@@ -13,7 +13,8 @@
       <div class="map-body">
         <div class="middle">
           <!--<map2-d/>-->
-          <JyMap2D/>
+          <!--<JyMap2D/>-->
+          <gaode-map/>
         </div>
       </div>
       <!--图表图层-->
@@ -39,9 +40,11 @@
 import CityConstructionRight from '../cityConstruction/cityConstructionRight'
 import WaitBoardLeft from '../waitBoard/waitBoardLeft'
 import WaitBoardRight from '../waitBoard/waitBoardRight'
+import GaodeMap from "../mapViews/gaodeMap";
 export default {
   name: 'layout1',
   components: {
+    GaodeMap,
     WaitBoardRight,
     WaitBoardLeft,
     JyMap2D,
diff --git a/src/views/mapViews/gaodeMap.vue b/src/views/mapViews/gaodeMap.vue
new file mode 100644
index 0000000..79a990d
--- /dev/null
+++ b/src/views/mapViews/gaodeMap.vue
@@ -0,0 +1,444 @@
+<!--
+ * @Description: 地图坐标拾取工具
+ * @Author: 王晓颖
+ * @Date: 2020-09-09 10:18:08
+ -->
+<template>
+  <div style="width: 100%; height:100%">
+    <div style="width:100%; height:100%;position:relative">
+      <div id="map_container" style="width:100%; height:100%;"></div>
+      <!--选项卡-->
+      <!--<div style="position:absolute;top:20px;right:80px;z-index:100">-->
+        <!--&lt;!&ndash;<button1 v-model="layersShow.roadShow" @click.native="layersShow.roadShow=!layersShow.roadShow">网格</button1><br/>&ndash;&gt;-->
+        <!--<button1 v-model="layersShow.cameraShow" @click.native="showCameras">摄像头</button1><br/>-->
+        <!--&lt;!&ndash;<button1 v-model="layersShow.peopleShow" @click.native="showShuangChuang">人员</button1><br/>&ndash;&gt;-->
+        <!--<button1 v-model="layersShow.constructionShow" @click.native="showConstruction">工地</button1><br/>-->
+        <!--<button1 v-model="layersShow.truckShow" @click.native="showConstructionCars">渣土车</button1><br/>-->
+        <!--<button1 v-model="layersShow.caseShow" @click.native="showCase">事件</button1>-->
+      <!--</div>-->
+      <!--&lt;!&ndash; 统计面板&ndash;&gt;-->
+      <!--<camera :raw-data="cameraStaticData" v-if="layersShow.cameraShow"/>-->
+      <!--<people v-if="layersShow.peopleShow"/>-->
+      <!--<case v-if="layersShow.caseShow"/>-->
+
+      <!--&lt;!&ndash; 视频播放器 &ndash;&gt;-->
+      <!--<div v-show="videoShow" class="videoBox">-->
+        <!--<div class="videoBox-subBox" v-show="videoShow">-->
+          <!--<span class="videoClose" @click="videoShow = false;videoUrl = '';">关闭</span>-->
+          <!--<div class="prism-player" id="player-con"></div>-->
+        <!--</div>-->
+      <!--</div>-->
+    </div>
+  </div>
+</template>
+
+<script>
+import FMap from '@/components/fMap/components/fMap'
+import {fetchConstructionCars, fetchShuangchuang, fetchCase} from '@/api/cityManage'
+import FMapFeatures from '@/components/fMap/components/fMapFeatures'
+import Button1 from '@/components/button/button1'
+import MapWindow from '../../components/mapWindow/mapWindow'
+import {fetchBoundary, fetchAreaBoundary} from '@/api/geojson'
+import {fetchConstructions} from '@/api/construction'
+import {fetchVideoToken, fetchFlushVideoToken, fetchChannels, fetchVideo} from '@/api/camera'
+import Zhatu from './components/zhatu'
+import People from './panelBoard/people'
+import Case from './panelBoard/case'
+import Camera from './panelBoard/camera'
+export default {
+  name: 'GaodeMap',
+  components: {Case, Zhatu, People, Camera, MapWindow, FMapFeatures, FMap, Button1},
+  data () {
+    var that = this
+    return {
+      map: null,
+      type: 'blackVector', // 地图类型
+      plugins: ['mapswitch', 'mouseposition'], // 插件
+      zoom: 13, // 缩放等级
+      layers: {
+        default: {name: 'default', title: '默认图层', symbol: ''},
+        boundary: {name: 'boundary', title: '边界图层', selectable: false, style: 'fill:rgba(3,89,164,0.1);stroke-color:#00FFFF;stroke-width:2;'},
+        areaBoundary: {name: 'areaBoundary', title: '乡镇图层', selectable: false, style: 'fill:rgba(3,89,164,0.1);stroke-color:#FFFFF;stroke-width:2;'},
+        car: {name: 'car', title: '车辆', bubbleable: true, bubble: 'truckBB', symbol: 'track-ztc'},
+        construction: {name: 'construction', title: '工地', bubbleable: true, bubble: 'constructionBB', symbol: 'construction'},
+        police: {name: 'police', title: '交通', symbol: 'police'},
+        volunteers: {name: 'volunteers', type: 'Clust', animation: true, bubble: 'myclustBB', title: '志愿者', symbol: 'volunteers'},
+        volunteer: {name: 'volunteer', bubbleable: true, bubble: 'volunteerBB', title: '志愿者1', symbol: 'volunteer'},
+        caseHandle: {name: 'caseHandle', bubbleable: true, bubble: 'caseBB', title: '已处理事件', symbol: 'case-handle'},
+        caseOvertime: {name: 'caseOvertime', bubbleable: true, bubble: 'caseBB', title: '超期事件', symbol: 'case-over'},
+        caseWait: {name: 'caseWait', bubbleable: true, bubble: 'caseBB', title: '待处理事件', symbol: 'case-wait'},
+        boxCamera: {name: 'boxCamera',
+          title: '摄像头',
+          bubble: 'cameraBB',
+          textable: true,
+          text: '11111',
+          onmousein: function (data) {
+            that.fmap.singleSelectedFeature(data.feature)
+          },
+          onmouseout: function (data) {
+            that.fmap.closeSingleBubble()
+          },
+          onclick: function (event) { that.getVideo(event.feature.values_.clients.channelId) },
+          symbol: 'camera2'}
+      }, // 往fmap注入的图层
+      boundaryData: [], // 边界数据
+      areaBoundaryData: [], // 乡镇级行政区数据
+      constructionData: [], // 工地数据
+      truckData: [], // 渣土车位置数据
+      cameraStaticData: {}, // 摄像头统计数据
+      cameraData: [], // 摄像头位置数据
+      peopleData: [], // 网格员数据
+      caseHandleData: [], // 案件数据
+      caseOvertimeData: [], // 案件数据
+      caseWaitData: [], // 案件数据
+      videoToken: '', // 视频云token
+      videoTimer: null, // 视频定时器
+      videoCount: 60, // 倒计时
+      videoChannels: [], // 视频通道
+      onlineVideoChannels: [], // 在线视频通道列表
+      offlineVideoChannels: [], // 离线视频通道列表
+      videoUrl: '', // 视频地址
+      videoShow: false, // 视频的显示
+      player: null, // 播放器1
+      currentPlayer: 'player', // 当前切换palyer
+      layersShow: {
+        roadShow: true, // 道路是否显示
+        cameraShow: false, // 摄像头图层显示
+        peopleShow: false, // 双创志愿者图层显示
+        caseShow: false, // 案件图层显示
+        truckShow: false, // 渣土车图层显示
+        constructionShow: false // 工地图层显示
+      }
+    }
+  },
+  mounted () {
+    // this.getBoundary()
+    this.initMap()
+  },
+  methods: {
+    initMap () {
+      const map = new AMap.Map('map_container', {
+        pitch: 60, // 地图俯仰角度，有效范围 0 度- 83 度(0为俯视，83为平视）
+        viewMode: '3D', // 地图模式
+        // mapStyle:'amap://styles/darkblue',
+        mapStyle: 'amap://styles/2edca5ba52e0757ca363f8d6ccce42b5',
+        zoom: 17,
+        zooms: [3, 20],
+        center: [116.358113, 39.850946],
+        expandZoomRange: true, // 加上这个设置可以放大到20级，否则最大只能放大到18级
+        resizeEnable: true,
+        rotateEnable: true,
+        pitchEnable: true
+      })
+      this.map = map
+      map.addControl(new AMap.ControlBar({
+        showZoomBar: false,
+        showControlButton: true,
+        position: {
+          right: '10px',
+          top: '10px'
+        }
+      }))
+    },
+    // 地图准备好后的操作，返回fmap对象
+    mapReady ({fmap}) {
+      this.fmap = fmap
+      // this.showCase()
+    },
+    // 获取行政区划
+    getBoundary () {
+      // 精一接口
+      fetchBoundary().then(response => {
+        if (response.code === '1') {
+          const data = response.data.data[0].data
+          this.boundaryData = data
+        }
+      })
+    },
+    // 获取乡镇区划
+    getAreaBoundary () {
+      fetchAreaBoundary().then(response => {
+        if (response.code === '1') {
+          const data = response.data.data[0].data
+          this.areaBoundaryData = data
+        }
+      })
+    },
+    // 处理渣土车按钮点击后的操作
+    showConstructionCars () {
+      this.controlLayersShow('truckShow')
+      this.getConstructionCars()
+    },
+    // 获取渣土车数据
+    getConstructionCars () {
+      fetchConstructionCars().then(response => {
+        if (response.code === 200) {
+          this.truckData = response.data
+        }
+      })
+    },
+    // 处理人员按钮后的操作
+    showShuangChuang () {
+      this.controlLayersShow('shuangchuangShow')
+      this.getShuangchuangData()
+    },
+    // 获取人员数据
+    getShuangchuangData () {
+      fetchShuangchuang().then(response => {
+        if (response.code === 200) {
+          this.shuangchuangData = response.data
+        }
+      })
+    },
+    // 处理事件按钮后的操作
+    showCase () {
+      this.controlLayersShow('caseShow')
+      this.getCaseData()
+    },
+    // 获取事件数据
+    getCaseData () {
+      fetchCase().then(response => {
+        if (response.code === 200) {
+          const data = response.data
+          // 按照不同类型过滤
+          this.caseOvertimeData = data.filter((v) => { return v.normState === '5' })
+          this.caseHandleData = data.filter((v) => { return v.status === '2' })
+          this.caseWaitData = data.filter((v) => { return v.status === '3' })
+        }
+      })
+    },
+    // 显示工地
+    showConstruction () {
+      this.controlLayersShow('constructionShow')
+      this.getConstructionData()
+    },
+    // 获取在建工地数据
+    getConstructionData () {
+      fetchConstructions().then(response => {
+        if (response.code === '1') {
+          const data = response.data.data[0].data
+          this.constructionData = data
+        }
+      })
+    },
+    // 处理摄像头按钮点击后的操作
+    showCameras () {
+      this.controlLayersShow('cameraShow')
+      this.getCamerasData()
+    },
+    // 获取摄像头点位数据
+    getCamerasData () {
+      this.getVideoToken() // 获取视频token
+      // fetchTrafficCameras().then(response => {
+      //   if (response.code === '1') {
+      //     this.cameraStaticData = {
+      //       total: response.data.total,
+      //       online: response.data.total
+      //     }
+      //     this.cameraData = response.data.data[0].data
+      //   }
+      // })
+    }, // 处理事件按钮后的操作
+    // 控制各层显示
+    controlLayersShow (layerName) {
+      for (const key in this.layersShow) {
+        if (key === layerName) {
+          this.layersShow[key] = true
+        } else {
+          if (key !== 'roadShow') {
+            this.layersShow[key] = false
+          }
+        }
+      }
+    },
+    // 获取视频相关参数
+    getVideoToken () {
+      fetchVideoToken().then(res => {
+        if (res.code === 1) {
+          this.videoToken = res.data
+          this.getChannels()
+          this.videoTimer = setInterval(() => {
+            if (this.videoCount > 1) {
+              this.videoCount--
+            } else {
+              this.getFlushVideoToken()
+            }
+          }, 1000)
+        }
+      })
+    },
+    // 刷新token
+    getFlushVideoToken () {
+      this.videoCount = 60
+      let params = {
+        'token': this.videoToken
+      }
+      fetchFlushVideoToken(params).then(res => {
+        if (res.code === 1) {
+          this.videoToken = res.data
+        }
+      })
+    },
+    // 获取所有通道
+    getChannels () {
+      let params = {
+        'token': this.videoToken
+      }
+      fetchChannels(params).then(res => {
+        if (res.code === 1) {
+          // this.videoChannels = res.data
+          this.videoChannels = res.data.filter((item) => {
+            return item.online === '1'
+          })
+          this.offlineVideoChannels = res.data.filter((item) => {
+            return item.online !== '1'
+          })
+          this.cameraStaticData = {
+            total: res.data.length,
+            online: this.videoChannels.length
+          }
+        }
+      })
+    },
+    // 获取视频
+    getVideo (channelId) {
+      let params = {
+        'token': this.videoToken,
+        'channelId': channelId
+      }
+      fetchVideo(params).then(res => {
+        if (res.code === 1) {
+          const videoUrl = res.data.url
+          if (videoUrl) {
+            if (this.currentPlayer === 'player') {
+              this.videoUrl = videoUrl
+              this.videoShow = true
+              this.videoPlay1(videoUrl)
+              this.currentPlayer = 'player'
+            }
+          } else {
+            alert('no videoUrl')
+          }
+        }
+      })
+    },
+    // 视频播放1
+    videoPlay1 (videoUrl) {
+      let id = 'player-con'
+      !this.player && (this.player = new Aliplayer({
+        id: id,
+        width: '100%',
+        height: '100%',
+        autoplay: true, // 自动播放
+        isLive: true,
+        // rePlay: true,  // 重复播放
+        // 支持播放地址播放,此播放优先级最高
+        source: videoUrl
+      }, function (player) {
+        console.log('播放器创建好了。')
+      }))
+      // 切换视频地址
+      this.player && this.player.loadByUrl(this.videoUrl)
+      // 播放器暂停/播放
+      var _video = document.querySelector('video')
+      this.player.on('play', function (e) {
+        _video.removeEventListener('click', play)
+        _video.addEventListener('click', pause)
+      })
+      this.player.on('pause', function (e) {
+        _video.removeEventListener('click', pause)
+        _video.addEventListener('click', play)
+      })
+      function play () {
+        if (this.player) this.player.play()
+      }
+      function pause () {
+        if (this.player) this.player.pause()
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .button {
+    float: left;
+    min-width: 150px;
+    max-width: 250px;
+    display: block;
+    margin: 1em;
+    padding: 1em 2em;
+    border: none;
+    /*background: none;*/
+    color: white;
+    vertical-align: middle;
+    position: relative;
+    z-index: 1;
+    -webkit-backface-visibility: hidden;
+    -moz-osx-font-smoothing: grayscale;
+  }
+  .button--round-s {
+    border-radius: 5px;
+  }
+  .button--border-thin {
+    border: 1px solid;
+  }
+  button--saqui {
+    border-color: #ECEFF1;
+    overflow: hidden;
+    color: #fff;
+    background: #37474f;
+    -webkit-transition: background-color 0.3s ease-in, color 0.3s ease-in;
+    transition: background-color 0.3s ease-in, color 0.3s ease-in;
+    .button--inverted {
+      background: #fff;
+      color: #37474f;
+    }
+    button--inverted::after {
+      color: #fff;
+    }
+  }
+  .button--saqui::after {
+    content: attr(data-text);
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    padding: 1em 2em;
+    color: #37474f;
+    -webkit-transform-origin: -25% 50%;
+    transform-origin: -25% 50%;
+    -webkit-transform: rotate3d(0, 0, 1, 45deg);
+    transform: rotate3d(0, 0, 1, 45deg);
+    -webkit-transition: -webkit-transform 0.3s ease-in;
+    transition: transform 0.3s ease-in;
+  }
+  .videoBox{
+    position:absolute;
+    bottom:0;
+    right:0;
+    z-index:999;
+    width:3.8rem;
+    height:2.55rem;
+    background:#000000;
+    display:flex;
+    align-items: start;
+    flex-wrap: wrap;
+    .videoBox-subBox{
+      width: 100%;
+      height:100%;
+      position:relative;
+    }
+  }
+  .videoClose{
+    position: absolute;
+    right: .05rem;
+    top: .06rem;
+    display: inline-block;
+    color:#fff;
+    font-size: .09rem;
+    z-index:999;
+    cursor: pointer;
+  }
+</style>