Display a tiled web layer.

Use case
Tiled map services are a set of pre-generated images (e.g. “tiles”) arranged in folders for each row, column, and zoom level. As you navigate the map, map tiles are requested for the current extent. ArcGISTiledLayer and WmtsLayer are types of tiled map services used for specific data types. WebTiledLayer is useful for displaying other data sources that contain tiles arranged in a row/column/level directory structure, such as OpenStreetMap.
How to use the sample
Run the sample and a map will appear. As you navigate the map, map tiles will be fetched automatically and displayed on the map.
How it works
Web tiled services use a uniform addressing scheme with pre-rendered tiles. Image tiles are accessed via a URL template string, with parameters for subdomain, level, column, and row.
- Subdomain is optional and allows the ArcGIS Maps SDK for Native Apps to balance requests among multiple servers for enhanced performance.
- Level, row, and column select the tiles to load based on the visible extent of the map.
- Create a
WebTiledLayerfrom a URL. - Create a new
Basemapfrom the layer. - Update the attribution on the layer. Note: this is a necessary step because web tiled services don’t have associated service metadata.
- Display the basemap.
For more information about web tiled layers, see the following resources:
Relevant API
- Basemap
- WebTiledLayer
About the data
The basemap in this sample is provided by ArcGIS Living Atlas of the World. ArcGIS Living Atlas of the World provides tiled services with several unique styles.
Tags
layer, OGC, tiled, tiles
Sample Code
// [WriteFile Name=Web_Tiled_Layer, Category=Layers]// [Legal]// 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.// [Legal]
#ifdef PCH_BUILD#include "pch.hpp"#endif // PCH_BUILD
// sample headers#include "Web_Tiled_Layer.h"
// ArcGIS Maps SDK headers#include "Basemap.h"#include "Map.h"#include "MapQuickView.h"#include "Point.h"#include "SpatialReference.h"#include "Viewpoint.h"#include "WebTiledLayer.h"
// Qt headers#include <QStringList>
using namespace Esri::ArcGISRuntime;
Web_Tiled_Layer::Web_Tiled_Layer(QQuickItem* parent /* = nullptr */): QQuickItem(parent){}
Web_Tiled_Layer::~Web_Tiled_Layer() = default;
void Web_Tiled_Layer::init(){ qmlRegisterType<MapQuickView>("Esri.Samples", 1, 0, "MapView"); qmlRegisterType<Web_Tiled_Layer>("Esri.Samples", 1, 0, "Web_Tiled_LayerSample");}
void Web_Tiled_Layer::componentComplete(){ QQuickItem::componentComplete();
// find QML MapView component m_mapView = findChild<MapQuickView*>("mapView");
// Set up the tiled layer parameters const QString templateUrl = "https://server.arcgisonline.com/arcgis/rest/services/Ocean/World_Ocean_Base/MapServer/tile/{level}/{row}/{col}.jpg"; const QString attributionText = "Map tiles by <a href=\"https://livingatlas.arcgis.com\">ArcGIS Living Atlas of the World</a>, " "under <a href=\"https://www.esri.com/en-us/legal/terms/full-master-agreement\">Esri Master License " "Agreement</a>. Data by Esri, Garmin, GEBCO, NOAA NGDC, and other contributors.";
// Create the WebTiledLayer with a template URL WebTiledLayer* webTiledLayer = new WebTiledLayer(templateUrl, this); webTiledLayer->setAttribution(attributionText);
// Create a basemap from the WebTiledLayer Basemap* basemap = new Basemap(webTiledLayer, this);
// Create a map using the WebTiledLayer basemap m_map = new Map(basemap, this);
// Set map to map view m_mapView->setMap(m_map);}// [WriteFile Name=Web_Tiled_Layer, Category=Layers]// [Legal]// 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.// [Legal]
#ifndef WEB_TILED_LAYER_H#define WEB_TILED_LAYER_H
// Qt headers#include <QQuickItem>
namespace Esri::ArcGISRuntime{ class Map; class MapQuickView;}
class Web_Tiled_Layer : public QQuickItem{ Q_OBJECT
public: explicit Web_Tiled_Layer(QQuickItem* parent = nullptr); ~Web_Tiled_Layer() override;
void componentComplete() override; static void init();
private: Esri::ArcGISRuntime::Map* m_map = nullptr; Esri::ArcGISRuntime::MapQuickView* m_mapView = nullptr;};
#endif // WEB_TILED_LAYER_H// [WriteFile Name=Web_Tiled_Layer, Category=Layers]// [Legal]// 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.// [Legal]
import QtQuickimport QtQuick.Controlsimport Esri.Samples
Web_Tiled_LayerSample { id: rootRectangle clip: true width: 800 height: 600
// add a mapView component MapView { anchors.fill: parent objectName: "mapView"
Component.onCompleted: { // Set the focus on MapView to initially enable keyboard navigation forceActiveFocus(); } }}// [Legal]// 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.// [Legal]
// sample headers#include "Web_Tiled_Layer.h"
// ArcGIS Maps SDK headers#include "ArcGISRuntimeEnvironment.h"
// Qt headers#include <QCommandLineParser>#include <QDir>#include <QGuiApplication>#include <QQmlEngine>#include <QQuickView>
// Platform specific headers#ifdef Q_OS_WIN#include <Windows.h>#endif
#define STRINGIZE(x) #x#define QUOTE(x) STRINGIZE(x)
int main(int argc, char *argv[]){ Esri::ArcGISRuntime::ArcGISRuntimeEnvironment::setUseLegacyAuthentication(false); QGuiApplication app(argc, argv); app.setApplicationName(QString("Web_Tiled_Layer"));
// Use of ArcGIS location services, such as basemap styles, geocoding, and routing services, // requires an access token. For more information see // https://links.esri.com/arcgis-runtime-security-auth.
// The following methods grant an access token:
// 1. User authentication: Grants a temporary access token associated with a user's ArcGIS account. // To generate a token, a user logs in to the app with an ArcGIS account that is part of an // organization in ArcGIS Online or ArcGIS Enterprise.
// 2. API key authentication: Get a long-lived access token that gives your application access to // ArcGIS location services. Go to the tutorial at https://links.esri.com/create-an-api-key. // Copy the API Key access token.
const QString accessToken = QString("");
if (accessToken.isEmpty()) { qWarning() << "Use of ArcGIS location services, such as the basemap styles service, requires" << "you to authenticate with an ArcGIS account or set the API Key property."; } else { Esri::ArcGISRuntime::ArcGISRuntimeEnvironment::setApiKey(accessToken); }
// Initialize the sample Web_Tiled_Layer::init();
// Initialize application view QQuickView view; view.setResizeMode(QQuickView::SizeRootObjectToView);
// Add the import Path view.engine()->addImportPath(QDir(QCoreApplication::applicationDirPath()).filePath("qml"));
QString arcGISRuntimeImportPath = QUOTE(ARCGIS_RUNTIME_IMPORT_PATH);
#if defined(LINUX_PLATFORM_REPLACEMENT) // on some linux platforms the string 'linux' is replaced with 1 // fix the replacement paths which were created QString replaceString = QUOTE(LINUX_PLATFORM_REPLACEMENT); arcGISRuntimeImportPath = arcGISRuntimeImportPath.replace(replaceString, "linux", Qt::CaseSensitive); #endif
// Add the Runtime and Extras path view.engine()->addImportPath(arcGISRuntimeImportPath);
// Set the source view.setSource(QUrl("qrc:/Samples/Layers/Web_Tiled_Layer/Web_Tiled_Layer.qml"));
view.show();
return app.exec();}