RSS

Tag Archives: maxmind

Display user geo location data with Google Map API or Maxmind

First try to get geo data with Google JSApi. If it fails then try to connect with Maxmind database and retrieve data. This is a fallback option

<!DOCTYPE>
<html>
<head>
<title>Geo data</title>
<script src="http://maps.google.com/maps?file=api&v=2&amp;sensor=true" type="text/javascript"></script>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script language="JavaScript" src="http://j.maxmind.com/app/geoip.js"></script>
<script>
google.load("jquery", "1.4.4");
</script>
</head>

<body>
<script type="text/javascript">
$(document).ready(function(){
if(google.loader.ClientLocation) {
// Google has found you
visitor_lat = google.loader.ClientLocation.latitude;
visitor_lon = google.loader.ClientLocation.longitude;
visitor_city = google.loader.ClientLocation.address.city;
visitor_region = google.loader.ClientLocation.address.region;
visitor_country = google.loader.ClientLocation.address.country;
visitor_countrycode = google.loader.ClientLocation.address.country_code;

$("#user_method").html("Google Geo");
$("#user_latlong").html(visitor_lat + " / " + visitor_lon);
$("#user_town").html(visitor_city); $("#user_county").html(visitor_region);
$("#user_country").html(visitor_country + " (" + visitor_countrycode + ")");
}
else {
// Google couldnt find you, Maxmind could
visitor_lat = geoip_latitude();
visitor_lon = geoip_longitude();
visitor_city = geoip_city();
visitor_region_code = geoip_region();
visitor_region = geoip_region_name();
visitor_country = geoip_country_name();
visitor_countrycode = geoip_country_code();
visitor_postcode = geoip_postal_code();

$("#user_method").html("MaxMind");
$("#user_latlong").html(visitor_lat + " / " + visitor_lon);
$("#user_postcode").html(visitor_postcode);
$("#user_town").html(visitor_city); $("#user_county").html(visitor_region + " ("+visitor_region_code+")");
$("#user_country").html(visitor_country + " (" + visitor_countrycode + ")");
}

if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
var latlng = new GLatLng(visitor_lat, visitor_lon);
map.setCenter(latlng, 13);
map.addOverlay(new GMarker(latlng));

var center = latlng;
var radius = 0.65;

//convert kilometers to miles-diameter
var radius = radius*1.609344;
var latOffset = 0.01;
var lonOffset = 0.01;
var latConv = center.distanceFrom(new GLatLng(center.lat()+0.1, center.lng()))/100;
var lngConv = center.distanceFrom(new GLatLng(center.lat(), center.lng()+0.1))/100;
// nodes = number of points to create circle polygon
var nodes = 40;
//Loop
var points = [];
var step = parseInt(360/nodes)||10;
for(var i=0; i<=360; i+=step) {
var pint = new GLatLng(center.lat() + (radius/latConv * Math.cos(i * Math.PI/180)), center.lng() + (radius/lngConv * Math.sin(i * Math.PI/ 180)));
// push pints into points array
points.push(pint);
}
var polygon = new GPolygon(points, "#f33f00", 1, 1, "#ff0000", 0.1);
map.addOverlay(polygon);
}
});
</script>
</body>
<div id="geoData">
<table style="width: 560px;" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td>Geocode Method:</td>
<td><span id="user_method"> </span></td>
</tr>
<tr>
<td>Your Latitude/Longitude:</td>
<td><span id="user_latlong"> </span></td>
</tr>
<tr>
<td>Town / City:</td>
<td><span id="user_town"> </span></td>

</tr>
<tr>
<td>Post Code:</td>
<td><span id="user_postcode"> </span></td>
</tr>
<tr>
<td>Approximate County:</td>
<td><span id="user_county"> </span></td>
</tr>
<tr>
<td>Country and Code:</td>
<td><span id="user_country"> </span></td>

</tr>
<tr>
<td colspan="2">
<div id="map_canvas" style=" margin:10px; border:1px solid #007; width: 540px; height: 360px;">Enable Javascript to view this map</div></td>
</tr>
</tbody>
</table>
</div>


</html>


 
6 Comments

Posted by on April 2, 2012 in Geo Programming, JavaScript

 

Tags: , , , ,