• 在Vue框架中使用百度地图


    1、首先在index.html中引入百度地图

    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的秘钥"></script>

    2、在组建中设置一个容器

    <template>
      <div class="box">
        <div id="boxMap"></div>
      </div>
    </template>

    3、设置容器样式

    .box{
        width: 100%;
        min-height: 800px;
    }
    #boxMap {
        width: 100%;
        min-height: 800px;
    }

    4、创建地图实例

    export default {
    data() {
          return {}
        },
        methods: {
          _getMapData() {
            let map = new BMap.Map("firePowerMap");  // 创建Map实例
            let point = new BMap.Point(116.404, 39.915);
            map.centerAndZoom(point, 12);
            map.setCurrentCity("北京"); // 地图显示的城市
            map.enableScrollWheelZoom(true);  //开启鼠标滚轮缩放
            window.map = map;//将map变量储存在全局
    //****将map变量存储在全局,只有将地图储存在全局,别的方法才能取到 } }

    必须要给容器设置高度!

    必须把地图变量储存在全局!

  • 相关阅读:
    ios 重构笔记
    ios uiwindow笔记
    ios静态库笔记
    ios app提交之前需要哪几个证书
    int、long、long long取值范围
    字节概述
    序列化概述
    LeetCode 最大连续子数列值
    198. LeetCode 打家劫舍
    git自定义关键字
  • 原文地址:https://www.cnblogs.com/xinchenhui/p/8984537.html
Copyright © 2020-2023  润新知