Basic map

Create your first maptimize map is really easy. If you already have your dataset in CSV or JSON format you will see your first map in less than 5 minutes.
Here are the three steps to create your first map with maptimize clustering engine.

1 – Create a Maptimize account

If you don’t already have an account, create your account in 10s, you just need an email and password.

2 – Upload your first data

Upload you first data set using our web interface when you are logged in or or web service.

You do prefer JSON format as it supports type like array, string or number.
Your JSON must be like this:

{ "points": [ { "id": 1, "coords": "12,34", "sex": "F", "age": 32, "tags": [1, 3] }, 
              { "id": 3, "coords": "-12,12", "sex": "M", "age": 44, "tags": [1, 3, 12] },
              ....
              { "id": 4, "coords": "-12.50,33.123", "sex": "M", "age": 12, "tags": [2] } ] }

Required keys are id and coords (with latitude, longitude).
You can also add an html key with html markup string to be displayed inside marker’s info window.
You can alse add keys that will be used for filtering the map or compute aggregates data on clusters. This tutorial doesn’t cover the filtering part.

You support also CSV format.
You file must have column names: id, lat, lng.

"id", "lat", "lng"
"1", "12", "34"
"2", "-12", "12"
...
"4" , "-12.50", "33.123"

3. Write your first HTML/Javascript file

Create your HTML page with:

• Google map Javascript include tag (google V2 or V3, see google map documentation )
• Maptimize Javascript include with your production or development key (you have details on map tab on your dashboard)
• An empty div to display the map
• Few lines of Javascript code to instanciate the google map as describe in google map documentation )
• One line of code to connect maptimize controller on google map object.
• And you are all set!

The basic maptimize code is only one line of code. Instantly, you have our powerful clustering engine connected on your data
and the info window when you click on a marker if you have set html data in your import file.

Our API is exactly the same for google map V2 and V3.

Code

You can view/download the full example here.

You can download a full code based on our crunchpanorama data set. Just change your maptimize key and you’ll see your data.

• index_gmapV2.html for Google Map V3
• index_gmapV3.html for Google Map V3

If you start a new project you encourage you to use google maps V3. V2 is now deprecated by Google Maps.