How to create custom basemaps from an image using MapTiler

Please note that we do not provide support with issues resulting from the usage of the MapTiler application – please visit https://support.maptiler.com for MapTiler support!

With MapTiler you can turn images into interactive map layers that can be displayed with Maps Marker Pro:

maptiler-demo

Please be aware that the free version of Maptiler has several limitations (like no Retina support, no custom zoom levels and a watermark being added). To overcome those limitations, you need to upgrade to a premium version of Maptiler.

Tutorial on how to create a custom basemap e.g. from a non-geographical image (based on Maptiler free and Maps Marker Pro v4.13):

1. Download and install “Maptiler Desktop” from https://www.maptiler.com/download/

2. Launch “Map Tiler Desktop” and select “Raster Tiles”

3. Select the image file that should be used for the custom basemap:

4. Click on Continue:

5. Select “Folder”:

The “Advanced option” do not need to be changed, screenshot for reference:

6. Finish by clicking on “Render” and selecting an output directory:

7. To use your map with Maps Marker Pro, you need to upload the folder containing your tiles and their associated data and html files to a hosting account; this can be done using an FTP program such as FileZilla or through your web host’s control panel.

8. To add your map as a custom map in the plugin, navigate to ‘Settings’, then ‘Layers’ then click on the button “Add new layer”:

9) Configure the custom layer as next step:

Set the tiles url. This will be the location of the folder containing the tiles, followed by {z}/{x}/{y}.png (e.g. http://www.myawesomemaps.com/mapnumberone/{z}/{x}/{y}.png). Attribution should also be set accordingly.

Make sure to check the option “Raster tiles”.

Also check the option “No wrap” if you do not want the map to repeat at lowest zoom level.

You will also need to set the option “Bounds” accordingly. In our example, the image is 2048px wide and 1448px high. So the value for bounds for our example would be 1448,0,0,2048. To find the correct values for your image, open the image with Chrome for example to see its dimensions in the tab:

The values for min zoom and max zoom should also be set accordingly to the settings used in MapTiler.

Example configuration:

Finish by clicking “Save”.

Your custom layer can now be used for your maps. To add it, please proceed as follows:

1) add a new or edit an existing map on backend

2) Switch to tab “Layers” and select the created custom layer from the dropdown, then click on “Add basemap”:

3) Finish by optinally making this new basemap the default for this map and save the map:

That´s it.

See demo of the created map here.

Please note that we do not provide support with issues resulting from the usage of the MapTiler application – please visit https://support.maptiler.com for MapTiler support!

2
0
9033
Rate this user guide

Leave a Comment

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

en English
X