README.md

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 template
• tileGrid : 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