Skip To Content ArcGIS for Developers Sign In Dashboard

ArcGIS Runtime SDK for Qt

Vector tiled layer (URL)

Sample Viewer View Sample on GitHub

Load an ArcGIS Vector Tiled Layer from a URL.

Use case

Vector tile basemaps can be created in ArcGIS Pro and published as offline packages or online services. ArcGISVectorTiledLayer has many advantages over traditional raster based basemaps (ArcGISTiledLayer), including smooth scaling between different screen DPIs, smaller package sizes, and the ability to rotate symbols and labels dynamically.

How to use the sample

Use the drop down menu to load different vector tile basemaps.

How it works

  1. An ArcGISVectorTiledLayer is constructed with an ArcGIS Online service URL
  2. The layer instance is added to the Map

Relevant API

  • ArcGISVectorTiledLayer
  • Basemap

Tags

tiles, vector, vector basemap, vector tiled layer, vector tiles

Sample Code

import QtQuick 2.6
import QtQuick.Controls 2.2
import Esri.Samples 1.0

VectorTiledLayerUrlSample {
    id: vectorTiledLayerUrlSample
    width: 800
    height: 600    

    // add a mapView component
    MapView {
        id: mapView
        anchors.fill: parent
        objectName: "mapView"
    }

    ComboBox {
        id: comboBoxBasemap
        anchors {
            left: parent.left
            top: parent.top
            margins: 15
        }
        property int modelWidth: 0
        width: modelWidth + leftPadding + rightPadding + indicator.width
        model: ["Mid-Century","Colored Pencil","Newspaper","Nova","World Street Map (Night)"]
        onCurrentTextChanged: {
            // Call C++ invokable function to switch the basemaps
            vectorTiledLayerUrlSample.changeBasemap(currentText);
        }

        Component.onCompleted : {
            for (let i = 0; i < model.length; ++i) {
                metrics.text = model[i];
                modelWidth = Math.max(modelWidth, metrics.width);
            }
        }
        TextMetrics {
            id: metrics
            font: comboBoxBasemap.font
        }
    }
}
#ifdef PCH_BUILD
#include "pch.hpp"
#endif // PCH_BUILD

#include "VectorTiledLayerUrl.h"

#include <QUrl>

#include "Map.h"
#include "MapQuickView.h"
#include "Basemap.h"
#include "ArcGISVectorTiledLayer.h"
#include "Point.h"
#include "Viewpoint.h"

using namespace Esri::ArcGISRuntime;

VectorTiledLayerUrl::VectorTiledLayerUrl(QQuickItem* parent) :
  QQuickItem(parent)
{
}

VectorTiledLayerUrl::~VectorTiledLayerUrl() = default;

void VectorTiledLayerUrl::init()
{
  qmlRegisterType<MapQuickView>("Esri.Samples", 1, 0, "MapView");
  qmlRegisterType<VectorTiledLayerUrl>("Esri.Samples", 1, 0, "VectorTiledLayerUrlSample");
}

void VectorTiledLayerUrl::componentComplete()
{
  QQuickItem::componentComplete();

  // find QML MapView component
  m_mapView = findChild<MapQuickView*>("mapView");

  //! [display vector tiled layer]
  // create a vector tiled basemap
  ArcGISVectorTiledLayer* vectorTiledLayer = new ArcGISVectorTiledLayer(QUrl("https://www.arcgis.com/home/item.html?id=7675d44bb1e4428aa2c30a9b68f97822"), this);
  Basemap* basemap = new Basemap(vectorTiledLayer, this);
  // create a new map instance
  m_map = new Map(basemap, this);
  //! [display vector tiled layer]

  // set viewpoint
  Point ptLocation(-80.18, 25.778135, SpatialReference(4236));
  m_map->setInitialViewpoint(Viewpoint(ptLocation, 150000));
  // set map on the map view
  m_mapView->setMap(m_map);
}

void VectorTiledLayerUrl::changeBasemap(const QString& basemap)
{
  if (m_map && m_map->loadStatus() == LoadStatus::Loaded)
  {
    ArcGISVectorTiledLayer* vectorTiledLayer = nullptr;
    if (basemap == "Mid-Century")
      vectorTiledLayer = new ArcGISVectorTiledLayer(QUrl("https://www.arcgis.com/home/item.html?id=7675d44bb1e4428aa2c30a9b68f97822"), this);
    else if (basemap == "Colored Pencil")
      vectorTiledLayer = new ArcGISVectorTiledLayer(QUrl("https://www.arcgis.com/home/item.html?id=4cf7e1fb9f254dcda9c8fbadb15cf0f8"), this);
    else if (basemap == "Newspaper")
      vectorTiledLayer = new ArcGISVectorTiledLayer(QUrl("https://www.arcgis.com/home/item.html?id=dfb04de5f3144a80bc3f9f336228d24a"), this);
    else if (basemap == "Nova")
      vectorTiledLayer = new ArcGISVectorTiledLayer(QUrl("https://www.arcgis.com/home/item.html?id=75f4dfdff19e445395653121a95a85db"), this);
    else if (basemap == "World Street Map (Night)")
      vectorTiledLayer = new ArcGISVectorTiledLayer(QUrl("https://www.arcgis.com/home/item.html?id=86f556a2d1fd468181855a35e344567f"), this);
    else
      vectorTiledLayer = new ArcGISVectorTiledLayer(QUrl("https://www.arcgis.com/home/item.html?id=7675d44bb1e4428aa2c30a9b68f97822"), this);
    Basemap* basemap = new Basemap(vectorTiledLayer, this);
    m_map->setBasemap(basemap);
  }
}
#ifndef VECTOR_TILED_LAYER_URL
#define VECTOR_TILED_LAYER_URL

namespace Esri
{
  namespace ArcGISRuntime
  {
    class Map;
    class MapQuickView;
  }
}

#include <QQuickItem>

class VectorTiledLayerUrl : public QQuickItem
{
  Q_OBJECT

public:
  explicit VectorTiledLayerUrl(QQuickItem* parent = nullptr);
  ~VectorTiledLayerUrl() override;

  void componentComplete() override;
  static void init();
  Q_INVOKABLE void changeBasemap(const QString& basemap);

private:
  Esri::ArcGISRuntime::Map* m_map = nullptr;
  Esri::ArcGISRuntime::MapQuickView* m_mapView = nullptr;
};

#endif // VECTOR_TILED_LAYER_URL