Distance Calculation from Latitude/Longitude using Google MAP APIs between two locations

Here is a sample application which i have developed to get the direction, distance and duration between two location/places using Latitude/Longitude with the help of Google MAP APIs.

This application will also reveals that how can we retrieve place/city name from the Latitude/Longitude.

Let's look at the input of application :-

Just input Lat/Lng and press "get Directions with Distance/Duration!" and get the updated direction MAP with Distance and Duration.
Place A and Place B will displays the Lat/Lng resolved location.

Check out its demo :-

Maps API Directions Illustrated with Latitude and Longitude

From:			To:
Place A:			Place B:
Distance	KM		Duration	Minutes
Language:	English French German Japanese Spanish

Formatted Directions	Map

​

Read More

Distance between two locations with the help of Latitude and Longitude

Finding Distance between two locations with Latitude and Longitude.

Lets see how can we find out the distance and duration between two diffrent locations,
if you have the latitude and longitude of two places.

Here is the pic of the application :-

Steps for finding distance with latitude/longitude.
1) Lets say we have latitude and longitude set P1 and P2.
    Google MAP comes up with the class GLatLng. This class helps to encapsulate Latitude
    and Longitude.
    GLatLng is a point in geographical coordinates longitude and latitude. Notice that although usual map projections associate longitude with the x-coordinate of the map, and latitude with the y-coordinate, the latitude cooridnate is always written first, followed by the longitude, as it is custom in cartography.  

2) From this GLatLng points we need to get place name first.
    class GClientGeocoder will help us to get the place name from LatLng.
   This class is used to communicate directly with Google servers to obtain geocodes for user specified addresses. In addition, a geocoder maintains its own cache of addresses, which allows repeated queries to be answered without a round trip to the server. As a general best practice, it is not recommended to use GClientGeocoder functions in a loop. Developers that have multiple addresses to geocode should probably use our HTTP Geocoder instead.

Method :- getLocations(latlng:GLatLng, callback:function)

This method performs reverse-geocoding, the conversion of a latitude/longitude pair into human-readable addresses. getLocations() sends a request to the Google geocoding service, asking it to return the address for the given latlng and pass the response in the given callback. As this method requires a call to a Google server, you must also pass a callback method to handle the response. This response will contain a Status code, and if successful, one or more Placemark objects. Note that this method may instead pass an addressable String, as indicated above; in that case, the service will do a standard geocode. If however, the first argument contains a GLatLng, the service will do a reverse-geocode.

Here is the example of function :-

function showAddress(response) {
  map.clearOverlays();
  if (!response || response.Status.code != 200) {
    alert("Status Code:" + response.Status.code);
  } else {
    place = response.Placemark[0];
    point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
    marker = new GMarker(point);
    map.addOverlay(marker);
    marker.openInfoWindowHtml(
        'orig latlng:' + response.name + ' ' + 
        'latlng:' + place.Point.coordinates[1] + "," + place.Point.coordinates[0] + ' ' +
        'Status Code:' + response.Status.code + ' ' +
        'Status Request:' + response.Status.request + ' ' +
        'Address:' + place.address + ' ' +
        'Accuracy:' + place.AddressDetails.Accuracy + ' ' +
        'Country code: ' + place.AddressDetails.Country.CountryNameCode);
  }
}

3) With the help of place name, we will query map for getting the distance and duration.
 A sample code snippet for displaying location with map :-   

// Create a directions object and register a map and DIV to hold the 
// resulting computed directions

var map;
var directionsPanel;
var directions;

function initialize() {
  map = new GMap2(document.getElementById("map_canvas"));
  directionsPanel = document.getElementById("my_textual_div");
  directions = new GDirections(map, directionsPanel);
  directions.load("from:"+ fromAddress + "to: " + toAddress);
}

  fromAddress and toAddress is the same which we can retrieve easily with as we have discussed in step 2.

Let's see the demo in a sample application

 

From:			To:
Place A:			Place B:
Language:	English French German Japanese Spanish

Formatted Directions	Map

Read More

How to add gadget to blogger header ?

Recently experimenting with blogger template came across need of adding gadget to blogger header.


Its very simple , just follow the steps below :-
1) Go to the edit section of blogger template.
    Template->Edit HTML
2) Search for following code which is about header.

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>




3) Just change the showaddelement to yes.
4) Now move back to template layout view and now one can gadget to the header.

In addition to it one can also change maxwidgets count from 1 to desired number to increase widget counts.


Extending the same concept of showaddelement and maxwidgets, one can also add and increase the gadget count to any other part of your blog. For example to body, footer or side column.


Try this out to customize.

Read More

Distance Google MAP API demo

Google Maps API Directions Illustrated

Enter Location in format #place,#city

Experimenting with google maps api, i have developed this quick utility to show the distance and duration between locations. TRY IT OUT

From:			To:
Language:	English French German Japanese Spanish
Distance:	KMs
Duration:	Minutes

Formatted Directions	Map

Read More

Distance between two locations with Google Map API

One can easily calculate distance between two location with the help of Google Map APIs. Google Map APIs comes with a set of classes which helps in doing such tasks.
class GDirection, helps in getting the travel distance between the two different location.
So example shown below targets following features :-

•  Getting distance between two location. 
•  Getting duration between two location. 

Here goes the complete java script code for it

-------------------------------------------------------------------------------

    <script type="text/javascript">
    var map;
    var gdir;
    var geocoder = null;
    var addressMarker;
    var distance;
    
    function initialize() {
      if (GBrowserIsCompatible()) {      
        map = new GMap2(document.getElementById("map_canvas"));

        gdir = new GDirections(map, document.getElementById("directions"));
    
        GEvent.addListener(gdir, "load", onGDirectionsLoad);
        GEvent.addListener(gdir, "error", handleErrors);
    
        setDirections("San Francisco", "Mountain View", "en_US");
      }
    }
    
    function setDirections(fromAddress, toAddress, locale) {
      gdir.load("from: " + fromAddress + " to: " + toAddress,
                { "locale": locale });
    }
    
    function onGDirectionsLoad(){ 
        // Use this function to access information about the latest load()
        // results.
        // e.g.
      distance = gdir.getDistance().meters;
      
      alert("Distance is : " + gdir.getDistance().meters + "and Duration Is: " +

            gdir.getDuration().seconds/60);
        
      document.getElementById("fdistance").innerHTML = gdir.getDistance().meters;
      document.getElementById("fduration").innerHTML = gdir.getDuration().seconds/60;
      
    }
    script>
 -------------------------------------------------------------------------------

Can we call GDirection without creating GMap ?
  So the answer is yes, one can create GDirection without pasing GMap also.
So the output will only contain text format.
sample code
       gdir = new GDirections(null, document.getElementById("directions"));
so instead of map object null is passed in above code line, it will
display direction information in only text format.
One can also use above logic to design their own Google Gadgets too.

Read More