angular6 安装百度地图

文章参考

1. 百度地图 Cannot read property ‘gc’ of undefined
2. Angular引入百度地图js,显示不出来

开发步骤

1. 申请百度地图密钥

2. 在Angular项目中引入百度地图API文件，在index.html中引入

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

3. 在html中定义地图组件高宽度

<div id="map" style="height: 300px;width: 300px;"></div>

4. 在组件中初始化地图

// html已经挂载，我们要操作DOM 节点，应该在这个方法中执行
ngAfterViewInit () {
  const map = new BMap.Map('map');                   //创建地图实例
  const point = new BMap.Point(116.404, 39.915);     //创建点坐标
  map.centerAndZoom(point, 15);                      //初始化地图，设置中心点坐标和地图级别
  map.enableScrollWheelZoom(true);                   //开启鼠标滚轮缩放
  console.log(map);
}

如何去掉百度的logo?

添加一个CSS 样式

.anchorBL{
  display:none;
}