Quick start

In this guide you will learn how to:

  • Create your style out of the provided templates.
  • Add overlays, like traffic incidents, to the map.
  • Customize the style.
  • Publish the style and use it in your application.

Setup

Before we start, you will need a Developer Portal account. If you already have it, move to the next section.

  1. Go to Developer Portal.
  2. Click Register.
  3. Fill out the form and follow the provided steps.

Create a style

Map Maker provides a set of style templates that you can use as a base for your own style. You can select additional layers like Point of Interest (POI), Traffic Flow, or Traffic Incidents. We call those additional layers Map Extensions.

  1. Open Map Maker.
  2. Click Add style.
  3. Choose template. You will immediately see the preview. Choose template
  4. Choose Map Extensions. Choose map extensions
  5. Set the style name and click Open style.
  6. You can now edit the style. Foundations

Customize colors

The simplest way to modify the map style is to use the Foundations tab.

  1. Take a look at the Foundations tab. Color changing (1)
  2. Choose one of the Map Colors (for example Water). Each of those colors impacts multiple features on the map.
  3. Observe how oceans' or seas' color changes when you change the color. Observe how water polygons and labels change. Color changing (2)
  4. Zoom in to see more details. Color changing (3)

Read more about how this works in Foundations - Map colors guide.

Publish and Share

The Draft is a style you are currently working on. Every change that you make in Map Maker is immediately saved in the Draft style. You can use the Draft style in your test application. Once you are happy with all the changes, you can publish the Draft style. In your production application, you should only use the Production styles. This way, any additional changes in the Draft won't impact your production application until you publish the style again.

  1. Click the Publish button.
  2. Compare both the Draft and Production versions. Publish style
  3. Click Publish style. Changes from the Draft will be also visible in the Production style.

You can share both Draft and Production styles. Usually, you will only share the Production style and use it in the production applications. Sharing the Draft is useful for testing and showing the progress to other designers or stakeholders.

  1. Click the Share button.
  2. Choose which version you want to share: Draft or Production.
  3. If you want to share the style with others, choose Sharing > Open: view-only. Share style
  4. If you use the style in TomTom SDKs, you can export it without an API Key and provide it separately later.
  5. Otherwise, read How do I get a TomTom API Key?.
  6. You can copy the URL to the style or download the style file to your computer.

Remember to always protect your API Key. Never share it with others. If you plan to use it on the Web, enable domain whitelisting in the Edit key > Security, in the dashboard on the Developer Portal.

Learn more on how to use your style in TomTom SDKs:

Next steps

Since you have learned how to create and publish your first style, here are recommendations for the next steps:


How do you like our docs?