Google Map Geocoding Tutorial with Example

Google Map API has been a great way to show geographical information on web. A lot of mashup tools like this, have been created around Google Maps to show a wide variety of data. In my previous article about Introduction to Google Maps API, I had described basic APIs to integrate Google Map in your webpage. In this small article we will discuss a great feature of Google Maps API that can be used to locate any City/Country/Place on Map. This is called Geocoding. Google Maps API provides a wonderful API called Geocoding API that enables you to fetch any location and pin point it on Google Map. GClientGeocoder is the class that we use to get the geocoder that get us the location. We will use getLatLng() method to get latitude/longitude of any location. Check the following code.
var place = "New York"; geocoder = new GClientGeocoder(); geocoder.getLatLng(place, function(point) { if (!point) { alert(place + " not found"); } else { var info = "<h3>"+place+"</h3>Latitude: "+point.y+" Longitude:"+point.x; var marker = new GMarker(point); map.addOverlay(marker); marker.openInfoWindowHtml(info); } });
Code language: JavaScript (javascript)
In above code snippet we passed string “New York” and a handler function to getLatLng() method of GClientGeocoder. GClientGeocoder class will call google server for the location and when it gets the result, it pass the result to the handler function that we specified. Thus handler function will get point (GPoint) object from which we can get the latitude and longitude of location. In above code we have created a marker and placed it on the map.

Online Demo

Google Map Reverse Geocode Example

View Comments

  • ops.. Thanks mackdk for pointing out the error. I will update the post and make it geocoding.

  • hello everybody
    i m creating a module of map in which i want to display all city of the visible part of the map
    (i have database in which state_name city_name lat_of_city long_of_city)
    so i want to find current state when user drag the map.

    how to find when user drag the map?
    and then current location

    please help me

    thanks

  • ohhhhhhhhhhh realy thanx buddy u solve my problem... currently i am working on application where the Lat/Long is required i simple get idea from ur site and find the solution... realy big help for me thanx keep it up....

  • Hi Viral Patel and everyone

    Do you have any basic example code of Reverse geocoding? If you do, may I have it? I'm kinda new to this Reverse Geocoding stuff.

    sincerely yours

    Harry

  • I'm a total newbie and having trouble integrating your GeoCode code with the initialize function in your earlier tutorial. When a given page loads, I would like it to show the map for New York (or whatever is in that variable. Can you share a brief code example of how it would look?

    Thanks very much!

  • i tried this code
    and also set permission in manifest.xml internet,access_fine_location,access_coarse_location

    but this project could not get location name from getFromLocation().
    getFromLocation(lat.long,1) always return null

    please kindly read this and help me

Share
Published by
Viral Patel
Tags: google maps mashup reverse geocode

Recent Posts

  • Java

Java URL Encoder/Decoder Example

Java URL Encoder/Decoder Example - In this tutorial we will see how to URL encode/decode…

4 years ago
  • General

How to Show Multiple Examples in OpenAPI Spec

Show Multiple Examples in OpenAPI - OpenAPI (aka Swagger) Specifications has become a defecto standard…

4 years ago
  • General

How to Run Local WordPress using Docker

Local WordPress using Docker - Running a local WordPress development environment is crucial for testing…

4 years ago
  • Java

Create and Validate JWT Token in Java using JJWT

1. JWT Token Overview JSON Web Token (JWT) is an open standard defines a compact…

4 years ago
  • Spring Boot

Spring Boot GraphQL Subscription Realtime API

GraphQL Subscription provides a great way of building real-time API. In this tutorial we will…

4 years ago
  • Spring Boot

Spring Boot DynamoDB Integration Test using Testcontainers

1. Overview Spring Boot Webflux DynamoDB Integration tests - In this tutorial we will see…

4 years ago