You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
90 lines
3.0 KiB
90 lines
3.0 KiB
7 months ago
|
/* eslint-disable no-unused-vars */
|
||
|
// Credits to https://gist.github.com/rclark/6908938
|
||
|
import L from 'leaflet'
|
||
|
import 'leaflet.vectorgrid'
|
||
|
// import { getParamString } from 'leaflet/src/core/Util'
|
||
|
import { toBounds } from 'leaflet/src/geometry/Bounds'
|
||
|
// import { TileLayer } from 'leaflet/src/layer/tile/TileLayer'
|
||
|
import Pbf from 'pbf'
|
||
|
import { VectorTile } from 'vector-tile'
|
||
|
|
||
|
L.VectorGrid.VectorPoi = L.VectorGrid.Protobuf.extend({
|
||
|
_getVectorTilePromise: function (coords) {
|
||
|
var data = {
|
||
|
s: this._getSubdomain(coords),
|
||
|
x: coords.x,
|
||
|
y: coords.y,
|
||
|
z: coords.z
|
||
|
// z: this._getZoomForUrl() /// TODO: Maybe replicate TileLayer's maxNativeZoom
|
||
|
}
|
||
|
if (this._map && !this._map.options.crs.infinite) {
|
||
|
var invertedY = this._globalTileRange.max.y - coords.y
|
||
|
if (this.options.tms) {
|
||
|
// Should this option be available in Leaflet.VectorGrid?
|
||
|
data['y'] = invertedY
|
||
|
}
|
||
|
data['-y'] = invertedY
|
||
|
}
|
||
|
|
||
|
var tileBounds = this._tileCoordsToNwSe(coords),
|
||
|
// crs = this._crs,
|
||
|
crs = this._map.options.crs,
|
||
|
bounds = toBounds(crs.project(tileBounds[0]), crs.project(tileBounds[1])),
|
||
|
min = bounds.min,
|
||
|
max = bounds.max,
|
||
|
bbox = (this._wmsVersion >= 1.3 && this._crs === EPSG4326 ? [min.y, min.x, max.y, max.x] : [min.x, min.y, max.x, max.y]).join(',')
|
||
|
// url = TileLayer.prototype.getTileUrl.call(this, coords)
|
||
|
|
||
|
var tileUrl = this._url + '&bbox=' + bbox
|
||
|
// var tileUrl = L.Util.template(this._url, L.extend(data, this.options))
|
||
|
return fetch(tileUrl, this.options.fetchOptions)
|
||
|
.then(function (response) {
|
||
|
if (!response.ok) {
|
||
|
return { layers: [] }
|
||
|
}
|
||
|
|
||
|
return response.blob().then(function (blob) {
|
||
|
// console.log(blob);
|
||
|
|
||
|
var reader = new FileReader()
|
||
|
return new Promise(function (resolve) {
|
||
|
reader.addEventListener('loadend', function () {
|
||
|
// reader.result contains the contents of blob as a typed array
|
||
|
|
||
|
// blob.type === 'application/x-protobuf'
|
||
|
var pbf = new Pbf(reader.result)
|
||
|
console.log(pbf)
|
||
|
return resolve(new VectorTile(pbf))
|
||
|
})
|
||
|
reader.readAsArrayBuffer(blob)
|
||
|
})
|
||
|
})
|
||
|
})
|
||
|
.then(function (json) {
|
||
|
// console.log('Vector tile:', json.layers)
|
||
|
// console.log('Vector tile water:', json.layers.water); // Instance of VectorTileLayer
|
||
|
|
||
|
// Normalize feature getters into actual instanced features
|
||
|
for (var layerName in json.layers) {
|
||
|
var feats = []
|
||
|
|
||
|
for (var i = 0; i < json.layers[layerName].length; i++) {
|
||
|
var feat = json.layers[layerName].feature(i)
|
||
|
feat.geometry = feat.loadGeometry()
|
||
|
feat.latlng = feat.loadGeometry()
|
||
|
console.log(feat)
|
||
|
feats.push(feat)
|
||
|
}
|
||
|
|
||
|
json.layers[layerName].features = feats
|
||
|
}
|
||
|
|
||
|
return json
|
||
|
})
|
||
|
}
|
||
|
})
|
||
|
|
||
|
L.vectorGrid.vectorpoi = function (url, options) {
|
||
|
return new L.VectorGrid.VectorPoi(url, options)
|
||
|
}
|