WMTS layer

View inAndroidFormsUWPWPFWinUIiOSView on GitHub

Display a layer from a Web Map Tile Service.

Image of WMTS layer

Use case

WMTS services can have several layers. You can use Runtime to explore the layers available from a service. This would commonly be used to enable a browsing experience where users can choose which layers they want to display at run time.

How to use the sample

The layer will be displayed automatically. Use the buttons to choose a different method of loading the layer.

How it works

To display a WMTS layer directly from a URL:

  1. Create a WmtsService object using the URL of the WMTS service.
  2. Create a WmtsLayer object with the ID of the layer to display.

To explore layers from a WMTS service:

  1. Create a WmtsService object using the URL of the WMTS service.
  2. After loading the WMTS service, get the list of WmtsLayerInfo objects from the service info of the WMTS service.
  3. Use one of the layer infos to create the WMTS layer.
  4. Create a basemap with the WMTS layer and set it to the map.

Relevant API

  • WmtsLayer
  • WmtsLayerInfo
  • WmtsService
  • WmtsServiceInfo

About the data

We acknowledge the use of imagery provided by services from the Global Imagery Browse Services (GIBS), operated by the NASA/GSFC/Earth Science Data and Information System (ESDIS) with funding provided by NASA/HQ.

Tags

layer, OGC, raster, tiled, web map tile service

Sample Code

WMTSLayer.cs
Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
// Copyright 2017 Esri.
//
// Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License.
// You may obtain a copy of the License at: http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an
// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific
// language governing permissions and limitations under the License.

using Esri.ArcGISRuntime.Mapping;
using Esri.ArcGISRuntime.Ogc;
using Esri.ArcGISRuntime.UI.Controls;
using Foundation;
using System;
using System.Linq;
using System.Threading.Tasks;
using UIKit;

namespace ArcGISRuntime.Samples.WMTSLayer
{
    [Register("WMTSLayer")]
    [ArcGISRuntime.Samples.Shared.Attributes.Sample(
        name: "WMTS layer",
        category: "Layers",
        description: "Display a layer from a Web Map Tile Service.",
        instructions: "The layer will be displayed automatically. Use the buttons to choose a different method of loading the layer.",
        tags: new[] { "OGC", "layer", "raster", "tiled", "web map tile service" })]
    public class WMTSLayer : UIViewController
    {
        // Hold references to UI controls.
        private MapView _myMapView;
        private UISegmentedControl _constructorChoiceButton;

        public WMTSLayer()
        {
            Title = "WMTS layer";
        }

        private async void Initialize()
        {
            await LoadWMTSLayerAsync(true);
        }

        private async void _constructorChoiceButton_ValueChanged(object sender, EventArgs e)
        {
            //Load the WMTS layer using service info or URL.
            switch (_constructorChoiceButton.SelectedSegment)
            {
                case 0:
                    await LoadWMTSLayerAsync(true);
                    break;

                case 1:
                    await LoadWMTSLayerAsync(false);
                    break;
            }
        }

        private async Task LoadWMTSLayerAsync(bool uriMode)
        {
            try
            {
                // Create a new map.
                Map myMap = new Map();

                // Get the basemap from the map.
                Basemap myBasemap = myMap.Basemap;

                // Get the layer collection for the base layers.
                LayerCollection myLayerCollection = myBasemap.BaseLayers;

                // Create an instance for the WMTS layer.
                WmtsLayer myWmtsLayer;

                // Define the Uri to the WMTS service.
                Uri wmtsUri = new Uri("https://gibs.earthdata.nasa.gov/wmts/epsg4326/best");

                if (uriMode)
                {
                    // Create a WMTS layer using a Uri and provide an Id value.
                    myWmtsLayer = new WmtsLayer(wmtsUri, "SRTM_Color_Index");
                }
                else
                {
                    // Define a new instance of the WMTS service.
                    WmtsService myWmtsService = new WmtsService(wmtsUri);

                    // Load the WMTS service.
                    await myWmtsService.LoadAsync();

                    // Get the service information (i.e. metadata) about the WMTS service.
                    WmtsServiceInfo myWmtsServiceInfo = myWmtsService.ServiceInfo;

                    // Obtain the read only list of WMTS layer info objects, and select the one with the desired Id value.
                    WmtsLayerInfo info = myWmtsServiceInfo.LayerInfos.Single(l => l.Id == "SRTM_Color_Index");

                    // Create a WMTS layer using WMTS layer info.
                    myWmtsLayer = new WmtsLayer(info);
                }

                // Add the WMTS layer to the layer collection of the map.
                myLayerCollection.Add(myWmtsLayer);

                // Assign the map to the MapView.
                _myMapView.Map = myMap;

                // Zoom to appropriate level for iOS.
                await _myMapView.SetViewpointScaleAsync(300000000);
            }
            catch (Exception ex)
            {
                UIAlertController alert = UIAlertController.Create("Error", ex.Message, UIAlertControllerStyle.Alert);
                alert.AddAction(UIAlertAction.Create("OK", UIAlertActionStyle.Default, null));
                PresentViewController(alert, true, null);
            }
        }

        public override void ViewDidLoad()
        {
            base.ViewDidLoad();
            Initialize();
        }

        public override void LoadView()
        {
            // Create the views.
            View = new UIView() { BackgroundColor = ApplicationTheme.BackgroundColor };

            _myMapView = new MapView();
            _myMapView.TranslatesAutoresizingMaskIntoConstraints = false;

            _constructorChoiceButton = new UISegmentedControl("URI", "Service Info")
            {
                BackgroundColor = ApplicationTheme.BackgroundColor,
                TranslatesAutoresizingMaskIntoConstraints = false,
                SelectedSegment = 0,
                // Clean up borders of segmented control - avoid corner pixels.
                ClipsToBounds = true,
                Layer = { CornerRadius = 5 }
            };

            // Add the views.
            View.AddSubviews(_myMapView, _constructorChoiceButton);

            // Lay out the views.
            NSLayoutConstraint.ActivateConstraints(new[]
            {
                _myMapView.TopAnchor.ConstraintEqualTo(View.TopAnchor),
                _myMapView.LeadingAnchor.ConstraintEqualTo(View.LeadingAnchor),
                _myMapView.TrailingAnchor.ConstraintEqualTo(View.TrailingAnchor),
                _myMapView.BottomAnchor.ConstraintEqualTo(View.BottomAnchor),

                _constructorChoiceButton.LeadingAnchor.ConstraintEqualTo(View.LayoutMarginsGuide.LeadingAnchor),
                _constructorChoiceButton.TrailingAnchor.ConstraintEqualTo(View.LayoutMarginsGuide.TrailingAnchor),
                _constructorChoiceButton.TopAnchor.ConstraintEqualTo(View.SafeAreaLayoutGuide.TopAnchor, 8)
            });
        }

        public override void ViewWillAppear(bool animated)
        {
            base.ViewWillAppear(animated);

            // Subscribe to events.
            _constructorChoiceButton.ValueChanged += _constructorChoiceButton_ValueChanged;
        }

        public override void ViewDidDisappear(bool animated)
        {
            base.ViewDidDisappear(animated);

            // Unsubscribe from events, per best practice.
            _constructorChoiceButton.ValueChanged -= _constructorChoiceButton_ValueChanged;
        }
    }
}

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.