网站嵌入百度地图API实例

自己在做个电子请帖要嵌入一个地图手机上使用的，首先想到就是百度地图，很早的时候就做个百度翻译的api,开发者认定就已经通过了，怎么申请key请看下面的文章，讲的应该比较详细
http://jingyan.baidu.com/article/363872eccda8286e4aa16f4e.html
我主要用于网站，选择的时候是百度地图JavaScript API





在【功能介绍】里随便点击一进去就会有demo代码很方便，而且可以在线调试。

我主要用到2个功能

1、添加复杂内容的信息窗口

2、添加多个标注点

还会使用到一个重要的工具定位成坐标
http://api.map.baidu.com/lbsapi/getpoint/index.html
重要提示：百度设置里都是根据坐标来定位的

下面我把做的功能demo做出来

<script type="text/javascript">
//百度地图API功能
function loadJScript() {
　　var script = document.createElement("script");
　　script.type = "text/javascript";
　　script.src = "http://api.map.baidu.com/api?v=2.0&ak=【百度地图key】&callback=init";
　　document.body.appendChild(script);
}
function init() {
　　var sContent = document.getElementById('J_map_content').innerHTML;//【提示的html代码】
　　var sContent1 = document.getElementById('J_map_content1').innerHTML;//【提示的html代码】

　　// 百度地图API功能
　　map = new BMap.Map("allmap");
　　map.centerAndZoom(new BMap.Point(121.065592, 30.204504), 15);
　　var data_info = [[122.066592, 30.204504,sContent],
　　　　[122.060185, 30.208379,sContent1]
　　];
　　var opts = {
　　　　//width : 250, // 信息窗口宽度
　　　　//height: 80, // 信息窗口高度
　　　　//title : "信息窗口" , // 信息窗口标题
　　　　enableMessage:true//设置允许信息窗发送短息
　　};
　　for(var i=0;i<data_info.length;i++){
　　　　var marker = new BMap.Marker(new BMap.Point(data_info[i][0],data_info[i][1])); // 创建标注
　　　　var content = data_info[i][2];
　　　　map.addOverlay(marker); // 将标注添加到地图中

　　　　marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
　　　　addClickHandler(content,marker);
　　}
　　function addClickHandler(content,marker){

　　　　marker.addEventListener("click",function(e){
　　　　openInfo(content,e)}
　　　　);
　　}
　　function openInfo(content,e){
　　　　var p = e.target;
　　　　var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
　　　　var infoWindow = new BMap.InfoWindow(content,opts); // 创建信息窗口对象
　　　　infoWindow.show();
　　　　map.openInfoWindow(infoWindow,point); //开启信息窗口

　　}
}
window.onload = loadJScript; //异步加载地图
</script>

注意上面的代码要修改4处地方
①百度地图key
②【提示的html代码】
③【提示的html代码】
④坐标修改
我之前看到过别人的地址，发现打开地址就可以显示信息窗口，我在网上查了很久没有找到解决方法，做为一个问题先记录了，如果有知道的朋友留言给我

QQ交流群：136351212
查看原文：http://www.phpsong.com/1476.html