mirror of
https://github.com/protomaps/PMTiles.git
synced 2026-02-04 02:41:09 +00:00
c21f968233
Bumps [glob](https://github.com/isaacs/node-glob) from 10.4.5 to 10.5.0. - [Changelog](https://github.com/isaacs/node-glob/blob/main/changelog.md) - [Commits](https://github.com/isaacs/node-glob/compare/v10.4.5...v10.5.0) --- updated-dependencies: - dependency-name: glob dependency-version: 10.5.0 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
PMTiles for Browsers + NodeJS
See the JavaScript API docs
the PMTiles package can be included via script tag or ES6 module:
<script src="https://unpkg.com/pmtiles@<VERSION>/dist/pmtiles.js"></script>
All the PMTiles exports are available under the global pmtiles variable e.g. pmtiles.PMTiles.
As an ES6 module: npm add pmtiles
import { PMTiles } from "pmtiles";
Leaflet: Raster tileset
Example of a raster PMTiles archive displayed in Leaflet:
import { PMTiles, leafletRasterLayer } from "pmtiles";
const p = new PMTiles('example.pmtiles')
leafletRasterLayer(p,{attribution:'© <a href="https://openstreetmap.org">OpenStreetMap</a>'}).addTo(map)
Leaflet: Vector tileset
MapLibre GL JS
Example of a PMTiles archive displayed in MapLibre GL JS:
import { Protocol } from "pmtiles";
let protocol = new Protocol();
maplibregl.addProtocol("pmtiles",protocol.tile);
var style = {
"version": 8,
"sources": {
"example_source": {
"type": "vector",
"url": "pmtiles://https://example.com/example.pmtiles",
"attribution": '© <a href="https://openstreetmap.org">OpenStreetMap</a>'
...
CORS
See the Protomaps Docs on Cloud Storage for uploading and configuring CORS for Cloudflare R2, Amazon S3, Google Cloud Storage and more.