HTML代码:
<g:form method="post" name="mapForm">
<div id="map_canvas" style="height:480px;width:1170px;"></div>
<table>
<tr>
<td width="70">纬度(lat):<input type="text" id="latMap" name="lat" value="${params.lat}"/></td>
<td width="70">经度(lng):<input type="text" id="lngMap" name="lng" value="${params.lng}"/></td>
<td width="20"><input type="button" value="定位" onclick="searchPosition('手动定位','',17);"/></td>
<td width="130"><input type="button" value="确定经纬度" onclick="saveLatLng();"/></td>
</tr>
<tr>
<td colspan="3"><input type="text" id="districtNameMap" name="districtName" style="width:200px;" value="${(params.districtName ?
params.districtName?.encodeAsHTML() : '') + ' ' + (params.address ? params.address?.encodeAsHTML() : '')}"/>
<input type="button" value="查找定位" onclick="doQuery('${params.city}');" style="margin-left:20px;"/>
<input type="button" value="关闭" onclick="closeWindow();"); style="margin-left:20px;""/></td>
</tr>
<tr>
<td>Google地图查询结果: </td>
</tr>
<tr style="border: 2px solid green;">
<td width="100">名字</td>
<td width="100">地址</td>
<td width="50">经度</td>
<td width="50">纬度</td>
<td width="100">简介</td>
</tr>
<tbody id="QueryResult">
<tr>
<td colspan="5" style="text-align:center;">你可以在文本框中输入查找的内容,然后进行查找!</td>
</tr>
</tbody>
</table>
</g:form>
javascript代码:
<script src="http://ditu.google.cn/maps?file=api&v=2&key=ABQIAAAAjrjne0F4cDKBgaXboSUEOBRWwYZIMkjMkdGEIrpMX7NJb53ndhTkcNJtXRLU7giBxFxOukNWOgy-3A&hl=zh-CN" type="text/javascript"></script>
<script language="javascript" type="text/javascript"><!--
var map;
function saveLatLng() {
if (confirm('你确定要设置小区的经纬度吗?')) {
var lat = jQuery('#latMap').val().replace('.', '').substring(0,9);
var lng = jQuery('#lngMap').val().replace('.', '').substring(0,10);
jQuery('#lat').val(lat);
jQuery('#lng').val(lng);
}
}
function loadMap(lat, lng, name, address) {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
searchPosition(name, address, 13);
var smallMapControl = new GSmallMapControl();
var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10,10));
var bottomRight = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,10));
map.addControl(smallMapControl, topRight);
GEvent.addListener(map, "dblclick", function() {
map.removeControl(smallMapControl);
map.addControl(new GSmallMapControl(), bottomRight);
});
GEvent.addListener(map, "click", function(marker, point) {
jQuery('#latMap').val(point.lat());
jQuery('#lngMap').val(point.lng());
});
}
}
function searchPosition(name, address, level) {
var lat = jQuery('#latMap').val();
var lng = jQuery('#lngMap').val();
map.setCenter(new GLatLng(lat,lng), level);
var ele = document.createElement("DIV");
ele.innerHTML = name + "<br/>" + address;
map.openInfoWindow(map.getCenter(),ele);
}
function doQuery(city) {
var data = '&city=' + city + '&districtName=' + jQuery('#districtNameMap').val();
jQuery.ajax({
type: "POST",
url: "${createLink(controller:'districtLocation', action:'fetchGoogleCode')}",
data: data,
dataType: 'json',
success: function(response){
if (isNeedReLogin(response)) {//登录超时
window.location = "${request.contextPath}/login/auth";
} else if (isForbidden(response)) {//权限不够
window.location = "${request.contextPath}/login/denied";
} else {
if (response.message == '200') {
eval("ajaxQueryResult="+response.html);
doSetValues(ajaxQueryResult);
} else {
alert(response + ',抱歉!保存失败,请重试!');
}
}
},
error: function(response) {
alert(response);
}
});
}
function doSetValues(ajaxQueryResult){
var tbody = document.getElementById('QueryResult');
for(var i=tbody.rows.length-1;i>=0;i--){
tbody.deleteRow(i);
}
for(var i=0;i<ajaxQueryResult.length;i++){
var row = tbody.insertRow(i);
var cell = row.insertCell(0);
cell.innerHTML = "<a href=\"javascript:SetLatLng("+ajaxQueryResult[i].lat+","+ajaxQueryResult[i].lng+",'"+ajaxQueryResult
[i].name+"','"+ajaxQueryResult[i].address+"')\">"+ajaxQueryResult[i].name+"</a>";
cell = row.insertCell(1);
cell.innerHTML = ajaxQueryResult[i].address;
cell = row.insertCell(2);
cell.innerHTML = ajaxQueryResult[i].lng;
cell = row.insertCell(3);
cell.innerHTML = ajaxQueryResult[i].lat;
cell = row.insertCell(4);
cell.innerHTML = ajaxQueryResult[i].snippet;
}
if(ajaxQueryResult.length == 0){
var row = tbody.insertRow(0);
var cell = row.insertCell(0);
cell.algin="center";
cell.colSpan=5;
cell.innerHTML = "没有找到你想要的结果!";
}
}
Groovy代码:
def fetchGoogleCode = {
public static Pattern PARSE_PATTERN = Pattern.compile("<Placemark><name>([^<]+)|<Snippet><!\\[CDATA\\[([^\\]]+)|<address>([^<]+)|<coordinates>([^<]+)");
String url = 'http://ditu.google.cn/maps?f=q&hl=zh-CN&geocode=&q=' + URLEncoder.encode(params.city + ' ' + params.districtName,"UTF-8") + '&btnG=%E6%90%
9C%E7%B4%A2%E5%9C%B0%E5%9B%BE&output=kml';
StringBuffer result = new StringBuffer("[");
int c = 0;
try{
def content = '';
HttpURLConnection conn = null;
try {
conn = (HttpURLConnection) (new URL(url).openConnection());
BufferedReader reader = new BufferedReader(new InputStreamReader(conn.getInputStream(),"UTF-8"));
String tmp = null;
StringBuffer buffer = new StringBuffer();
while( (tmp = reader.readLine()) != null){
buffer.append(tmp);
}
content = buffer.toString();
} finally {
if (null != conn)
conn.disconnect();
}
Matcher m = PARSE_PATTERN.matcher(content);
while(m.find()){
switch(c % 4){
case 0:
result.append("\r\n{name:\"");
result.append(m.group(1));
result.append("\",");
break;
case 1:
def snippet = m.group(2);
snippet = snippet?.replaceAll("[\\r\\n]","<br/>");
snippet = snippet?.replaceAll("[\"]","'");
result.append("snippet:\"");
result.append(snippet);
result.append("\",");
break;
case 2:
result.append("address:\"");
result.append(m.group(3));
result.append("\",");
break;
case 3:
String s = m.group(4);
String[] a = s.split(',');
result.append("lng:\"");
result.append(a[0]);
result.append("\",lat:\"");
result.append(a[1]);
result.append("\"},");
break;
}
c++;
}
}catch(Exception e){
}
if(c > 0 && c % 4 == 0){
result = result.deleteCharAt(result.length()-1);
result.append("\r\n];");
}else{
result = new StringBuffer("[];");
}
def jsonResult = [:]
jsonResult.message = '200'
println result.toString()
jsonResult.html = result.toString()
render jsonResult as JSON
}
--></script>
<g:form method="post" name="mapForm">
<div id="map_canvas" style="height:480px;width:1170px;"></div>
<table>
<tr>
<td width="70">纬度(lat):<input type="text" id="latMap" name="lat" value="${params.lat}"/></td>
<td width="70">经度(lng):<input type="text" id="lngMap" name="lng" value="${params.lng}"/></td>
<td width="20"><input type="button" value="定位" onclick="searchPosition('手动定位','',17);"/></td>
<td width="130"><input type="button" value="确定经纬度" onclick="saveLatLng();"/></td>
</tr>
<tr>
<td colspan="3"><input type="text" id="districtNameMap" name="districtName" style="width:200px;" value="${(params.districtName ?
params.districtName?.encodeAsHTML() : '') + ' ' + (params.address ? params.address?.encodeAsHTML() : '')}"/>
<input type="button" value="查找定位" onclick="doQuery('${params.city}');" style="margin-left:20px;"/>
<input type="button" value="关闭" onclick="closeWindow();"); style="margin-left:20px;""/></td>
</tr>
<tr>
<td>Google地图查询结果: </td>
</tr>
<tr style="border: 2px solid green;">
<td width="100">名字</td>
<td width="100">地址</td>
<td width="50">经度</td>
<td width="50">纬度</td>
<td width="100">简介</td>
</tr>
<tbody id="QueryResult">
<tr>
<td colspan="5" style="text-align:center;">你可以在文本框中输入查找的内容,然后进行查找!</td>
</tr>
</tbody>
</table>
</g:form>
javascript代码:
<script src="http://ditu.google.cn/maps?file=api&v=2&key=ABQIAAAAjrjne0F4cDKBgaXboSUEOBRWwYZIMkjMkdGEIrpMX7NJb53ndhTkcNJtXRLU7giBxFxOukNWOgy-3A&hl=zh-CN" type="text/javascript"></script>
<script language="javascript" type="text/javascript"><!--
var map;
function saveLatLng() {
if (confirm('你确定要设置小区的经纬度吗?')) {
var lat = jQuery('#latMap').val().replace('.', '').substring(0,9);
var lng = jQuery('#lngMap').val().replace('.', '').substring(0,10);
jQuery('#lat').val(lat);
jQuery('#lng').val(lng);
}
}
function loadMap(lat, lng, name, address) {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
searchPosition(name, address, 13);
var smallMapControl = new GSmallMapControl();
var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(10,10));
var bottomRight = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,10));
map.addControl(smallMapControl, topRight);
GEvent.addListener(map, "dblclick", function() {
map.removeControl(smallMapControl);
map.addControl(new GSmallMapControl(), bottomRight);
});
GEvent.addListener(map, "click", function(marker, point) {
jQuery('#latMap').val(point.lat());
jQuery('#lngMap').val(point.lng());
});
}
}
function searchPosition(name, address, level) {
var lat = jQuery('#latMap').val();
var lng = jQuery('#lngMap').val();
map.setCenter(new GLatLng(lat,lng), level);
var ele = document.createElement("DIV");
ele.innerHTML = name + "<br/>" + address;
map.openInfoWindow(map.getCenter(),ele);
}
function doQuery(city) {
var data = '&city=' + city + '&districtName=' + jQuery('#districtNameMap').val();
jQuery.ajax({
type: "POST",
url: "${createLink(controller:'districtLocation', action:'fetchGoogleCode')}",
data: data,
dataType: 'json',
success: function(response){
if (isNeedReLogin(response)) {//登录超时
window.location = "${request.contextPath}/login/auth";
} else if (isForbidden(response)) {//权限不够
window.location = "${request.contextPath}/login/denied";
} else {
if (response.message == '200') {
eval("ajaxQueryResult="+response.html);
doSetValues(ajaxQueryResult);
} else {
alert(response + ',抱歉!保存失败,请重试!');
}
}
},
error: function(response) {
alert(response);
}
});
}
function doSetValues(ajaxQueryResult){
var tbody = document.getElementById('QueryResult');
for(var i=tbody.rows.length-1;i>=0;i--){
tbody.deleteRow(i);
}
for(var i=0;i<ajaxQueryResult.length;i++){
var row = tbody.insertRow(i);
var cell = row.insertCell(0);
cell.innerHTML = "<a href=\"javascript:SetLatLng("+ajaxQueryResult[i].lat+","+ajaxQueryResult[i].lng+",'"+ajaxQueryResult
[i].name+"','"+ajaxQueryResult[i].address+"')\">"+ajaxQueryResult[i].name+"</a>";
cell = row.insertCell(1);
cell.innerHTML = ajaxQueryResult[i].address;
cell = row.insertCell(2);
cell.innerHTML = ajaxQueryResult[i].lng;
cell = row.insertCell(3);
cell.innerHTML = ajaxQueryResult[i].lat;
cell = row.insertCell(4);
cell.innerHTML = ajaxQueryResult[i].snippet;
}
if(ajaxQueryResult.length == 0){
var row = tbody.insertRow(0);
var cell = row.insertCell(0);
cell.algin="center";
cell.colSpan=5;
cell.innerHTML = "没有找到你想要的结果!";
}
}
Groovy代码:
def fetchGoogleCode = {
public static Pattern PARSE_PATTERN = Pattern.compile("<Placemark><name>([^<]+)|<Snippet><!\\[CDATA\\[([^\\]]+)|<address>([^<]+)|<coordinates>([^<]+)");
String url = 'http://ditu.google.cn/maps?f=q&hl=zh-CN&geocode=&q=' + URLEncoder.encode(params.city + ' ' + params.districtName,"UTF-8") + '&btnG=%E6%90%
9C%E7%B4%A2%E5%9C%B0%E5%9B%BE&output=kml';
StringBuffer result = new StringBuffer("[");
int c = 0;
try{
def content = '';
HttpURLConnection conn = null;
try {
conn = (HttpURLConnection) (new URL(url).openConnection());
BufferedReader reader = new BufferedReader(new InputStreamReader(conn.getInputStream(),"UTF-8"));
String tmp = null;
StringBuffer buffer = new StringBuffer();
while( (tmp = reader.readLine()) != null){
buffer.append(tmp);
}
content = buffer.toString();
} finally {
if (null != conn)
conn.disconnect();
}
Matcher m = PARSE_PATTERN.matcher(content);
while(m.find()){
switch(c % 4){
case 0:
result.append("\r\n{name:\"");
result.append(m.group(1));
result.append("\",");
break;
case 1:
def snippet = m.group(2);
snippet = snippet?.replaceAll("[\\r\\n]","<br/>");
snippet = snippet?.replaceAll("[\"]","'");
result.append("snippet:\"");
result.append(snippet);
result.append("\",");
break;
case 2:
result.append("address:\"");
result.append(m.group(3));
result.append("\",");
break;
case 3:
String s = m.group(4);
String[] a = s.split(',');
result.append("lng:\"");
result.append(a[0]);
result.append("\",lat:\"");
result.append(a[1]);
result.append("\"},");
break;
}
c++;
}
}catch(Exception e){
}
if(c > 0 && c % 4 == 0){
result = result.deleteCharAt(result.length()-1);
result.append("\r\n];");
}else{
result = new StringBuffer("[];");
}
def jsonResult = [:]
jsonResult.message = '200'
println result.toString()
jsonResult.html = result.toString()
render jsonResult as JSON
}
--></script>