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

implement fetch abort for leaflet image layer [#1]

Browse Source
This commit is contained in:
Brandon Liu
2021-06-08 17:45:59 +08:00
parent 959d573eb6
commit 150a2561c2
1 changed files with 13 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
js/index.src.mjs
View File

@@ -147,17 +147,24 @@ export class PMTiles {
var cls = L.GridLayer.extend({
createTile: function(coord, done){
var tile = document.createElement('img')
var error
self.getZxy(coord.z,coord.x,coord.y).then(result => {
if (result === null) return
fetch(self.url,{headers:{Range:'bytes=' + result[0] + '-' + (result[0]+result[1]-1)}}).then(resp => {
const controller = new AbortController()
const signal = controller.signal
tile.cancel = () => { controller.abort() }
fetch(self.url,{signal:signal,headers:{Range:'bytes=' + result[0] + '-' + (result[0]+result[1]-1)}}).then(resp => {
return resp.arrayBuffer()
}).then(buf => {
var blob = new Blob( [buf], { type: "image/png" } )
var imageUrl = window.URL.createObjectURL(blob)
tile.src = imageUrl
done(error,tile)
tile.cancel = null
done(null,tile)
}).catch(error => {
if (error.name !== "AbortError") throw error
})
})
return tile
@@ -166,6 +173,9 @@ export class PMTiles {
_removeTile: function (key) {
var tile = this._tiles[key]
if (!tile) { return }
if (tile.el.cancel) tile.el.cancel()
tile.el.width = 0
tile.el.height = 0
tile.el.deleted = true