Skip to content

Commit 9a27cd6

Browse files
luoxiao-supermapluoxiao-supermap
committed
[fix]动画图层显隐问题
1 parent 82baf3d commit 9a27cd6

File tree

5 files changed

+100
-6
lines changed

5 files changed

+100
-6
lines changed

‎src/mapboxgl/overlay/L7Layer.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,9 @@ export class L7Layer {
5252
}
5353

5454
setVisibility(visibility) {
55+
if (this.animateStatus) {
56+
this.scene.layerService.stopAnimate(this.l7layer.id);
57+
}
5558
visibility ? this.l7layer.show() : this.l7layer.hide();
5659
this.map.style.setLayoutProperty(this.id, 'visibility', visibility ? 'visible' : 'none');
5760
}
@@ -84,9 +87,11 @@ export class L7Layer {
8487
if (this.scene && this.scene.getLayer(this.l7layer.id)) {
8588
if (this.l7layer.animateStatus || (this.l7layer.layerModel && this.l7layer.layerModel.spriteAnimate)) {
8689
this.scene.layerService.startAnimate(this.l7layer.id);
90+
this.animateStatus = true;
8791
this.map.triggerRepaint();
8892
} else {
8993
this.scene.layerService.renderLayer(this.l7layer.id);
94+
this.animateStatus = false;
9095
}
9196
}
9297
}

‎src/maplibregl/overlay/L7/l7-render.js

Lines changed: 6 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/maplibregl/overlay/L7Layer.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,9 @@ export class L7Layer {
5353
}
5454

5555
setVisibility(visibility) {
56+
if (this.animateStatus) {
57+
this.scene.layerService.stopAnimate(this.l7layer.id);
58+
}
5659
visibility ? this.l7layer.show() : this.l7layer.hide();
5760
this.map.style.setLayoutProperty(this.id, 'visibility', visibility ? 'visible' : 'none');
5861
}
@@ -85,9 +88,11 @@ export class L7Layer {
8588
if (this.scene && this.scene.getLayer(this.l7layer.id)) {
8689
if (this.l7layer.animateStatus || (this.l7layer.layerModel && this.l7layer.layerModel.spriteAnimate)) {
8790
this.scene.layerService.startAnimate(this.l7layer.id);
91+
this.animateStatus = true;
8892
this.map.triggerRepaint();
8993
} else {
9094
this.scene.layerService.renderLayer(this.l7layer.id);
95+
this.animateStatus = false;
9196
}
9297
}
9398
}

‎test/mapboxgl/overlay/L7LayerSpec.js

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -240,6 +240,46 @@ describe('mapboxgl L7Layer', () => {
240240
});
241241

242242
it('PointLayer setVisibility', (done) => {
243+
var layer = new L7Layer({ type: 'PointLayer' });
244+
var l7Layer = layer.getL7Layer();
245+
l7Layer
246+
.source(data, {
247+
parser: {
248+
type: 'json',
249+
x: 'longitude',
250+
y: 'latitude'
251+
}
252+
})
253+
.shape('circle')
254+
.active(true)
255+
.size(56)
256+
.color('#4cfd47');
257+
map.addLayer(layer);
258+
map.style.fire = () => {};
259+
map.style.setLayoutProperty = () => {};
260+
261+
map.overlayLayersManager = { [layer.id]: layer };
262+
expect(l7Layer).not.toBeNull();
263+
map.setLayoutProperty = setLayoutProperty;
264+
265+
spyOn(l7Layer, 'show');
266+
spyOn(l7Layer, 'hide');
267+
spyOn(map.style, 'setLayoutProperty');
268+
269+
map.setLayoutProperty(layer.id, 'visibility', 'hidden');
270+
expect(l7Layer.hide).toHaveBeenCalled();
271+
expect(map.style.setLayoutProperty).toHaveBeenCalled();
272+
expect(layer.animateStatus).toBeFalsy();
273+
274+
275+
map.setLayoutProperty(layer.id, 'visibility', 'visible');
276+
expect(l7Layer.show).toHaveBeenCalled();
277+
expect(map.style.setLayoutProperty).toHaveBeenCalled();
278+
expect(layer.animateStatus).toBeFalsy();
279+
280+
done();
281+
});
282+
it('PointLayer setVisibility animate', (done) => {
243283
var layer = new L7Layer({ type: 'PointLayer' });
244284
var l7Layer = layer.getL7Layer();
245285
l7Layer
@@ -270,10 +310,12 @@ describe('mapboxgl L7Layer', () => {
270310
map.setLayoutProperty(layer.id, 'visibility', 'hidden');
271311
expect(l7Layer.hide).toHaveBeenCalled();
272312
expect(map.style.setLayoutProperty).toHaveBeenCalled();
313+
expect(layer.animateStatus).toBeTruthy();
273314

274315
map.setLayoutProperty(layer.id, 'visibility', 'visible');
275316
expect(l7Layer.show).toHaveBeenCalled();
276317
expect(map.style.setLayoutProperty).toHaveBeenCalled();
318+
expect(layer.animateStatus).toBeTruthy();
277319

278320
done();
279321
});

‎test/maplibregl/overlay/L7LayerSpec.js

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -235,6 +235,46 @@ describe('maplibregl L7Layer', () => {
235235
});
236236

237237
it('PointLayer setVisibility', (done) => {
238+
var layer = new L7Layer({ type: 'PointLayer' });
239+
var l7Layer = layer.getL7Layer();
240+
l7Layer
241+
.source(data, {
242+
parser: {
243+
type: 'json',
244+
x: 'longitude',
245+
y: 'latitude'
246+
}
247+
})
248+
.shape('circle')
249+
.active(true)
250+
.size(56)
251+
.color('#4cfd47');
252+
map.addLayer(layer);
253+
map.style.fire = () => {};
254+
map.style.setLayoutProperty = () => {};
255+
256+
map.overlayLayersManager = { [layer.id]: layer };
257+
expect(l7Layer).not.toBeNull();
258+
map.setLayoutProperty = setLayoutProperty;
259+
260+
spyOn(l7Layer, 'show');
261+
spyOn(l7Layer, 'hide');
262+
spyOn(map.style, 'setLayoutProperty');
263+
264+
map.setLayoutProperty(layer.id, 'visibility', 'hidden');
265+
expect(l7Layer.hide).toHaveBeenCalled();
266+
expect(map.style.setLayoutProperty).toHaveBeenCalled();
267+
expect(layer.animateStatus).toBeFalsy();
268+
269+
270+
map.setLayoutProperty(layer.id, 'visibility', 'visible');
271+
expect(l7Layer.show).toHaveBeenCalled();
272+
expect(map.style.setLayoutProperty).toHaveBeenCalled();
273+
expect(layer.animateStatus).toBeFalsy();
274+
275+
done();
276+
});
277+
it('PointLayer setVisibility animate', (done) => {
238278
var layer = new L7Layer({ type: 'PointLayer' });
239279
var l7Layer = layer.getL7Layer();
240280
l7Layer
@@ -263,10 +303,12 @@ describe('maplibregl L7Layer', () => {
263303
map.setLayoutProperty(layer.id, 'visibility', 'hidden');
264304
expect(l7Layer.hide).toHaveBeenCalled();
265305
expect(map.style.setLayoutProperty).toHaveBeenCalled();
306+
expect(layer.animateStatus).toBeTruthy();
266307

267308
map.setLayoutProperty(layer.id, 'visibility', 'visible');
268309
expect(l7Layer.show).toHaveBeenCalled();
269310
expect(map.style.setLayoutProperty).toHaveBeenCalled();
311+
expect(layer.animateStatus).toBeTruthy();
270312

271313
done();
272314
});

0 commit comments

Comments
 (0)