update README

This commit is contained in:
Brandon Liu
2022-02-19 13:55:25 +08:00
parent 914999dd3d
commit fa79046d0c
2 changed files with 40 additions and 22 deletions

View File

@@ -19,6 +19,10 @@ See also:
## How To Use ## How To Use
### JavaScript
See [js/README.md](js/README.md) for usage in Leaflet or MapLibre GL JS.
### Go ### Go
See https://github.com/protomaps/go-pmtiles See https://github.com/protomaps/go-pmtiles
@@ -33,28 +37,6 @@ See https://github.com/protomaps/go-pmtiles
See https://github.com/protomaps/PMTiles/tree/master/python/bin for library usage See https://github.com/protomaps/PMTiles/tree/master/python/bin for library usage
### JavaScript
<script src="https://unpkg.com/pmtiles@1.0.0/dist/index.js"></script>
Example of a raster PMTiles archive displayed in Leaflet:
const p = new pmtiles.PMTiles('example.pmtiles')
pmtiles.leafletLayer(p,{attribution:'© <a href="https://openstreetmap.org">OpenStreetMap</a> contributors'}).addTo(map)
Example of a vector PMTiles archive displayed in MapLibre GL JS:
let cache = new pmtiles.ProtocolCache();
maplibregl.addProtocol("pmtiles",cache.protocol);
var style = {
"version": 8,
"sources": {
"example_source": {
"type": "vector",
"tiles": ["pmtiles://example.pmtiles/{z}/{x}/{y}"],
...
## Specification ## Specification
![layout](layout.png) ![layout](layout.png)

36
js/README.md Normal file
View File

@@ -0,0 +1,36 @@
# PMTiles
```js
<script src="https://unpkg.com/pmtiles@1.0.2/dist/index.js"></script>
```
## Leaflet
### Raster tileset
Example of a raster PMTiles archive displayed in Leaflet:
```js
const p = new pmtiles.PMTiles('example.pmtiles')
pmtiles.leafletLayer(p,{attribution:'© <a href="https://openstreetmap.org">OpenStreetMap</a> contributors'}).addTo(map)
````
### Vector tileset
See [protomaps.js](https://github.com/protomaps/protomaps.js)
## MapLibre GL JS
Example of a vector PMTiles archive displayed in MapLibre GL JS:
```js
let cache = new pmtiles.ProtocolCache();
maplibregl.addProtocol("pmtiles",cache.protocol);
var style = {
"version": 8,
"sources": {
"example_source": {
"type": "vector",
"tiles": ["pmtiles://example.pmtiles/{z}/{x}/{y}"],
...
```