ol-tilecache
v7.0.0
Published
OpenLayers tile url function to load tile seeded with TileCache url scheme
Downloads
5,167
Maintainers
Readme
TileCache url function for OpenLayers
Allows create custom ol.TileUrlFunctionType
to load tiles
seeded with TileCache.
Installation
Install it with NPM (recommended):
# ES6 version for bundling with Webpack, Rollup and etc.
npm install ol ol-tilecache
// Use as ES2015 module (based on NPM package `ol`)
import Map from 'ol/Map'
...
import * as TileCacheUrlFn from 'ol-tilecache'
// or only what you need
import { createTileUrlFunction } from 'ol-tilecache'
Or add from CDN:
<script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.0.0/build/ol.js"></script>
<script src="https://unpkg.com/ol-tilecache@latest/dist/ol-tilecache.umd.js"></script>
<script>
// plugin exports global variable TileCacheUrlFn
// in addition it also exported to `ol.tileCacheUrlFn` field (for backward compatibility).
</script>
Usage
Usage same as standard OpenLayers tile url functions.
Members
createTileUrlFunction
Arguments
url : string
URL templatetileGrid : ol.tilegrid.TileGrid
Custom tile grid. Default is EPSG:3857 x/y/z grid
Returns: ol.TileUrlFunctionType
Available URL placeholders:
z | 0z - zoom level (simple number or padded with zero)
x1, x2, x3 - X axis index parts (remnant from dividing the tile X index on 10^9 broken down by 3 digits)
y1, y2, y3 - Y axis index parts (remnant from dividing the tile Y index on 10^9 broken down by 3 digits)
-y1, -y2, -y3 - inverted Y axis index parts (remnant from dividing the tile Y index on 10^9 broken down by 3 digits)
Example usage:
import Map from 'ol/Map'
import View from 'ol/View'
import TileLayer from 'ol/layer/Tile'
import XyzSource from 'ol/source/XYZ'
import { createTileUrlFunction } from 'ol-tilecache'
const map = new Map({
target: 'map',
view: new View({
projection: 'EPSG:3857',
center: [ 4189972.14, 7507950.67 ],
zoom: 5
}),
layers: [
new TileLayer({
source: new XyzSource({
tileUrlFunction: createTileUrlFunction('http://{a-z}.tiles.org/{0z}/{x1}/{x2}/{x3}/{-y1}/{-y2}/{-y3}.png')
})
})
]
})
Build
git clone https://github.com/ghettovoice/ol-tilecache.git
npm install
# build
npm run build
# run test app
npm start
# run unit tests
npm test
License
MIT (c) 2016-2020, Vladimir Vershinin