我不敢相信我又回到了这里,我以为我已经把这个页面整理好了。
我已经获取了 Geocodezip 的页面 ( http://www.geocodezip.com/v3_FusionTables_geocoder_PointInPolygonChicago.html ),并对其进行了修改(我以为我已经完成了这一切)。
我正在尝试使用我的桌子而不是原来的芝加哥社区,但我找不到我缺少的东西,让它从我的桌子上返回“NAME”列,就像原来的一样
我查看了原始页面中的融合表,以确保我的表具有相同的列标题,因为我认为使用的是那个。地图显示我的几何图层但没有返回相应的“名称”我在代码中找不到任何需要更改的内容我现在有一个非常小的表,一旦我让它工作,我就能得到它功能齐全。
我的表:https ://www.google.com/fusiontables/DataSource?docid=1oGlrsLe3rfQWRT3g7exHtQjxKDwUHH97xDqhTuw
这是我的代码:
<!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>Google Maps JavaScript API v3 Example: Geocoding Simple</title>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js? sensor=false"></script>
<script type="text/javascript">
var tableId = '1oGlrsLe3rfQWRT3g7exHtQjxKDwUHH97xDqhTuw';
var geocoder = null;
var map = null;
var layer = null;
var marker = null;
var address = '509 E 47th St, Chicago, IL 60653';
function codeAddress() {
var address = document.getElementById('street_add').value;
address += " "+document.getElementById('city').value;
address += " "+document.getElementById('state').value;
address += " "+document.getElementById('postcode').value;
address += " "+document.getElementById('country').value;
geocoder.geocode( { 'address': address}, geocoderCallback );
}
function initialize() {
var myOptions = {
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
google.maps.event.addListener(map, 'click', function(e) {
geocoder.geocode( { 'location': e.latLng}, geocoderCallback);
});
geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': address}, geocoderCallback);
}
function displayNeighborhood(address) {
for (p = address.length-1; p >= 0; p--) {
if (address[p].types.indexOf("neighborhood") != -1) {
document.getElementById('neighborhood').innerHTML= address[p].long_name;
}
}
}
function geocoderCallback (results, status) {
document.getElementById('neighborhood').innerHTML="";
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var lat = results[0].geometry.location.lat();
var lng = results[0].geometry.location.lng();
if (marker) marker.setMap(null);
marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
displayNeighborhood(results[0].address_components);
if (!layer)
{
layer = new google.maps.FusionTablesLayer({
query: {
select: 'geometry',
from: tableId,
where: 'ST_INTERSECTS(geometry, CIRCLE(LATLNG(' + lat + ', ' + lng + '),1))',
limit: 1
}
});
layer.setMap(map);
}
else
{
layer.setOptions({
query: {
select: 'geometry',
from: tableId,
where: 'ST_INTERSECTS(geometry, CIRCLE(LATLNG(' + lat + ', ' + lng + '),1))',
limit: 1
}
});
}
} else {
alert("Geocode was not successful for the following reason: " + status);
}
};
</script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function () {
var str = $('#neighborhood').text();
$('#area').val(str);
});
</script>
<SCRIPT LANGUAGE="JavaScript">
function readText (form) {
TestVar =$('#neighborhood').text();
alert ("You typed: " + TestVar);
}
function writeText (form) {
form.area.value =$('#neighborhood').text();
}
</SCRIPT>
</head>
<body onload="initialize()">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="20"><form name="a">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="18%">Unit / Office:</td>
<td width="82%"><label for="aunit"></label>
<input type="text" name="aunit" id="aunit" onblur="document.main.Unit .value = this.value;"></td>
</tr>
<tr>
<td>Street Number:</td>
<td><input name="anumber" type="textbox" class="address" id="street_add" value="532 Beacon St" onblur="document.main.Number .value = this.value;"></td>
</tr>
<tr>
<td>Street:</td>
<td><input name="astreet" type="textbox" class="address" id="city" value="Boston" onblur="document.main.Street .value = this.value;"></td>
</tr>
<tr>
<td>Post Code:</td>
<td><input name="apcode" type="textbox" class="address" id="country" value="" onblur="document.main.PostCode .value = this.value;"></td>
</tr>
<tr>
<td>Suburb:</td>
<td><input name="asuburb" type="textbox" class="address" id="state" value="MA" onblur="document.main.Suburb .value = this.value;"></td>
</tr>
<tr>
<td>State</td>
<td><label for="state"></label>
<select name="astate" class="address" id="postcode" onblur="document.main.State .value = this.value;codeAddress();">
<option>Select State</option>
<option value="Qld">Queensland</option>
<option value="ACT">Australian Capital Territory</option>
<option value="NSW">New South Wales</option>
<option value="NT">Northern Territory</option>
<option value="SA">South Australia</option>
<option value="Tas">Tasmania</option>
<option value="Vic">Victoria</option>
<option value="WA">Western Australia</option>
</select></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
<br>
</form></td>
</tr>
<tr>
<td> </td>
</tr>
</table></td>
</tr>
</table>
<div id="map_canvas" style="height: 250px; width: 250px;"></div>
<b>Neighborhood:</b> <div class="neighborhood" id="neighborhood"></div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-162157-1";
urchinTracker();
</script><br><form action="" method="post" name="main" id="main">
<input type="button" name="button2" value="Confirm Address" onClick="writeText(this.form)"><P>
<label for="Unit2"></label>
Hidden fields <br>
area
<input type="text" name="area" value="">
unit
<input type="text" name="Unit" id="Unit">
no
<label for="Number"></label>
<input type="text" name="Number" id="Number">
street
<label for="Street"></label>
<input type="text" name="Street" id="Street">
<label for="Suburb"></label>
suburb
<input type="text" name="Suburb" id="Suburb">
<label for="State"></label>
state
<input type="text" name="State" id="State">
<label for="PostCode"></label>
post
<input type="text" name="PostCode" id="PostCode">
<label for="SupportArea"></label>
</form>
<br>
</body>
</html>
任何帮助将不胜感激,再次感谢。