New version of distance finder
You might remember the previous version of my distance finder. It's a small google maps project that helps you find the distance and the route between two points.
I have decided to improve the layout of the project and add new features. Here's the new version!
A major improvement is the fact that you can now choose a 'via' address for the route. Also, the app is now available in both English and Romanian.
More updates will follow as I'm working on improving it even further!
How to use Google Maps Street View
My fourth google maps tutorial was published on 1stwebdesigner.com. The tutorial covers another of google maps features, street view.
I have built an app for this tutorial, an interactive visit of Paris. You’ll be able to visit certain locations, walk through Paris or take virtual tours.
You can read the tutorial here and also play with the app.
You can also download the source code.
Google Maps V3 Tips and Tricks
While studying for the google maps certification exam I made this list of tips about the 3rd version of the API. Useful as a recap of the most important features of the API.
Tips and Tricks:
- This version of the API was designed to work well on mobile devices. To check the device type and make the appropriate settings, use the navigator.userAgent property.
- You can set a default language for the map and how it behaves based on a given country or territory. For this, the language and region parameters must be set when loading the API.
- It's best to load the script asynchronously, to make sure the rest of your pages content renders properly.
- The basic objects you should know are: map, latlng, marker.
- There are two types of events: users events and MVC state changed events. User events are triggered when the user clicks on the map, goes with the mouse pointer over the marker, etc. MVC state changed events are triggered when the map's properties are changed. You can also handle DOM events.
- User events can pass arguments, MVC state changed events do not.
- There are 3 types of controls: navigation, scale and maptype.
- The default controls can be disabled by setting the Map's disableDefaultUI property (within the Map options object) to true. The map options object is also used to add or remove controls, by setting the appropriate property value to false.
- The are some options you can choose for controls, by modifying the navigationControlOptions, scaleControlOptions or mapTypeControlOptions objects. The style and position of the controls can be set this way.
- You can also create custom controls. Steps to create one: drawing the control, positioning, handling events.
- Most custom overlays you can use are: markers, polylines, polygons, info windows and custom overlays.
- If you wish to manage a set of overlays, you should create an array to hold the overlays and amnage each of the overlays in it one by one.
- Ground Overlays can be used for rendering images on the map.
- Geocoding means turning addresses into coordinates (longitude and latitude). Using one of the provided services, you can use geocoding and also reverse geocoding.
- The calls to the geocoding service are asynchronous, a callback method must be specified to be executed when the result is received.
- You can also use the google maps API to find directions between two places and properly show them on the map.
- The directions service is used for finding the directions. The call to this service is also asynchronous.
- To view the directions you need to use the DirectionsRenderer object.
- To make the directions draggable you only need to set the draggable option for the renderer to true.
- You can set waypoints for routes.
- The routes are formed of legs (between waypoints, or one leg if there are no waypoints set) and steps (more steps form a leg). You can view all of these using the DirectionsLeg and DirectionsStep objects.
- There's also the elevations service that helps you find the elevation of your locations. This too is asynchronous.
- The last service provided is the street view service. To add this one you just need to add the Street View control in the map options.
- The basic map types are: ROADMAP, SATELLITE, HYBRID (roadmap + satellite) and TERRAIN.
- You can add new types and also change the properties of the existing ones.
For more info on Google Maps V3 read Developer's guide.
Creating an Interactive Travel Map using the Google Maps API
I've played again with the google maps api and started working on an interactive travel map. The idea is that everyone can add new locations and view the locations added by others.
I've also written a tutorial about this, you can read it here.
Other improvements to my distance finder
I've added some more features to my distance finder. You can now share your search results with your friends on twitter. I've used twitter's @anywhere to do this.
If you want to find out how I did this, I've also written a tutorial.
I'm planning to also integrate facebook so you'll be able to share your results on there too
Happy birthday Google Maps!
I just found out that google maps turns 5 today! It's a nice coincidence since my google maps tutorial was published today on 1stwebdesigner.com. The second part will be published this friday!
To celebrate the occasion, Keir Clarke from Google Maps Mania has created a mashup that I also contributed to. Along with lots of other developers, I've added my distance finder tool on it! Check it out!
Improvements to distance finder
I've tested some other features of the latest google maps version. I've also added some of them to my distance finder project!
First, I've made the markers draggable. You can now drag them anywhere on the map and the application will show the data about the new route.
Another thing I found out is that you can change the route type from car route to bicycle or walking route. That's what I'm going to add to the app today.
After this, the application will be pretty much finished. Let me know if you have ideas of what else I could add!
I've also written tutorials about how to include google maps in your website. I will post the link when they will get published!
Distance finder using Google Maps
I've played a bit with the newest version of Google Maps and created a distance finder.
You can write two addresses and it tells you the direct distance between them. It also shows the route between them, the length of that route and the approximative time it takes to get there by car.
I've used the javascript google maps api v3. It's pretty easy to use and google maps has loads of features that you can use!
52 weeks of code google maps
I've also submitted something for the java and google maps challenges in 52 weeks of code. My java submission is also using google maps
My submission for the google map challenge takes the ip, get the location coordinates using the ip and shows the location on the map. I've also added a text box for writing the street address and getting a more exact location.
For the java challenge I've done a small JFrame that helps you find the coordinates of a certain address (latitude and longitude). I've used google maps to find the coordinates. It looks like this:

If you want to see the source codes, just ask