6.14. Adding Web Maps

There could be several Web Maps in NextGIS Web. For example one map is for work, another is for public access and third is for testing of layer styles.

Each Web Map has its own URL address. Different access permissions for Web Map viewing can be set for users and groups.

Web Map displays layers. They can be turned on or off by the user. You can set the order of the layers, default layer visibility and create layer groups. Groups on a map do not relate to resource groups in the Control Panel. Groups may be nested.

To view Web Map in browser, press next to its name in the resource list or open the resource page and select Display in the Actions panel on the right. It will open in a web viewer.

6.14.1. Creating a Web Map

To create a Web Map, open the resource group where you want to add it, press Create resource button and in the pop-up window select “Web Map”. (see Pic. 6.179.).

../../_images/ngweb_create_webmap_en.png

Pic. 6.179. Selection of “Web Map” resource type

Create resource dialog for a Web Map will open, see Pic. 6.180..

../../_images/admin_webmap_name_eng_3.png

Pic. 6.180. “Create resource” dialog for Web Map

Enter Web Map display name that will be visible in the administrator interface and in the Web Map viewer. (You can set up a title to be displayed in Web Map viewer in the Settings tab.)

“Keyname” field is optional.

You can also add resource description and metadata on the corresponding tabs.

If you want to create a copy of an existing Web Map, you can clone it.

6.14.2. Web Map Layers

In the “Layers” tab you can add, group or remove layers and change their order using the buttons “Add layer”, “Add group”, “Customize draw order” and “Delete layer” (X at the end of each row).

../../_images/admin_webmap_layers_eng_3.png

Pic. 6.181. “Layers” tab

To view the data of the layer on a map, you need to create at least one layer style. More on creating styles for different layer types here.

../../_images/admin_webmap_add_layers_en_2.png

Pic. 6.182. Using style to add a layer to the Web Map

Layers of a particular map have several settings, see Pic. 6.183..

../../_images/webmap_layer_settings_en.png

Pic. 6.183. Layer settings

“Enabled” checkbox sets default visibility of a layer.

The “Transparency” field sets the layer transparency on a map between 0% (opaque) and 100% (completely transparent).

We recommend setting the “Adapter” field to “Image” (a single image for the entire map), unless there are some special requirements. Alternatively, you can choose “Tiles” (images of 256 x 256 pixels).

You can also set up a scale range. Min scale corresponds to the smaller image, max scale - to the larger, more detailed image. For example, if you want a layer to be displayed in scales between 1 : 250,000 and 1 : 5,000, the higher number (250,000) is the minimal scale.

Note

Max and min scale can be set not only using the Web Map’s Layers tab, but also in the layer style itself (See an example). If the layer should not be displayed in a certain range of scales, we recommend to mark it in the Web Map’s layer settings. If the scale limit is only set within the style, empty tiles will be generated in other scales, which is less efficient.

To go back to the layer list, press Hide details.

6.14.2.1. Layer groups

Layers added to Web Map can be gathered into groups. It will only affect the layer tree displayed on the map itself, making the legend more legible. It does not affect the actual resource group contents.

To add a new group press + Group. To put a layer into a group, drag and drop.

../../_images/webmap_group_settings_en.png

Pic. 6.184. Layer group settings

Expanded option defines the way the layer group is presented in the layer tree when the Web Map is opened.

If Exclusive is ticked, layers in the group will only be displayed one at a time. If you activate a layer, all other layers of the group are automatically hidden. It can be handy if you have, for example, a group of satellite data that completely overlaps.

To go back to the layer list, press Hide details.

6.14.2.2. Layer draw order

The order of the layers on a map can be different from the order in which they appear in the tree. Click “Customize draw order” in the “Layers” tab of the map settings. It allows to choose the order of the displayed layers without affecting the groups.

../../_images/admin_webmap_layerorders_1_cut_en.png

Pic. 6.185. Layer order as is: satellite images obscure the layer where the boundaries are marked

../../_images/admin_webmap_layerorders_2_cut_en.png

Pic. 6.186. Different draw order: the layer marking the boundaries is above the satellite images, while the layer groups on the left remain unchanged

To go back to the list of layers, press Back to layers and groups. To restore the initial layer order, press Use default draw order.

Press Save to save the changes.

6.14.3. Basemaps

“Basemaps” tab allows to add and remove basemaps using corresponding buttons “Add” and “Remove” (see Pic. 6.187.).

../../_images/admin_webmap_basemaps_eng_3.png

Pic. 6.187. “Basemaps” tab

If “Default basemap” is checked, this basemap will be visible when the Web Map is opened.

“Opacity” field sets basemap transparency on a map in a range between 0 and 100%.

6.14.3.1. Creating Basemap

Press Create resource button and select Basemap (Pic. 6.188.). In the opened window enter the name of the resource that will be displayed in the administrator interface (Pic. 6.189.).

../../_images/ngweb_create_basemap_en.png

Pic. 6.188. Selection of “Basemap” resource type

../../_images/ngweb_admin_basemap_name_eng_3.png

Pic. 6.189. Basemap name

The “Description” and “Metadata” of the resource are configured on the corresponding tabs (Pic. 6.190.). On the “Description” tab you can add any text describing the content.

../../_images/ngweb_admin_basemap_desc_eng_3.png

Pic. 6.190. Basemap description

In the “Basemap” tab you must enter the URL-address of the TMS service (Pic. 6.191.). There are two ways to do so:

Use the search bar to find a map in the QuickMapServices catalog. After a map is selected, other fields will be filled in automatically.
Enter the address manually.

The basemap will be previewed below. Press button_toggle_basemap Toggle basemap and move the opacity slider to compare it to the standard OSM basemap.

../../_images/create_basemap_settings_en_3.png

Pic. 6.191. Basemap settings

6.14.3.2. Web Map with no basemap

By default a Web Map is created with OpenStreetMap basemap. If you need a map without a basemap: create a new basemap and add it to your Web Map. Then turn this newly created basemap off.

See how it works in our video:

Watch on youtube.

6.14.3.3. How to use any layer in your Web GIS as a basemap

Any layer (style) created in Web GIS can be used as a source of a tile service and connected as a basemap. To do this, you should:

Create the required layer (vector or raster) and a style for it. Inside the style you’ll find a link marked TMS service - you will need it for step 3;
Enable caching (to speed up Web Map processing, for Premium plan only);
Create “Basemap” resource with unchecked “Use options from QMS” and the URL of the above-created TMS layer.

6.14.4. Settings

In the “Settings” tab you can modify several parameters:

title that will be displayed on the Web Map instead of resource name;
legend visibility (more here);
enable annotations (more on annotations see here);
select measurement spacial reference system;
allow layer editing;
set up initial and constraining extent (see below);
select bookmark resource.

../../_images/admin_webmap_settings_tab_en_3.png

Pic. 6.192. “Settings” tab

6.14.5. Extent

In the Settings tab you can set up:

Initial extent - part of the Web Map that is shown upon its opening
Constraining extent - users will not be able to zoom out or scroll past this extent

Use the four fields to set the extent measured in degrees.

Pic. 6.193. Extent settings

Extent from layer button allows to set Web Map extent from the layer’s extent. Click it to open the “Select layer” window, where you can select a layer to use for setting the Web Map extent (see Pic. 6.194.). The four fields for the extent coordinates will be filled in.

../../_images/ngw_select_resource2_eng_3.png

Pic. 6.194. “Select layer” window

Tip

Extent coordinates could be generated using third-party services, for example http://boundingbox.klokantech.com/ (select csv in a list).

6.14.6. Bookmarks

In the “Bookmark resource” field of the Settings tab you can select a vector layer with any type of geometry to use for bookmarks. The Web Map will show bookmarks panel (see Pic. 6.195.) with names defined by “Label attribute” if it is set (see Pic. 6.196.).

Pic. 6.195. “Bookmarks” tab and the bookmarks viewed on the map

../../_images/bookmark_attribute_en_2.png

Pic. 6.196. Setting attributes for the vector layer containing boundaries

6.14.8. Final steps

After creating the map content and adjusting settings for all the layers, click “Save” button. A saved map will be shown in the list of maps. Click an icon with a map in the list of Web Maps or select “Display” action in the tab on the Web Map properties page to open it in the viewer. While the Web Map resource page is open, you can also open the map by clicking the “View” button on the right. Web Maps viewer is described here. A Web Map URL displayed in the viewer may be shared with other users because it is static.

Warning

After a map is deleted, its URL will no longer be available.