网页引用地图

 

使用此代码无需下载插件

 

<style type="text/css">
#allmap {height:500px;width:800px;overflow: hidden; "}
#result {width:100%;font-size:12px;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=SECRET"></script>//此链接的ak后接的SECRET是百度地图密钥，必须有密钥才能使用百度地图，此密钥在官网类网站可通用，此处的SECRET只是无关的单词，使用时要改成自己的密钥
<script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
<link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />
<div style="border-color: rgb(204, 204, 204); border-width: 1px; border-style: dashed; padding: 5px;">
<div id="allmap">
</div>
</div>
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");
map.addControl(new BMap.NavigationControl()); // 添加平移缩放控件
map.addControl(new BMap.ScaleControl()); // 添加比例尺控件
map.addControl(new BMap.OverviewMapControl()); //添加缩略地图控件
map.enableScrollWheelZoom();
var point = new BMap.Point(116.701615,23.395526);//目标位置坐标（可改）可通过百度地图拾取器获取
var marker = new BMap.Marker(point); // 创建标注
map.addOverlay(marker); // 将标注添加到地图中
map.centerAndZoom(point, 15);
var opts = {
width : 280, // 信息窗口宽度
height: 80, // 信息窗口高度
title : "公司" , // 信息窗口标题（可改）
enableMessage:false,//设置允许信息窗发送短息（为true时显示，为false时不显示）
message:"公司地址"
}
var infoWindow = new BMap.InfoWindow("电话：11122233344<br>地址：广东省汕头市金平区护堤路111号", opts); // 创建弹出信息窗口对象（电话地址可改）
marker.addEventListener("click", function(){
map.openInfoWindow(infoWindow,point); //开启信息窗口
});
</script>

 

 

最终效果如下：