Guide For importing WMS/WMTS Maps from KML to Map Plus

Map Plus helps, usage, issues, bug report, downloads...

Guide For importing WMS/WMTS Maps from KML to Map Plus

Postby Zax » 2018-12-10 4:52

Recently, many Map Plus users asked about how to import WMS/WMTS maps from a KML specification, this article gives some simple steps on this.

Because Map Plus only support importing static KMLs, which indicates the KML to fully contain all its map content in the file itself locally. If the KML/KMZ is "dynamic" that includes some links to any online map content or services, you could not import these content to Map Plus app from the KML, or even imported, these content would not change if the online content changes.

Anyway, For most of these KML/KMZ, they are referring to common map services under WMS/WMTS standard, and Map Plus do support importing WMS/WMTS maps via their "GetMap" API. Here is how:

1. Find the WMS service's URL from the KML

Open the file with desktop Google Earth (Pro) software, open and unfold the local or online folders in the place list until you find an item with a "overlay" icon, as pic shown below. Right click on it and copy its "Link" attribute:

wmsinkml.png
wmsinkml.png (202.8 KiB) Viewed 372 times


A common WMS access URL would look like this:

wms_detail.png
wms_detail.png (83.18 KiB) Viewed 372 times


It is combined with: "The WMS root url" + "A question mark (?)" + "Several Access Parameters", such as layers, width, height, srs, version, etc.

2. Configure the map with "Map Maker"

Use our online Map Maker at: https://duweis.com/tool/editor/mapsource.html on a desktop PC/Mac with a web browser. This is a web tool that you don't have to install anything for using.

Choose the "Encode" tab on the left, replace the 2nd row of "http://a..../{$z}/{$x}/{$y}.png" as the WMS url you just get from KML.

Now, make following changes to WMS URL so that it could work for the Map Plus app:

wms_edit.png
wms_edit.png (76.13 KiB) Viewed 372 times

  • Change the "width" and "height" parameter to "256".
    If you need higher resolution and accept the slower and larger Internet data flow, set them both as 512 and don't forget to check the "Retina" switch while previewing this map with Map Maker
  • Change the "srs" parameter to "EPSG:3857", If the "crs" parameter is presented, you also need to change it to be "EPSG:3857".
  • Change the "bbox" parameter to "{$bbox_3857}", if this parameter is missing, append "&bbox={$bbox_3857}" to the end of the url.
  • If the "transparent" parameter is missing and you need the map to be displayed without a white(default) background, append "&transparent=true" to the end of the url

You can do more configuration by using controls and input fields at the bottom of the Map Maker, e.g., to custom the map's name, description, min/max zoom levels, etc.

After that, the "Encode" input field might look like this, which contains 3 or 4 rows, while the 2nd row is the url pattern:

encoded.png
encoded.png (46.41 KiB) Viewed 372 times


3. Preview and check the map with Map Maker?

In order to check if the configuration is OK:

Click the "Tile" tab on the right, choose "Google Road Map" to locate the region of your map content, and then choose "Custom" back for previewing, as pic shown below:

preview.png
preview.png (382.56 KiB) Viewed 372 times


4. Specify the map boundary?

By default, each custom map's content boundary is worldwide, it is suggested to set a more accurate boundary for better performance and experience (e.g. the "Focus" function could pan the viewport to that region).

You can input the the exact boundary directly in the Map Maker's boundary field in the format of "min_longitude, min_latitude, max_longitude, max_latitude", if you do not know it, you can use the Map Maker's preview function and copy the current viewport for that value, as pic shown below.

viewport.png
viewport.png (170.92 KiB) Viewed 372 times


5. Generate QR code for the map?

Open the "QRCode" tab on the right of Map Maker, and click "generate" to make qr-code for the whole configuration.

qrcode.png
qrcode.png (178.68 KiB) Viewed 372 times


You can save the qr-code by right click on it and choose "Save as".

6. Import QR code with the app?

Launch the app on an iOS device, tap "User Data" button on the main screen, then tap "add", choose "Import From QR-Code", point the device camera to the QR-Code you just generated in Map Maker. The app would automatically import the map configuration from it and create a new "Custom Online Map" typed item in your user data for it. Select that item and choose "Show On Map" to toggle its visibility for viewing.

How to Specify more layers in WMS url?
WMS services may contain more than one layers, each layer may contain more than one styles, you can specify which layers and styles you want to combine together within one configuration, by editing the "layers" and "styles" parameters.

First, append "?service=WMS&request=GetCapabilities" to the WMS root url, paste that url in a web browser and access.
for example, if your WMS url is like:
http://basemap.nationalmap.gov/arcgis/services/USGSTopo/MapServer/WMSServer?service=.......
You need to visit:
http://basemap.nationalmap.gov/arcgis/services/USGSTopo/MapServer/WMSServer?service=WMS&request=GetCapabilities

Then you may get something like this:
Code: [Select all]
<?xml version="1.0" encoding="UTF-8"?>
<WMS_Capabilities version="1.3.0" ......>
    <Capability>
        ......
        <Layer>
            <Layer queryable="1">
                <Name>0</Name>
                ......
                <Style>
                    <Name>default</Name>
                </Style>
                ......
            </Layer>
         ......
        </Layer>
    </Capability>
</WMS_Capabilities>
 
XML

You can find all layers' definition under the <Capability><Layer> node, each <Layer> contains one or more <Style>, get the <Name> attribute of the layer and one of its style, and edit the WMS url pattern with the new layers and styles parameter like "...&layers=0&styles=default&...".

If more than one layers are needed, combine them with commas. For example, layers of "hill","river" and "tree", with styles of "default", "highlight" and "dark" could be combined in the url as "...&layers=hill,river,tree&styles=default,highlight,dark&...".

Be aware that each layer should have one and only one layer related, which means the number of layer names and style names should be the same.

About the Web Mercator -Global Projection Model?

Custom maps made by Map maker uses the "Web Mercator - Global" projection (model) by default, which is same as the Web Mercator projection for most areas of the world except but coordinates located in Mainland China, which uses a different datum from WGS84 with 200 ~ 2000 meters offset. This "Web Mercator - Global" model is used for global maps such as "Google Road Map", "Bing Road Map", etc, while the "Web Mercator" one used for "Google Satellite Map", "Open Street Map", etc. If you overlap these 2 kinds of map together, we will find these content could not be matched for Chinese places, road, and building.

If your map content has nothing to do with Chinese coordinates, use the projection of either "Web Mercator - Global" or "Web Mercator" makes no difference for your content displaying. But because the Map Plus app does not allow with different projection (model) maps to be displayed (overlapped) together, if you want to display your custom map content to be overlapped above a Google, Bing or Open Street Map, you need to set the projection to be exactly the same as the map you want to display with. For example, "Web Mercator - Global" for Google Road Map, and "Web Mercator" for Open Street Map. Anyway, if you have specified a boundary for your custom map with a region out of China, the app could accept the projection difference between "Web Mercator" and its variants, and use either projection model would be OK.

If you map content has coordinates in China, and could not accept 1000 meters accuracy error, you have to set the projection (model) exactly as the projection of your map content. If it is different from the model of the Google or OSM map, it means you should never display it with those maps together.
Zax Zeng
Duwei Technology
User avatar
Zax
★★★★★
 
Posts: 1144
Joined: 2011-07-27 0:54

Return to Map Plus - Forums

cron