高德 定位到所在城市

 
<template>
  <div>
    <div id="container" style="width: 1200px; height: 500px"></div>
  </div>
</template>

<script>
import AMapLoader from "@amap/amap-jsapi-loader";
let map = {};
export default {
  data() {
    return {
    };
  },
  mounted() {
    this.initMap();
  },
  methods: {
    initMap() {
      AMapLoader.load({
        key: "e7e915c3e7eb0905762eddb068becb54",
        plugin: [
          "AMap.Scale",
          "AMap.OverView",
          "AMap.ToolBar",
          "AMap.MapType",
          "AMap.MassMarks",
        ],
        version: "2.0",
      })
        .then((AMap) => {
          map = new AMap.Map("container", {
            zoom: 4,
            // center: [102.342785, 35.312316],
            showIndoorMap: false,
            viewMode: "3D",
          });
          AMap.plugin("AMap.CitySearch", function () {
            var citySearch = new AMap.CitySearch();
            citySearch.getLocalCity(function (status, result) {
              if (status === "complete" && result.info === "OK") {
                // 查询成功,result即为当前所在城市信息
                var cityinfo = result.city; //当前所在城市
                var citybounds = result.bounds; //为了定位到所在城市
                //地图显示当前城市
                map.setBounds(citybounds);
              }
            });
          });
        })
        .catch((e) => {
          console.log(e);
        });
    },
  },
};
</script>

<style>
</style>

 

posted @ 2020-10-22 16:30  栀夏。  阅读(439)  评论(0编辑  收藏  举报