调用百度地图api

文档:
http://developer.baidu.com/map/jsdevelop-8.htm

百度地图坐标查询
http://api.map.baidu.com/lbsapi/getpoint/index.html

首先去申请一个API key,获取API key后在页面调用
申请地址:http://lbsyun.baidu.com/apiconsole/key?application=key

<script src="http://api.map.baidu.com/api?v=2.0&ak=8cprupV34TG3GIxu6CnRE5Ua&service=true" type="text/javascript"></script>

调用api的方法函数

var map  = null;
$(function(){
    map = new BMap.Map("map");
    var point = new BMap.Point(x坐标,y坐标);
    map.centerAndZoom(point, 15);
    //放大控件
    map.addControl(new BMap.NavigationControl());
    map.enableScrollWheelZoom();
    dingwei("地点标题","地址","电话",x坐标,y坐标);
    map.setCurrentCity("广州");
})
//定位
function dingwei(title,tel,add,x,y){
    var points = new BMap.Point(x,y);
    map.centerAndZoom(points, 15);
    var opts={width:150,height:60,title:title}
    var infoWindow=new BMap.InfoWindow("<br>地址:"+add+"<br>电话:"+tel,opts);
    infoWindow.setWidth(300);
    infoWindow.setHeight(150);
    map.openInfoWindow(infoWindow,points);
}

页面容器

<div class="map" id="map"></div>

css

<style type="text/css">
.map {
    width: 730px;
    height: 336px;
    margin: 0px auto;
    border: 5px solid #FFF;
}
</style>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容