<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>13.1</title>
<script type="text/javascript">
function initialize() {
var map = new BMap.Map("container", { minZoom: 12, maxZoom: 25 });
map.centerAndZoom("成都", 13);
map.enableScrollWheelZoom(true);
//---------------------------------------------信息窗口(地图上由此只有1个)--------------------------------------------
var sContent =
"<h4 style='margin:0 0 5px 0;padding:0.2em 0'>天安门</h4>" +
"<img style='float:right;margin:4px' id='imgDemo' src='http://avatar.csdn.net/4/7/8/1_sd0902.jpg' width='139' height='104' title='天安门'/>" +
"<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>天安门坐落在中国北京市中心,故宫的南侧,与天安门广场隔长安街相望,是清朝皇城的大门...</p>" +
"</div>";
var point = new BMap.Point(104.017287, 30.685906);
var infoWindow = new BMap.InfoWindow(sContent);
map.openInfoWindow(infoWindow, point);
//---------------------------------------------创建标注---------------------------------------------
var point = new BMap.Point(104.117287, 30.685906);
var marker = new BMap.Marker(point);
//添加点击事件
var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>哈哈，你看见我啦！我可不常出现哦！</p><p style='font-size:14px;'>看看我是如何添加上来的！</p>");
marker.addEventListener("click", function () {
this.openInfoWindow(infoWindow);
});
map.addOverlay(marker);
}
function loadScript() {
var script = document.createElement("script");
script.src = "http://api.map.baidu.com/api?v=1.4&callback=initialize";
document.body.appendChild(script);
}
window.onload = loadScript;
</script>
</head>
<body>
<div style="float: left; width: 100px;">
1</div>
<div id="container" style="width: 800px; height: 500px">
</div>
<div id="r-result" style="float: left; width: 100px;">
打印坐标</div>
<div id="result">
</div>
</body>
</html>
