After taking an unintended long break after the 100th post, I am back with more examples and several more GIS news. Today, we will take a look at a simple example showcasing the use of the Google’s Directions Services. Using the Google’s Direction service, we can calculate the distance between two points, show the path between these two points, calculate the average time taken to traverse this distance and we can also enforce several constraints on this path.
The Google Directions API is a service that calculates the directions between locations using an HTTP request. You may pass either an address (string) or a latitude/longitude coordinate as the origin and destination. If you pass an address as a string, the Directions service geocodes the string and converts it to a latitude-longitude coordinate to calculate directions. The origin and destination are two mandatory parameters for a directions request, whereas several other optional parameters like mode of travel, waypoints, avoid tolls, avoid highways, etc. are also used. We will be having a look at each of these parameters in subsequent examples.
Today, we will have a look at a simple piece of code which will show a path between two pre-defined locations Pune and Mumbai in India (hard-coded example) using the directions services. Let us have a look at the code directly. I have commented the code where ever necessary.
The output of the above code will appear as seen in the result section above. Two labeled markers will appear at the origin and destination address with a purple polyline depicting the route between the two locations. In later examples, we will see several more complex examples using the Directions Service.
If you have any queries/ doubts regarding today’s code, please leave a comment! Hope you find this example helpful!
If you have any queries/ doubts regarding today’s code, please leave a comment! Hope you find this example helpful!
Just find your web. I find it enormously interesting. I tested this example but could not get it to work first. Then I added
ReplyDeletelink href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css"
and it did work.
Perhaps it is a reason for a change of your example?
Hello Mr. Hans...Thank you for your feedback. However, I have checked my code again upon reading your comment, but it is still working fine. The map loads up properly without any issues...
ReplyDeleteI don't understand why you are facing a problem. The style sheet that you are pointing to is not required in my code as I have set the div style in the code itself!
As a result, I don't see any reason for a change. However, I appreciate your feedback Sir and I urge other readers to report any such similar error if they face one...