版权声明：代码共享，欢迎copy https://blog.csdn.net/qq_29073921/article/details/82688812
这是目录
一、引入高德地图API
高德地图官方示例：https://lbs.amap.com/api/javascript-api/example/map/map-show
前台调用高德地图开发之前要先引入，高德地图API，
<script src="https://webapi.amap.com/maps?v=1.4.10&key=您申请的key值"></script>
“您申请的key值”需要到高德地图申请；https://lbs.amap.com/dev/key/app
二、高德地图开发
1、定义一个div来存放地图
<body>
<div id="gaode_map"></div>
</body>2、生成地图
<script type="text/javascript">
var map = new AMap.Map('gaode_map', {
resizeEnable: true, //是否监控地图容器尺寸变化
zoom:11, //初始化地图层级
center: [116.397428, 39.90923] //初始化地图中心点
});
</script>3、添加一个跳跃的点
var marker = new AMap.Marker({//定义一个点
position: map.getCenter(),
draggable: true,
cursor: 'move'
});
marker.setMap(map);
// 设置点标记的动画效果，此处为弹跳效果
marker.setAnimation('AMAP_ANIMATION_BOUNCE');4、添加控件
var scale = new AMap.Scale({//定义比例尺
visible: true
}),
toolBar = new AMap.ToolBar({//定义工具条
visible: true
}),
overView = new AMap.OverView({//定义方向盘
visible: true
}),
map.addControl(scale);//添加比例尺
map.addControl(toolBar);//添加工具条
map.addControl(overView);//添加方向盘