<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>根据地址查询经纬度</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=kRHuqFbkaoDcf5CsmOY0fwlpOZZgMxkt"></script>
</head>
<body style="background:#CBE1FF"> Address to be queried: <input id="text_" type="text" value="" style="margin-right:100px;" />
<div style="width:730px;margin:auto;">
Query result (latitude and longitude): <input id="result_" type="text" />
<input type="button" value="Query" onclick="searchByStationName();"/>
</div>
<div id= "container"
style="width:1600px;height:900px; margin:auto;">
</div>
</body>
<script type="text/javascript">
var map = new BMap.Map("container") ;
map.centerAndZoom("Ningbo", 12);
map.enableScrollWheelZoom(); //Enable the scroll wheel to zoom in and out, and
map.enableContinuousZoom() is disabled by default; //Enable map inertial dragging, and
map.addControl(new BMap. NavigationControl()); //Add default zoom and pan control
map. addControl(new BMap.OverviewMapControl()); //Add default thumbnail map control
map.addControl(new BMap.OverviewMapControl({ isOpen: true, anchor: BMAP_ANCHOR_BOTTOM_RIGHT })); //Bottom right corner, open
var localSearch = new BMap.LocalSearch(map);
localSearch.enableAutoViewport(); //Allow automatic adjustment of the window body size
function searchByStationName() {
map.clearOverlays();//clear the original label
var keyword = document.getElementById("text_").value;
localSearch.setSearchCompleteCallback(function (searchResult) {
var poi = searchResult.getPoi(0 );
document.getElementById("result_").value = poi.point.lng + "," + poi.point.lat;
map.centerAndZoom(poi.point, 13);
var marker = new BMap.Marker(new BMap .Point(poi.point.lng, poi.point.lat)); // Create a label, which is the latitude and longitude corresponding to the place to be queried
map.addOverlay(marker);
var content = document.getElementById("text_").value + "<br/><br/>经度：" + poi.point.lng + "<br/>纬度：" + poi.point.lat;
var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + content + "</p>");
marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); });
});
localSearch.search(keyword);
}
map.addEventListener("click", function(e){
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12);
map.enableScrollWheelZoom(true);
var geoc = new BMap.Geocoder();
//By clicking on the Baidu map, you can get the corresponding point, and you can get the corresponding longitude and latitude from the lng and lat attributes of the point
var pt = e.point;
geoc.getLocation(pt, function(rs){
//AddressComponents object can get detailed address information
var addComp = rs.addressComponents;
var site = addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber;
localSearch.setSearchCompleteCallback(function (searchResult) {
var poi = searchResult.getPoi(0);
document.getElementById("result_ ").value = poi.point.lng + "," + poi.point.lat;
map.centerAndZoom(poi.point, 13);
var marker = new BMap.Marker(new BMap.Point(poi.point.lng , poi.point. lat)); // Create a label, which is the latitude and longitude
map.addOverlay(marker);
var content = document.getElementById("text_").value + "<br/><br/>经度：" + poi.point.lng + "<br/>纬度：" + poi.point.lat;
var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + content + "</p>");
marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); });
});
localSearch.search(site);
});
});
</script>
</html>
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>根据地址查询经纬度</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=kRHuqFbkaoDcf5CsmOY0fwlpOZZgMxkt"></script>
</head>
<body style="background:#CBE1FF"> Address to be queried: <input id="text_" type="text" value="" style="margin-right:100px;" />
<div style="width:730px;margin:auto;">
Query result (latitude and longitude): <input id="result_" type="text" />
<input type="button" value="Query" onclick="searchByStationName();"/>
</div>
<div id= "container"
style="width:1600px;height:900px; margin:auto;">
</div>
</body>
<script type="text/javascript">
var map = new BMap.Map("container") ;
map.centerAndZoom("Ningbo", 12);
map.enableScrollWheelZoom(); //Enable the scroll wheel to zoom in and out, and
map.enableContinuousZoom() is disabled by default; //Enable map inertial dragging, and
map.addControl(new BMap. NavigationControl()); //Add default zoom and pan control
map. addControl(new BMap.OverviewMapControl()); //Add default thumbnail map control
map.addControl(new BMap.OverviewMapControl({ isOpen: true, anchor: BMAP_ANCHOR_BOTTOM_RIGHT })); //Bottom right corner, open
var localSearch = new BMap.LocalSearch(map);
localSearch.enableAutoViewport(); //Allow automatic adjustment of the window body size
function searchByStationName() {
map.clearOverlays();//clear the original label
var keyword = document.getElementById("text_").value;
localSearch.setSearchCompleteCallback(function (searchResult) {
var poi = searchResult.getPoi(0 );
document.getElementById("result_").value = poi.point.lng + "," + poi.point.lat;
map.centerAndZoom(poi.point, 13);
var marker = new BMap.Marker(new BMap .Point(poi.point.lng, poi.point.lat)); // Create a label, which is the latitude and longitude corresponding to the place to be queried
map.addOverlay(marker);
var content = document.getElementById("text_").value + "<br/><br/>经度：" + poi.point.lng + "<br/>纬度：" + poi.point.lat;
var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + content + "</p>");
marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); });
});
localSearch.search(keyword);
}
map.addEventListener("click", function(e){
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12);
map.enableScrollWheelZoom(true);
var geoc = new BMap.Geocoder();
//By clicking on the Baidu map, you can get the corresponding point, and you can get the corresponding longitude and latitude from the lng and lat attributes of the point
var pt = e.point;
geoc.getLocation(pt, function(rs){
//AddressComponents object can get detailed address information
var addComp = rs.addressComponents;
var site = addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber;
localSearch.setSearchCompleteCallback(function (searchResult) {
var poi = searchResult.getPoi(0);
document.getElementById("result_ ").value = poi.point.lng + "," + poi.point.lat;
map.centerAndZoom(poi.point, 13);
var marker = new BMap.Marker(new BMap.Point(poi.point.lng , poi.point. lat)); // Create a label, which is the latitude and longitude
map.addOverlay(marker);
var content = document.getElementById("text_").value + "<br/><br/>经度：" + poi.point.lng + "<br/>纬度：" + poi.point.lat;
var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + content + "</p>");
marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); });
});
localSearch.search(site);
});
});
</script>
</html>