How to prepare data for a Google basemap

This page explains how to present your data rendered in MapTiler Engine using a Google Map as the basemap for your output.

  1. Get your Google Maps API key.

    The instructions below also work without an API key, but the Google basemap will have a watermark and be only usable for testing purposes. If that's OK with you, start with step #3.

    Google Maps API key is a unique identifier that authenticates your requests to Google Maps API. To get an API key, you need to set up a Google project and then create an API key for it.

  2. Save your Google Maps API key in MapTiler Engine.

    Go to File > Settings > tab General and paste your key in the Google Maps API key field.

    global_settings_2a.png

  3. Start your tiling task and save its output as a folder with files.

    Follow the guide on how to create tiles from raster data. When you get to the output format selection, choose Folder with tiles.

    mte-output-format-folder.png

  4. Preview your map.

    Once the processing is finished, go to the output folder. (You can get there directly from MapTiler Engine by using the completed task’s Options > Open folder.) Open the index.html file in your browser and go to Google Maps API > Preview. You’ll see your rendering output placed over the Google map. You get a full-size preview of the same map by opening the googlemaps.html file in your browser.

    Screenshot_at_2022-05-13_13-39-00.png

Troubleshooting

  1. “This page can’t load Google Maps correctly.” It may happen that instead of getting the preview you get this message box. In this case, you most likely haven’t saved your Google Maps API key correctly in the settings and it’s probably still empty.

  2. “Oops! Something went wrong…” This is another common error when you’re not able to see the preview in the index.html file. The reason probably is, that the API key you entered is wrong. In this case, you can either check your key once again or try to remove the key from the settings (saving it with an empty field). 

You can get more information about what’s going on in the background using the browser’s console.

On this page