引入高德地图配置

Posted 笑嘻嘻的小银

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了引入高德地图配置相关的知识,希望对你有一定的参考价值。

var map = new AMap.Map(‘container‘, {
        resizeEnable: true,
        zoom:14,
        center: [120.73915601,30.2306131]
    });
    map.plugin(["AMap.ToolBar"], function() {
        map.addControl(new AMap.ToolBar());
    });

    var marker = new AMap.Marker({
        position: map.getCenter()
    });

    marker.setMap(map);
    // 设置鼠标划过点标记显示的文字提示
    marker.setTitle(‘我是marker的title‘);

    // 设置label标签
    marker.setLabel({//label默认蓝框白底左上角显示,样式className为:amap-marker-label
        offset: new AMap.Pixel(-40, -40),//修改label相对于maker的位置
        content: "鱼跃港"
    });

CSS部分

.amap-marker-label{
  color: #000;
  border: 0;
  padding:10px 30px;
  box-shadow: 2px 2px 5px #000;
  font-size: 14px;
  font-weight: bold;
}

 

以上是关于引入高德地图配置的主要内容,如果未能解决你的问题,请参考以下文章

vue中引入高德地图Loca数据可视化

vue中引入高德地图Loca数据可视化

vue中引入高德地图Loca数据可视化

vue2.0使用高德地图第三方插件

uniapp 获取地图数据(高德地理编码反地理编码)插件 Ba-AMapData

Vue项目中引入高德地图步骤详解