Merge pull request #1283 from umap-project/datalayer-onload-zoomend

Fix datalayers being shown on zoom even if displayOnLoad is false
This commit is contained in:
Yohan Boniface 2023-08-24 21:48:50 +02:00 committed by GitHub
commit 3815e63b9c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 91 additions and 1 deletions

View file

@ -263,7 +263,10 @@ L.U.DataLayer = L.Evented.extend({
this.onceLoaded(function () { this.onceLoaded(function () {
this.map.on('moveend', this.onMoveEnd, this) this.map.on('moveend', this.onMoveEnd, this)
}) })
this.map.on('zoomend', this.onZoomEnd, this) // Only layers that are displayed on load must be hidden/shown
// Automatically, others will be shown manually, and thus will
// be in the "forced visibility" mode
if (this.displayedOnLoad()) this.map.on('zoomend', this.onZoomEnd, this)
}, },
onMoveEnd: function (e) { onMoveEnd: function (e) {

View file

@ -403,6 +403,41 @@ describe('L.U.DataLayer', function () {
assert.ok(qs('path[fill="DarkGoldenRod"]')) assert.ok(qs('path[fill="DarkGoldenRod"]'))
}) })
}) })
describe("#displayOnLoad", function () {
beforeEach(function () {
this.server.respondWith(
/\/datalayer\/64\/\?.*/,
JSON.stringify(RESPONSES.datalayer64_GET)
)
this.datalayer = this.map.createDataLayer(RESPONSES.datalayer64_GET._umap_options)
// Force fetching the data, so to deal here with fake server
this.datalayer.fetchData()
this.server.respond()
this.map.setZoom(10, {animate: false})
});
afterEach(function () {
this.datalayer._delete()
})
it("should not display layer at load", function () {
assert.notOk(qs('path[fill="AliceBlue"]'))
})
it("should display on click", function () {
happen.click(qs(`[data-id='${L.stamp(this.datalayer)}'] .layer-toggle`))
assert.ok(qs('path[fill="AliceBlue"]'))
})
it("should not display on zoom", function () {
this.map.setZoom(9, {animate: false})
assert.notOk(qs('path[fill="AliceBlue"]'))
})
})
describe('#facet-search()', function () { describe('#facet-search()', function () {
before(function () { before(function () {
this.server.respondWith( this.server.respondWith(

View file

@ -314,6 +314,58 @@ var RESPONSES = {
}, },
], ],
}, },
// This one is not shown at load
datalayer64_GET: {
crs: null,
type: 'FeatureCollection',
_umap_options: defaultDatalayerData({name: 'hidden', id: 64, displayOnLoad: false }),
features: [
{
geometry: {
type: 'Polygon',
coordinates: [
[
[5.545478, 45.068383],
[5.545907, 45.067277],
[5.548439, 45.067565],
[5.552516, 45.06752],
[5.553288, 45.068217],
[5.549405, 45.069247],
[5.548224, 45.071005],
[5.545907, 45.071096],
[5.545478, 45.068383],
],
],
},
type: 'Feature',
id: 76,
properties: { name: 'not shown at load 1' },
},
{
type: 'Feature',
properties: {
_umap_options: {
color: 'AliceBlue',
},
name: 'not shown at load 2',
},
geometry: {
type: 'Polygon',
coordinates: [
[
[5.550542, 45.071717],
[5.548182, 45.071051],
[5.549426, 45.069232],
[5.553331, 45.068171],
[5.554812, 45.070869],
[5.553396, 45.072384],
[5.550542, 45.071717],
],
],
},
},
],
},
} }
sinon.fakeServer.flush = function () { sinon.fakeServer.flush = function () {