112 lines
5.1 KiB
JavaScript
112 lines
5.1 KiB
JavaScript
/**
|
|
* @module ol/source/XYZ
|
|
*/
|
|
|
|
import TileImage from './TileImage.js';
|
|
import {createXYZ, extentFromProjection} from '../tilegrid.js';
|
|
|
|
/**
|
|
* @typedef {Object} Options
|
|
* @property {import("./Source.js").AttributionLike} [attributions] Attributions.
|
|
* @property {boolean} [attributionsCollapsible=true] Attributions are collapsible.
|
|
* @property {number} [cacheSize] Initial tile cache size. Will auto-grow to hold at least the number of tiles in the viewport.
|
|
* @property {null|string} [crossOrigin] The `crossOrigin` attribute for loaded images. Note that
|
|
* you must provide a `crossOrigin` value if you want to access pixel data with the Canvas renderer.
|
|
* See https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image for more detail.
|
|
* @property {boolean} [imageSmoothing=true] Enable image smoothing.
|
|
* @property {boolean} [opaque=false] Whether the layer is opaque.
|
|
* @property {import("../proj.js").ProjectionLike} [projection='EPSG:3857'] Projection.
|
|
* @property {number} [reprojectionErrorThreshold=0.5] Maximum allowed reprojection error (in pixels).
|
|
* Higher values can increase reprojection performance, but decrease precision.
|
|
* @property {number} [maxZoom=42] Optional max zoom level. Not used if `tileGrid` is provided.
|
|
* @property {number} [minZoom=0] Optional min zoom level. Not used if `tileGrid` is provided.
|
|
* @property {number} [maxResolution] Optional tile grid resolution at level zero. Not used if `tileGrid` is provided.
|
|
* @property {import("../tilegrid/TileGrid.js").default} [tileGrid] Tile grid.
|
|
* @property {import("../Tile.js").LoadFunction} [tileLoadFunction] Optional function to load a tile given a URL. The default is
|
|
* ```js
|
|
* function(imageTile, src) {
|
|
* imageTile.getImage().src = src;
|
|
* };
|
|
* ```
|
|
* @property {number} [tilePixelRatio=1] The pixel ratio used by the tile service.
|
|
* For example, if the tile service advertizes 256px by 256px tiles but actually sends 512px
|
|
* by 512px images (for retina/hidpi devices) then `tilePixelRatio`
|
|
* should be set to `2`.
|
|
* @property {number|import("../size.js").Size} [tileSize=[256, 256]] The tile size used by the tile service.
|
|
* Not used if `tileGrid` is provided.
|
|
* @property {import("../Tile.js").UrlFunction} [tileUrlFunction] Optional function to get
|
|
* tile URL given a tile coordinate and the projection.
|
|
* Required if `url` or `urls` are not provided.
|
|
* @property {string} [url] 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.
|
|
* @property {Array<string>} [urls] An array of URL templates.
|
|
* @property {boolean} [wrapX=true] Whether to wrap the world horizontally.
|
|
* @property {number} [transition=250] Duration of the opacity transition for rendering.
|
|
* To disable the opacity transition, pass `transition: 0`.
|
|
* @property {number|import("../array.js").NearestDirectionFunction} [zDirection=0]
|
|
* Choose whether to use tiles with a higher or lower zoom level when between integer
|
|
* zoom levels. See {@link module:ol/tilegrid/TileGrid~TileGrid#getZForResolution}.
|
|
*/
|
|
|
|
/**
|
|
* @classdesc
|
|
* Layer source for tile data with URLs in a set XYZ format that are
|
|
* defined in a URL template. By default, this follows the widely-used
|
|
* Google grid where `x` 0 and `y` 0 are in the top left. Grids like
|
|
* TMS where `x` 0 and `y` 0 are in the bottom left can be used by
|
|
* using the `{-y}` placeholder in the URL template, so long as the
|
|
* source does not have a custom tile grid. In this case
|
|
* a `tileUrlFunction` can be used, such as:
|
|
* ```js
|
|
* tileUrlFunction: function(coordinate) {
|
|
* return 'http://mapserver.com/' + coordinate[0] + '/' +
|
|
* coordinate[1] + '/' + (-coordinate[2] - 1) + '.png';
|
|
* }
|
|
* ```
|
|
* @api
|
|
*/
|
|
class XYZ extends TileImage {
|
|
/**
|
|
* @param {Options} [opt_options] XYZ options.
|
|
*/
|
|
constructor(opt_options) {
|
|
const options = opt_options || {};
|
|
const projection =
|
|
options.projection !== undefined ? options.projection : 'EPSG:3857';
|
|
|
|
const tileGrid =
|
|
options.tileGrid !== undefined
|
|
? options.tileGrid
|
|
: createXYZ({
|
|
extent: extentFromProjection(projection),
|
|
maxResolution: options.maxResolution,
|
|
maxZoom: options.maxZoom,
|
|
minZoom: options.minZoom,
|
|
tileSize: options.tileSize,
|
|
});
|
|
|
|
super({
|
|
attributions: options.attributions,
|
|
cacheSize: options.cacheSize,
|
|
crossOrigin: options.crossOrigin,
|
|
imageSmoothing: options.imageSmoothing,
|
|
opaque: options.opaque,
|
|
projection: projection,
|
|
reprojectionErrorThreshold: options.reprojectionErrorThreshold,
|
|
tileGrid: tileGrid,
|
|
tileLoadFunction: options.tileLoadFunction,
|
|
tilePixelRatio: options.tilePixelRatio,
|
|
tileUrlFunction: options.tileUrlFunction,
|
|
url: options.url,
|
|
urls: options.urls,
|
|
wrapX: options.wrapX !== undefined ? options.wrapX : true,
|
|
transition: options.transition,
|
|
attributionsCollapsible: options.attributionsCollapsible,
|
|
zDirection: options.zDirection,
|
|
});
|
|
}
|
|
}
|
|
|
|
export default XYZ;
|