Module: ol/source/VectorTile

ol/source/VectorTile


Classes

VectorTile

Type Definitions

Options{Object}

Properties:
Name Type Description
attributions AttributionLike | undefined

Attributions.

attributionsCollapsible boolean
(defaults to true)

Attributions are collapsible.

cacheSize number | undefined

Initial tile cache size. Will auto-grow to hold at least twice the number of tiles in the viewport.

extent Extent | undefined

Extent.

format FeatureFormat<FeatureType> | undefined

Feature format for tiles. Used and required by the default.

overlaps boolean
(defaults to true)

This source may have overlapping geometries. Setting this to false (e.g. for sources with polygons that represent administrative boundaries or TopoJSON sources) allows the renderer to optimise fill and stroke operations.

projection ProjectionLike
(defaults to 'EPSG:3857')

Projection of the tile grid.

state State | undefined

Source state.

tileClass Class<VectorTile> | undefined

Class used to instantiate tiles. Default is VectorTile.

maxZoom number
(defaults to 22)

Optional max zoom level. Not used if tileGrid is provided.

minZoom number | undefined

Optional min zoom level. Not used if tileGrid is provided.

tileSize number | Size
(defaults to 512)

Optional tile size. Not used if tileGrid is provided.

maxResolution number | undefined

Optional tile grid resolution at level zero. Not used if tileGrid is provided.

tileGrid TileGrid | undefined

Tile grid.

tileLoadFunction LoadFunction | undefined

Optional function to load a tile given a URL. Could look like this for pbf tiles:

function(tile, url) {
  tile.setLoader(function(extent, resolution, projection) {
    fetch(url).then(function(response) {
      response.arrayBuffer().then(function(data) {
        const format = tile.getFormat() // ol/format/MVT configured as source format
        const features = format.readFeatures(data, {
          extent: extent,
          featureProjection: projection
        });
        tile.setFeatures(features);
      });
    });
  });
}

If you do not need extent, resolution and projection to get the features for a tile (e.g. for GeoJSON tiles), your tileLoadFunction does not need a setLoader() call. Only make sure to call setFeatures() on the tile:

const format = new GeoJSON({featureProjection: map.getView().getProjection()});
async function tileLoadFunction(tile, url) {
  const response = await fetch(url);
  const data = await response.json();
  tile.setFeatures(format.readFeatures(data));
}
tileUrlFunction UrlFunction | undefined

Optional function to get tile URL given a tile coordinate and the projection.

url string | undefined

URL template. Must include {x}, {y} or {-y}, and {z} placeholders. A {?-?} template pattern, for example subdomain{a-f}.domain.com, may be used instead of defining each one separately in the urls option.

transition number | undefined

A duration for tile opacity transitions in milliseconds. A duration of 0 disables the opacity transition.

urls Array.<string> | undefined

An array of URL templates.

wrapX boolean
(defaults to true)

Whether to wrap the world horizontally. When set to false, only one world will be rendered. When set to true, tiles will be wrapped horizontally to render multiple worlds.

zDirection number | NearestDirectionFunction
(defaults to 1)

Choose whether to use tiles with a higher or lower zoom level when between integer zoom levels. See getZForResolution.