mirrors/PMTiles
1
0
Fork 0
mirror of https://github.com/protomaps/PMTiles.git synced 2026-02-04 02:41:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

JS v3.0.0 (#346)

Browse Source
This commit is contained in:
Brandon Liu
2024-02-02 17:54:46 +08:00
committed by GitHub
parent 7cc025c776
commit 067347cebb
6 changed files with 18 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
js/README.md
View File

@@ -4,21 +4,24 @@ the [PMTiles](https://www.npmjs.com/package/pmtiles) package can be included via
```html
<script src="https://unpkg.com/pmtiles@2.5.0/dist/index.js"></script>
```
```
As an ES6 module: `npm add pmtiles`
All the PMTiles exports are available under the global `pmtiles` variable e.g. `pmtiles.PMTiles`.
```js
import * as pmtiles from "pmtiles";
```
As an ES6 module: `npm add pmtiles`
```js
import { PMTiles } from "pmtiles";
```
### Leaflet: Raster tileset
Example of a raster PMTiles archive displayed in Leaflet:
```js
const p = new pmtiles.PMTiles('example.pmtiles')
pmtiles.leafletRasterLayer(p,{attribution:'© <a href="https://openstreetmap.org">OpenStreetMap</a>'}).addTo(map)
import { PMTiles, leafletRasterLayer } from "pmtiles";
const p = new PMTiles('example.pmtiles')
leafletRasterLayer(p,{attribution:'© <a href="https://openstreetmap.org">OpenStreetMap</a>'}).addTo(map)
````
[Live example](https://protomaps.github.io/PMTiles/examples/leaflet.html) | [Code](https://github.com/protomaps/PMTiles/blob/main/js/examples/leaflet.html)
@@ -32,7 +35,8 @@ See [protomaps-leaflet](https://github.com/protomaps/protomaps-leaflet)
Example of a PMTiles archive displayed in MapLibre GL JS:
```js
let protocol = new pmtiles.Protocol();
import { Protocol } from "pmtiles";
let protocol = new Protocol();
maplibregl.addProtocol("pmtiles",protocol.tile);
var style = {
"version": 8,

2
js/examples/leaflet.html
View File

@@ -4,7 +4,7 @@
<meta charset="utf-8"/>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.9.0/dist/leaflet.js"></script>
<script src="https://unpkg.com/pmtiles@3.0.0-alpha.2/dist/index.js"></script>
<script src="https://unpkg.com/pmtiles@3.0.0/dist/index.js"></script>
<style>
body, #map {
height:100vh;

2
js/examples/maplibre.html
View File

@@ -4,7 +4,7 @@
<meta charset="utf-8"/>
<link rel="stylesheet" href="https://unpkg.com/maplibre-gl@3.3.1/dist/maplibre-gl.css" crossorigin="anonymous">
<script src="https://unpkg.com/maplibre-gl@3.3.1/dist/maplibre-gl.js" crossorigin="anonymous"></script>
<script src="https://unpkg.com/pmtiles@3.0.0-alpha.2/dist/index.js"></script>
<script src="https://unpkg.com/pmtiles@3.0.0/dist/index.js"></script>
<style>
body {
margin: 0;

2
js/examples/maplibre_raster_dem.html
View File

@@ -4,7 +4,7 @@
<meta charset="utf-8"/>
<link rel="stylesheet" href="https://unpkg.com/maplibre-gl@3.3.1/dist/maplibre-gl.css" crossorigin="anonymous">
<script src="https://unpkg.com/maplibre-gl@3.3.1/dist/maplibre-gl.js" crossorigin="anonymous"></script>
<script src="https://unpkg.com/pmtiles@3.0.0-alpha.2/dist/index.js"></script>
<script src="https://unpkg.com/pmtiles@3.0.0/dist/index.js"></script>
<style>
body {
margin: 0;

4
js/package-lock.json generated
View File

@@ -1,12 +1,12 @@
{
"name": "pmtiles",
"version": "3.0.0-alpha.2",
"version": "3.0.0",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "pmtiles",
"version": "3.0.0-alpha.2",
"version": "3.0.0",
"license": "BSD-3-Clause",
"dependencies": {
"@types/leaflet": "^1.9.8",

2
js/package.json
View File

@@ -1,6 +1,6 @@
{
"name": "pmtiles",
"version": "3.0.0-alpha.2",
"version": "3.0.0",
"description": "PMTiles archive decoder for browsers",
"type": "module",
"exports": "./dist/index.mjs",