1.导入jquery.js文件:<script type="text/javascript" src="js/jquery.js"></script>
2.导入百度地图JS: <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
3.编写JS:
<script type="text/javascript">
3.编写JS:
<script type="text/javascript">
$().ready(function() {
// 百度地图API功能开始
var map = new BMap.Map("allmap");//allmap为div的id
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
var marker;
function showInfo(e){
map.removeOverlay(marker);
marker = new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat)); // 创建标注
map.addOverlay(marker); //清除之前创建的标注点
marker.enableDragging();//允许标注点拖拽
marker.addEventListener("dragend", showInfo);//拖拽标注点可获取经纬度
$("#lng").val(e.point.lng);//经度input控件赋值
$("#lat").val(e.point.lat);//纬度input控件赋值
}
map.addEventListener("click", showInfo);//点击地图获取经纬度
map.addControl(new BMap.NavigationControl()); //添加默认缩放平移控件
map.enableScrollWheelZoom(); //启用滚轮放大缩小,默认禁用
map.enableContinuousZoom();//启用地图惯性拖拽,默认禁用
// 百度地图API功能结束
});
</script>