<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Simple Map</title>
<style type="text/css">
body, html {
width: 100%;
height: 100%;
margin: 0;
font-family: "微软雅黑";
}
p {
margin-left: 5px;
font-size: 14px;
}
</style>
<script type="text/javascript"
src="http://api.map.baidu.com/api?ak=Cd9lWxLeoI2llbsD9ELPdvd0"></script>
</head>
<body>
<div id="content" class="content">
<input type="text" value="" id="keyword" /> <input type="button"
name="" id="" value="查询" onclick="search()" />
<div style="width: 600px; height: 500px; border: 0px solid gray"
id="container"></div>
<p id="aa"></p>
<script type="text/javascript">
//创建地图实例
var map = new BMap.Map("container");
//创建点坐标
var point = new BMap.Point(106.73, 31.86);
//初始化地图,设置中心店坐标和地图级别
map.centerAndZoom(point, 11);
//开启鼠标滚轮缩放功能
map.enableScrollWheelZoom();
//添加缩略图控件
map.addControl(new BMap.OverviewMapControl({
isOpen : true,
//控件的停靠位置
anchor : BMAP_ANCHOR_BOTTOM_RIGHT
}));
//添加缩放平移控件
map.addControl(new BMap.NavigationControl());
//添加比例尺控件
map.addControl(new BMap.ScaleControl());
//添加地图类型控件
map.addControl(new BMap.MapTypeControl());
//创建标注
var marker = new BMap.Marker(point);
//把标注添加到地图上
map.addOverlay(marker);
//弹出信息窗口
var content = "<table>";
content = content + "<tr><td> 编号：001</td></tr>";
content = content + "<tr><td> 地点：巴中市</td></tr>";
content = content + "<tr><td> 时间：2015-10-25</td></tr>";
content += "</table>";
var infowindow = new BMap.InfoWindow(content);
marker.addEventListener("click", function() {
this.openInfoWindow(infowindow);
});
//点击地图，获取经纬度坐标
map.addEventListener("click", function(e) {
document.getElementById("aa").innerHTML = "经度坐标：" + e.point.lng
+ " 纬度坐标：" + e.point.lat;
});
//关键字搜索
function search() {
var keyword = document.getElementById("keyword").value;
if(keyword){
var local = new BMap.LocalSearch(map, {
renderOptions : {
map : map
}
});
local.search(keyword);
}else{
alert("请输入您要查找的地名");
}
}
</script>
</div>
</body>
</html>