从地理编码器获取州中心坐标 API
Get State Center coordinates from Geocoder API
我可以使用 GeoCoder API 获取城市坐标,并将其输入到我的 GMaps API 中,以便它以 address/coords 为中心。我只想将州名称传递给 API 并在可能的情况下获取该州的中心坐标。我还没有在 GeoCoder API 中的 address
参数下看到任何仅传递状态名称的选项。有什么想法吗?
当前实施以城市为中心:
function getStateBounds ( state ) {
var geocoder = new google.maps.Geocoder();
var latlong;
geocoder.geocode( { 'latLng': new google.maps.LatLng(latitude, longitude)}, function(results, status)
{
if ( status === google.maps.GeocoderStatus.OK )
{
latlong = (results[0].geometry.location);
var lat = latlong.lat();
var long = latlong.lng();
// Wasn't working setting inside this method :|
$scope.setStateCoordsScope( lat, long );
} else {
alert( "Geocode was not successful for the following reason: " + status );
}
});
}
纬度和经度变量仅适用于城市,但我也可以访问州字符串。
编辑: 如果我只传入州字符串,它将对具有匹配城市名称的州进行错误查找,例如华盛顿。
将 "State of "+addressStr
传递到 google.maps.Geocoder 作为要进行地理编码的地址对我有用:example
代码片段:
var map = null;
var geocoder = null;
function initialize() {
geocoder = new google.maps.Geocoder();
var myOptions = {
zoom: 2,
center: new google.maps.LatLng(47.288828765662416, 7.945261001586914),
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
navigationControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
findAddress("United States");
}
function findAddress(address) {
var addressStr = document.getElementById("stateselect").value;
if (!address && (addressStr != ''))
address = "State of " + addressStr;
else
address = addressStr;
if ((address != '') && geocoder) {
geocoder.geocode({
'address': address
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
if (results && results[0] && results[0].geometry && results[0].geometry.viewport)
map.fitBounds(results[0].geometry.viewport);
} else {
alert("No results found");
}
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
}
google.maps.event.addDomListener(window, 'load', initialize);
html,
body,
#map_canvas {
height: 100%;
width: 100%;
padding: 0;
margin: 0;
}
<script src="https://maps.google.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<h2>Zoom to State with Select List (Google Maps API)</h2>
<div id="TOPNAV">
<select id="stateselect" name="countryselect" class="textfeld" onclick="findAddress();return false" onchange="findAddress();return false" onfocus="">
<option value=''>Select a State....</option>
<option value="Alabama">Alabama</option>
<option value="Alaska">Alaska</option>
<option value="Arizona">Arizona</option>
<option value="Arkansas">Arkansas</option>
<option value="California">California</option>
<option value="Colorado">Colorado</option>
<option value="Connecticut">Connecticut</option>
<option value="Delaware">Delaware</option>
<option value="Florida">Florida</option>
<option value="Georgia">Georgia</option>
<option value="Hawaii">Hawaii</option>
<option value="Idaho">Idaho</option>
<option value="Illinois">Illinois</option>
<option value="Indiana">Indiana</option>
<option value="Iowa">Iowa</option>
<option value="Kansas">Kansas</option>
<option value="Kentucky">Kentucky</option>
<option value="Louisiana">Louisiana</option>
<option value="Maine">Maine</option>
<option value="Maryland">Maryland</option>
<option value="Massachusetts">Massachusetts</option>
<option value="Michigan">Michigan</option>
<option value="Minnesota">Minnesota</option>
<option value="Mississippi">Mississippi</option>
<option value="Missouri">Missouri</option>
<option value="Montana">Montana</option>
<option value="Nebraska">Nebraska</option>
<option value="Nevada">Nevada</option>
<option value="New Hampshire">New Hampshire</option>
<option value="New Jersey">New Jersey</option>
<option value="New Mexico">New Mexico</option>
<option value="New York">New York</option>
<option value="North Carolina">North Carolina</option>
<option value="North Dakota">North Dakota</option>
<option value="Ohio">Ohio</option>
<option value="Oklahoma">Oklahoma</option>
<option value="Oregon">Oregon</option>
<option value="Pennsylvania">Pennsylvania</option>
<option value="Rhode Island">Rhode Island</option>
<option value="South Carolina">South Carolina</option>
<option value="South Dakota">South Dakota</option>
<option value="Tennessee">Tennessee</option>
<option value="Texas">Texas</option>
<option value="Utah">Utah</option>
<option value="Vermont">Vermont</option>
<option value="Virginia">Virginia</option>
<option value="Washington">Washington</option>
<option value="West Virginia">West Virginia</option>
<option value="Wisconsin">Wisconsin</option>
<option value="Wyoming">Wyoming</option>
</select>
</div>
<div id="map_canvas"></div>
我可以使用 GeoCoder API 获取城市坐标,并将其输入到我的 GMaps API 中,以便它以 address/coords 为中心。我只想将州名称传递给 API 并在可能的情况下获取该州的中心坐标。我还没有在 GeoCoder API 中的 address
参数下看到任何仅传递状态名称的选项。有什么想法吗?
当前实施以城市为中心:
function getStateBounds ( state ) {
var geocoder = new google.maps.Geocoder();
var latlong;
geocoder.geocode( { 'latLng': new google.maps.LatLng(latitude, longitude)}, function(results, status)
{
if ( status === google.maps.GeocoderStatus.OK )
{
latlong = (results[0].geometry.location);
var lat = latlong.lat();
var long = latlong.lng();
// Wasn't working setting inside this method :|
$scope.setStateCoordsScope( lat, long );
} else {
alert( "Geocode was not successful for the following reason: " + status );
}
});
}
纬度和经度变量仅适用于城市,但我也可以访问州字符串。
编辑: 如果我只传入州字符串,它将对具有匹配城市名称的州进行错误查找,例如华盛顿。
将 "State of "+addressStr
传递到 google.maps.Geocoder 作为要进行地理编码的地址对我有用:example
代码片段:
var map = null;
var geocoder = null;
function initialize() {
geocoder = new google.maps.Geocoder();
var myOptions = {
zoom: 2,
center: new google.maps.LatLng(47.288828765662416, 7.945261001586914),
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
navigationControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
findAddress("United States");
}
function findAddress(address) {
var addressStr = document.getElementById("stateselect").value;
if (!address && (addressStr != ''))
address = "State of " + addressStr;
else
address = addressStr;
if ((address != '') && geocoder) {
geocoder.geocode({
'address': address
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
if (results && results[0] && results[0].geometry && results[0].geometry.viewport)
map.fitBounds(results[0].geometry.viewport);
} else {
alert("No results found");
}
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
}
google.maps.event.addDomListener(window, 'load', initialize);
html,
body,
#map_canvas {
height: 100%;
width: 100%;
padding: 0;
margin: 0;
}
<script src="https://maps.google.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<h2>Zoom to State with Select List (Google Maps API)</h2>
<div id="TOPNAV">
<select id="stateselect" name="countryselect" class="textfeld" onclick="findAddress();return false" onchange="findAddress();return false" onfocus="">
<option value=''>Select a State....</option>
<option value="Alabama">Alabama</option>
<option value="Alaska">Alaska</option>
<option value="Arizona">Arizona</option>
<option value="Arkansas">Arkansas</option>
<option value="California">California</option>
<option value="Colorado">Colorado</option>
<option value="Connecticut">Connecticut</option>
<option value="Delaware">Delaware</option>
<option value="Florida">Florida</option>
<option value="Georgia">Georgia</option>
<option value="Hawaii">Hawaii</option>
<option value="Idaho">Idaho</option>
<option value="Illinois">Illinois</option>
<option value="Indiana">Indiana</option>
<option value="Iowa">Iowa</option>
<option value="Kansas">Kansas</option>
<option value="Kentucky">Kentucky</option>
<option value="Louisiana">Louisiana</option>
<option value="Maine">Maine</option>
<option value="Maryland">Maryland</option>
<option value="Massachusetts">Massachusetts</option>
<option value="Michigan">Michigan</option>
<option value="Minnesota">Minnesota</option>
<option value="Mississippi">Mississippi</option>
<option value="Missouri">Missouri</option>
<option value="Montana">Montana</option>
<option value="Nebraska">Nebraska</option>
<option value="Nevada">Nevada</option>
<option value="New Hampshire">New Hampshire</option>
<option value="New Jersey">New Jersey</option>
<option value="New Mexico">New Mexico</option>
<option value="New York">New York</option>
<option value="North Carolina">North Carolina</option>
<option value="North Dakota">North Dakota</option>
<option value="Ohio">Ohio</option>
<option value="Oklahoma">Oklahoma</option>
<option value="Oregon">Oregon</option>
<option value="Pennsylvania">Pennsylvania</option>
<option value="Rhode Island">Rhode Island</option>
<option value="South Carolina">South Carolina</option>
<option value="South Dakota">South Dakota</option>
<option value="Tennessee">Tennessee</option>
<option value="Texas">Texas</option>
<option value="Utah">Utah</option>
<option value="Vermont">Vermont</option>
<option value="Virginia">Virginia</option>
<option value="Washington">Washington</option>
<option value="West Virginia">West Virginia</option>
<option value="Wisconsin">Wisconsin</option>
<option value="Wyoming">Wyoming</option>
</select>
</div>
<div id="map_canvas"></div>