zoukankan      html  css  js  c++  java
  • 高德 定位到所在城市

     
    <template>
      <div>
        <div id="container" style=" 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>
  • 相关阅读:
    c++ 用宏代替常用的函数
    爬取网易云音乐(包括歌词和评论)
    三种常见的单例模式
    函数式编程filter和map的区别
    四种常见排序算法(快速,冒泡,插入,选择排序)
    6.微信撤回消息的获取
    5.微信拜年短信自动回复
    4.深拷贝和浅拷贝
    3.迭代器以及迭代器的作用
    2.生成器计算出斐波那契数列
  • 原文地址:https://www.cnblogs.com/lh1998/p/13859061.html
Copyright © 2011-2022 走看看