Geocoding using Google API - javascript

I used this code to get latitude and longitude. I want to expand to multiple geo-code for multiple locations.
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript">
var geocoder = new google.maps.Geocoder(); var address = "new york";
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
alert(latitude); } }); </script>
If I modify to, include two locations. Any ideas why this doesn't write to the webpage, any idea on how to store the latitude and longitude of multiple locations into an array.
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script type="text/javascript" src="http://maps.google.com/maps/api/js? sensor=false"></script>
<script type="text/javascript">
var geocoder = new google.maps.Geocoder();
var address = [['New York City'],['Chicago, IL']];
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
document.write(latitude);
document.write(longitude);
}
});
</script>
</body>
</html>


See the documentation, address is a string, not an array of arrays of strings.
Note that the geocoder is subject to a quota and rate limit so the code below will only work for approximately 10 results without addressing status=OVER_QUERY_LIMIT.
var geocoder = new google.maps.Geocoder();
var address = [
['New York City'],
['Chicago, IL']
];
for (var i = 0; i < address.length; i++) {
geocoder.geocode({
'address': address[i][0]
}, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
document.getElementById('info').innerHTML += latitude + "<br>";
document.getElementById('info').innerHTML += longitude + "<br>";
} else {
alert("geocode failed:"+status);
}
});
}
code snippet:
var geocoder = new google.maps.Geocoder();
var address = [
['New York City'],
['Chicago, IL']
];
for (var i = 0; i < address.length; i++) {
geocoder.geocode({
'address': address[i][0]
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
document.getElementById('info').innerHTML += latitude + "<br>";
document.getElementById('info').innerHTML += longitude + "<br>";
} else {
alert("geocode failed:" + status);
}
});
}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="info"></div>

Related

REQUEST_DENIED for google geocoding API

geocoder.geocode({ 'address': address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
document.getElementById('latitude').setAttribute('value', latitude);
document.getElementById('longitude').setAttribute('value', longitude);
var lat = parseFloat(latitude);
var lng = parseFloat(longitude);
var latlng = new google.maps.LatLng(lat, lng);
var geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'latLng': latlng }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[1]) {
document.getElementById('physicaladdress').setAttribute('value', results[1].formatted_address);
}
}
});
} else {
console.log(""+status);
}
});
This is my javascript file where i am trying to get latitude and longitude from zip code ,it is working fine in localhost but not when it is hosted live(say aws)
{} ,this i am giving into the app.blade.php , any help would be much appreciated sorry if i am missing anything while asking question.

WebForm how to change alert box result to json result

Below is my code, when i change the alert to return and click the button, result are not shown. Please teach me how to change alert part when i click button, it should return json result in the page. Thank you so much!
<script type="text/javascript">
<!--
function GetLocation() {
var geocoder = new google.maps.Geocoder();
var address = document.getElementById("txtAddress").value;
geocoder.geocode({ 'address': address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
alert("Latitude: " + latitude + "\nLongitude: " + longitude);
} else {
alert("Request failed.")
}
});
};
//-->
</script>

I don't know what your HTML code looks like, so I'll give an example to show in a div.
<body>
<button onclick="GetLocation()">Click me</button>
<div id="resultdata"></div>
</body>
And to show in resultdata, you can use innerHTML like this.
<script type="text/javascript">
function GetLocation() {
var geocoder = new google.maps.Geocoder();
var address = document.getElementById("txtAddress").value;
geocoder.geocode({ 'address': address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
//get JSON data.
var JSONData = JSON.stringify({"Latitude": latitude, "Longitude": longitude});
document.getElementById("resultdata").innerHTML = JSONData;
} else {
alert("Request failed.");
}
});
};
</script>
Hope this help.

How to get Latitude and longitude from given address in Codeigniter

This is my jQuery code:
$(document).ready(function(){
$("#landmark").focusout(function(){
var geocoder = new google.maps.Geocoder();
var address = $("#landmark").val();
if(address!="")
{
geocoder.geocode( { 'address': address}, function(results,
status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
$("#lat").val(latitude);
$("#longi").val(longitude);
}
});
}
});
});
This doesn't work with Codeigniter - do I need to add some library files in Codeigniter?

How can I get the value of these variables?

Im trying to get the value of the variables "latitude" and "longitude".
var latitude;
var longitude;
var geocoder = new google.maps.Geocoder();
var address = document.getElementById("txtAddress").value;
geocoder.geocode({ 'address': address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
latitude = results[0].geometry.location.lat();
longitude = results[0].geometry.location.lng();
alert("Latitude: " + latitude + "\nLongitude: " + longitude);
} else {
alert("Request failed.")
}
});
How can I do it?

I don't think you can. It's an async call.
The way I handled something similar was to call your next function right after latitude and longitude are set.
For example:
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
myNextFunction(latitude, longitude);

Get LatLng from Zip Code - Google Maps API

All I want is some simple example code that shows me how to obtain a latlng element from an inputted zip code OR a city/state.

Couldn't you just call the following replaceing the {zipcode} with the zip code or city and state
http://maps.googleapis.com/maps/api/geocode/json?address={zipcode}
Google Geocoding
Here is a link with a How To Geocode using JavaScript: Geocode walk-thru. If you need the specific lat/lng numbers call geometry.location.lat() or geometry.location.lng() (API for google.maps.LatLng class)
EXAMPLE to get lat/lng:
var lat = '';
var lng = '';
var address = {zipcode} or {city and state};
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
lat = results[0].geometry.location.lat();
lng = results[0].geometry.location.lng();
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
alert('Latitude: ' + lat + ' Logitude: ' + lng);

Just a hint: zip codes are not worldwide unique so this is worth to provide country ISO code in the request (https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2).
e.g looking for coordinates of polish (iso code PL) zipcode 01-210:
https://maps.googleapis.com/maps/api/geocode/json?address=01210,PL
how to obtain user country code?
if you would like to get your user country info based on IP address there are services for it, e.g you can do GET request on:
http://ip-api.com/json

Here is the most reliable way to get the lat/long from zip code (i.e. postal code):
https://maps.googleapis.com/maps/api/geocode/json?key=YOUR_API_KEY&components=postal_code:97403

This is just an improvement to the previous answers because it didn't work for me with some zipcodes even when in https://www.google.com/maps it does, I fixed just adding the word "zipcode " before to put the zipcode, like this:
function getLatLngByZipcode(zipcode)
{
var geocoder = new google.maps.Geocoder();
var address = zipcode;
geocoder.geocode({ 'address': 'zipcode '+address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
alert("Latitude: " + latitude + "\nLongitude: " + longitude);
} else {
alert("Request failed.")
}
});
return [latitude, longitude];
}

While working on my internship project I found a website for this https://thezipcodes.com/
Create a free account and get the API key from account Section.
https://thezipcodes.com/api/v1/search?zipCode={zipCode}&countryCode={2digitCountryCode}&apiKey={apiKey}
I found majority of data here.

Here is the function I am using for my work
function getLatLngByZipcode(zipcode)
{
var geocoder = new google.maps.Geocoder();
var address = zipcode;
geocoder.geocode({ 'address': address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();
alert("Latitude: " + latitude + "\nLongitude: " + longitude);
} else {
alert("Request failed.")
}
});
return [latitude, longitude];
}

<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY"></script>
<script>
var latitude = '';
var longitude = '';
var geocoder = new google.maps.Geocoder();
geocoder.geocode(
{
componentRestrictions: {
country: 'IN',
postalCode: '744102'
}
}, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
latitude = results[0].geometry.location.lat();
longitude = results[0].geometry.location.lng();
console.log(latitude + ", " + longitude);
} else {
alert("Request failed.")
}
});
</script>
https://developers.google.com/maps/documentation/javascript/geocoding#ComponentFiltering

Categories

Resources