<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>南昌教育电子地图：查询“我”的经纬度坐标</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=c5faf7158cfbf3513583da1dd7d5f7b4&v=1.1&services=true"></script>
<script type="text/javascript">
function MblogDotccMap(keyword) {
var map = new BMap.Map("NceduMap"); // 创建地图实例
var point = new BMap.Point(115.866071, 28.693708); // 创建点坐标，位置：南昌市教育局
map.centerAndZoom(point, 18); // 初始化地图，设置中心点坐标和地图级别
map.addControl(new BMap.NavigationControl()); //添加缩放控件
map.addControl(new BMap.ScaleControl()); //添加比例尺控件
map.addControl(new BMap.OverviewMapControl()); //添加缩略图控件
map.enableScrollWheelZoom(); // 启用滚轮放大缩小。
map.enableKeyboard(); // 启用键盘操作。 //显示鼠标单击位置经纬度坐标
map.addEventListener("click", function(e) { $("#txtPointX").html(e.point.lng); $("#txtPointY").html(e.point.lat); });
//搜索
var local = new BMap.LocalSearch(map, { renderOptions: { map: map, panel: "results_info" } });
map.panBy(point);
local.search(keyword);
local.getResults()
local.setSearchCompleteCallback(function(searchResult) { var poi = searchResult.getPoi(0); $("#txtPointX").html(poi.point.lng); $("#txtPointY").html(poi.point.lat); });
}
</script>
</head> <body onload="MblogDotccMap();" onkeydown="if(event.keyCode==13)MblogDotccMap(document.getElementById('keyword').value)">
<div style=" 600px; height: 450px; border: 1px solid gray; float: left" id="NceduMap"> </div>
<div style="margin-top: 10px; margin-left: 10px; float: left">
<div style="margin-top: 10px; margin-left: 10px;"> 单击鼠标左键显示经纬度</div>
<div id="search" style="margin-top: 10px; margin-left: 10px;"> 目标: <input type="text" size="20" name="keyword" id="keyword" /> <input type="submit" value="查询" onclick="MblogDotccMap(document.getElementById('keyword').value)" /> </div>
<div id="SearchInfo" style="margin-top: 10px; margin-left: 10px;">
经度：<span id="txtPointX"></span><br />
纬度：<span id="txtPointY"></span></div>
<div id="results_info" style="margin-top: 10px; margin-left: 10px;">
</div>
</div>
</body>
</html>