Click For Country

Click For Country is intended to illustrate the ability of the GClientGeocoder object to return the address of a location on a map. To use it, click on the map somewhere and if you click on a land mass, you should see the country name appear below the map.

Further Uses and Ideas:

  • Click For Country Game

How it Works

The G_SATELLITE_MAP map type is used because it displays no labels or place names.



//<![CDATA[
var map;
var geocoder;

function initialize()
{
var latlng = new google.maps.LatLng(0,0);
var myOptions = {zoom:2,center:latlng,mapTypeId:google.maps.MapTypeId.SATELLITE,draggableCursor:'crosshair',mapTypeControlOptions:{style:google.maps.MapTypeControlStyle.DROPDOWN_MENU}};
map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
geocoder = new google.maps.Geocoder();

document.getElementById("message").innerHTML="<p></p>";

google.maps.event.addListener(map, 'click', function(event)
{
codeLatLng(event.latLng)
});
}

function codeLatLng(latlng)
{
geocoder.geocode({'latLng': latlng}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK)
{
if (results[0])
{
var cname="";
try
{
for (var j=0;j<results[0].address_components.length;j++)
{
var xty=results[0].address_components[j].types;
if (xty.indexOf('country')!=-1)
{
cname=results[0].address_components[j].long_name;
}
}
var marker=placeMarker(latlng,cname);
marker.setMap(map);
document.getElementById("message").innerHTML="<p align='center' style='color:#FF0000'>Last Country: "+cname+"</p>";
}
catch(err)
{
document.getElementById("message").innerHTML="<p align='center' style='color:#FF0000'>Last Country: [none]</p>";
}
}
}
else
{
document.getElementById("message").innerHTML="<p align='center' style='color:#FF0000'>Geocoder failed due to: " + status+"</p>";
}
});
}

function placeMarker(location,title)
{
var iconFile = 'marker.png';
var marker = new google.maps.Marker({position:location,map:map,icon:iconFile,title:title,draggable:false});

return marker;
}
//]]>

Relevant Links

http://www.google.com/apis/maps/

Version History

Version Date Description
Version 1.0 10/01/08 First Version
Version 1.1 13/02/2009 Fixed G_SATELLITE_TYPE is not defined error
Version 1.2 23/06/2009 Use var cname=place.AddressDetails.Country.CountryName;
Version 2.0 04/11/2010 Implemented Google Maps API V3. Markers retain county name on hover over.
Version 3.0 18/01/2012 Impemented google.maps.Geocoder() instead of GClientGeocoder()
Version 3.1 05/11/2013 Minor Updates

Comments For This Page

Map goes into error when trying to click to recognize Palestine (Gaza, West Bank)
Also Crimea.
By Mike on 26th June 2015
To localize my cottage
By Adrisse on 14th July 2012
from where we will download your code.. i am unable to run... actually we need click for state on google map same as click for country. Please help!!!!!
By Gagan on 3rd February 2012
mapTypeControl has been removed to make things harder!
By Daft Logic on 19th November 2010
For some reason it doesn't seem to work when you click on Norway. Neither when you click on lakes or the sea.
By Erlend on 17th August 2009
JimBroad, not sure why! I will update (simplify) it. Thanks for the feedback.
By Daft Logic on 23rd June 2009
Why didn't you just use

var cname=place.AddressDetails.Country.CountryName;
By JimBroad on 3rd June 2009
thanks!
On 18th June 2008

Add your own comment below and let others know what you think:

Share This Page

Share this page with others using one of the methods below. Telling others about Daft Logic is good and we appreciate your support!