In usability we trust

UX and all things web

Tag: Google Maps

Calculating Distances and Areas in Google Maps API 3

As I mentioned in the article Extending Google Maps API 3 with libraries a couple of weeks ago, you can add functionality to the Google Maps API by using libraries. One of these libraries are the Geometry Library. In this article I will show how you can use the function of that library to calculate distances and areas. I will also explain some additional navigation functions that you might find useful.

Continue reading

Extending Google Maps API 3 with libraries

Google Maps API 3 is streamlined to include just the core functionality needed to create basic maps. It’s architected that way too ensure that the API will load as fast as possible. It’s unnecessary for the browser to download and parse functionality that’s not needed. If, however, you need to use specific functionality such as being able to measure distances or display ads, you can get this additional functionality by including a library in the API.

This article will describe how to do just that and what libraries that are currently available.

Continue reading

Dancing markers

The Google Maps API team recently added an eye catching new feature to the Google Maps API v3 which makes it possible to animate markers. This feature has been available in v2 for quite some time and occurs when you drag and drop a marker. It rises the marker up when you drag it and then bounces it into position when you drop it.

The API team however, wasn’t satisfied with just adding what was available in v2. They also added a drop animation similar to the one found in Google Maps on the iPhone. It looks like the marker is being dropped into place from above and then ends with a small bounce.

But they didn’t stop there either. They also added the ability to animate the markers at will. So now we can trigger the animation whenever we feel like it using the setAnimation() method of the Marker object.

Continue reading

My book is now available for pre-order

Here’s an update on how my book project is progressing. The good news is that I have signed a contract with Apress, so they’re going to publish it. I must say that I’m pretty excited about that. It was pretty awesome to see the book with my name on it on Amazon.

Continue reading

Beta chapter from my upcoming book on Google Maps API v3

blank_book_200I am in the process of writing a book about the new Google Maps API v3. I thought that I would make the process a bit more open by releasing beta chapters that some people might read and give feedback on. Hopefully one of those people is you!

Update: The book is finished and was published by Apress with the name Beginning Google Maps API 3. You can check it out on Amazon.com.

Continue reading

Google Maps API 3 – InfoWindows

Using InfoWindows is a brilliant way to display information about a certain location. Since they provides you with a space to put text or whatever HTML you please, they can be used in very interesting ways. In this article, which is the fourth in a series about Google Maps API 3, I will show you how to make good use of this great feature.

Continue reading

Google Maps API 3 – Markers

Markers are the perfect way to put places of interest on a map and that’s probably one of the most used features in digital maps. In this article, which is the third in a series about Google Maps API 3, I will show you how to use them in Google Maps API 3.

Continue reading

I’m writing a book about Google Maps

It’s been a while since I last wrote on this blog and I thought I would get you up to speed why that is. The reason is that I’ve been occupied with writing a book about Google Maps.

I haven’t written a book before so this is new territory for me. What I’ve noticed so far is that it progresses far slower than I predicted, but at least it progresses steadily even if slower than anticipated. I’ve taken a few weeks off of my regular work to devote to writing this book but this time won’t suffice, so there will probably be quite a few late nights and weekends of writing as well.

Continue reading

Google Maps API 3 – The basics

gmmlogoThe Google Maps API has evolved to version 3. This version is a complete rewrite and focuses primarily on speed. The new API also features new ways of using it. This article is the first in a series exploring version 3 of the Google Maps API. This first article will take a look on how to create a simple map and explain some differences from the previous version.

Continue reading

Dynamically Toggle Markers in Google Maps

This article explains how to dynamically toggle the visibility of markers in Google Maps as well as how to deal with an annoying bug that occurs when trying to do this while using an utility library, like the MarkerManager.

Continue reading

Google Maps API version 3 is released

maps_logo_small_blueYesterday a new version of the ever so popular Google Maps API was released. In the new version the focus has been on improving speed, especially on mobile devices. I’ve been fortunate enough to be part of the beta testing and has been able to provide feeback directly to the developers. So far I think they’ve done a great job, even if there’s still more work to be done.

Continue reading

Announcing MapTooltip

One of the shortcomings in the Google Maps API is that there’s no easy way to add tooltips to polylines and polygons. That’s why I felt inclined to build an extension to Google Maps that adds that functionality. MapTooltip makes it possible to add tooltips to any kind of overlay. It’s even possible to have HTML inside it and to style it to fit your design needs.

Continue reading

Working with Info Windows in Google Maps

Google Maps APIHaving Info Windows in a Google Maps is a powerful way of displaying information about a specific point or object. Did you know that there are several kinds of them?

In this article I will show you how to add different kinds of Info Windows that appear when you click on a marker.

Continue reading

Handling Large Amounts of Markers in Google Maps

Google MapsTo use markers in Google Maps is fairly trivial, at least when you have a reasonable amount of them. But once you have more than a few hundred of them, performance quickly starts to degrade. In this article I will show you a few approaches to speed up performance. I’ve also put together a test page to compare them.

Update [2009-05-06]:This article has been updated with the addition of the utility library MarkerClusterer. The test results in the end of the article and the test page has also been revised.

Continue reading

Basic operations with markers in Google Maps

Google MapsMarkers is one of the core features in Google Maps and an effective way of displaying places on a map. In this article I will show you how to add a basic marker to a map and also how to add some interactivity to it.

Continue reading

Unobtrusive Google Maps

When developing web applications we can never be sure what the environment for the user is. He could for example use our application from a mobile device with a browser with limited Javascript support. Like Roger Johansson pointed out in Making Google Maps more accessible, we must prevent our applications from breaking under these circumstances by making them degrade gracefully.

In this article I will show you how to make Google Maps degrade gracefully by providing a fallback for non-javascript users using the Google Static Maps API.

Continue reading

Simple maps with the Google Static Maps API

Google Static Maps API is an easy way to provide a map when the user doesn’t have Javascript available. Sure it’s not near as powerful as the full Google Maps API but still, it can provide you with a basic map that can contain both markers and paths.

Continue reading

Populating Google Maps with Microformats revisited

A few month ago I posted about a demo where I used content marked up with Microformats to populate a Google map using Javascript. Well, now I’ve improved that demo somewhat.

Continue reading

Polylines in Google Maps [Part 2]

In part 1 I showed how to use and optimize performance on polylines in Google Maps using Javascript. In this article I will show you how to get even better performance by encoding the polylines on the server.

Continue reading

Bounding Box in Google Maps

Normally when you initialize a new Google map you set the coordinates for the center of the map and manually specifies the initial zoom level. Sometimes, however, there’s a need to dynamically calculate the center point and zoom level for certain content to fit into the viewport.

Continue reading

Polylines in Google Maps [Part 1]

Polylines are used to mark out roads, borders and other things that are made of lines in maps. The Google Maps API offers a class for drawing these lines on a Google Map called GPolyline. In this article I will show you how to use these and how to deal with potential performance issues when the polylines gets more complex.

Continue reading

Effective Use of Custom Icons in Google Maps

Google MapsI’m currently developing a web application that uses Google Maps and have lots of markers with custom icons to mark different things on the map. To administer all these different icons is quite a chore and it took me some time to find an effective way of working with them.

Continue reading