Skip to content

Commit 3d13358

Browse files
authored
redraw layer when layer.optitons attribute changes and add TileLayer.forceReload method (#1894)
* redraw layer when layer.optitons attribute changes * fix * fix map not render centercross when layers is empty * npm package files includes src * fix * update spec * update spec * update * fix spec * Layer support refresh * fix tilesize cache * comment for layer options change hook * update * tilelayer rename refresh to forceReload * update commonent
1 parent 47caeee commit 3d13358

File tree

9 files changed

+83
-21
lines changed

9 files changed

+83
-21
lines changed

.npmignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,3 +7,4 @@
77
!dist/maptalks.css
88
!dist/images/**/*
99
!ACKNOWLEDGEMENT
10+
!src

src/layer/Layer.js

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import Class from '../core/Class';
2-
import { isNil, isNumber } from '../core/util';
2+
import { isFunction, isNil, isNumber } from '../core/util';
33
import Eventable from '../core/Eventable';
44
import JSONAble from '../core/JSONAble';
55
import Renderable from '../renderer/Renderable';
@@ -481,9 +481,14 @@ class Layer extends JSONAble(Eventable(Renderable(Class))) {
481481
}
482482

483483
onConfig(conf) {
484-
if (isNumber(conf['opacity']) || conf['cssFilter']) {
484+
const needUpdate = conf && Object.keys && Object.keys(conf).length > 0;
485+
if (needUpdate && isNil(conf['animation'])) {
486+
// options change Hook,subLayers Can realize its own logic,such as tileSize/tileSystem etc change
487+
if (this._optionsHook && isFunction(this._optionsHook)) {
488+
this._optionsHook(conf);
489+
}
485490
const renderer = this.getRenderer();
486-
if (renderer) {
491+
if (renderer && renderer.setToRedraw) {
487492
renderer.setToRedraw();
488493
}
489494
}

src/layer/tile/TileLayer.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -189,6 +189,18 @@ class TileLayer extends Layer {
189189
return new TileLayer(layerJSON['id'], layerJSON['options']);
190190
}
191191

192+
/**
193+
* force Reload tilelayer.
194+
* Note that this method will clear all cached tiles and reload them. It shouldn't be called frequently for performance reason.
195+
196+
* @return {TileLayer} this
197+
*/
198+
forceReload() {
199+
this.clear();
200+
this.load();
201+
return this;
202+
}
203+
192204

193205
/**
194206
* Get tile size of the tile layer

src/layer/tile/WMSTileLayer.js

Lines changed: 27 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Browser from '../../core/Browser';
12
import { extend } from '../../core/util';
23
import TileLayer from './TileLayer';
34

@@ -18,7 +19,7 @@ import TileLayer from './TileLayer';
1819
const options = {
1920
crs: null,
2021
uppercase: false,
21-
detectRetina : false
22+
detectRetina: false
2223
};
2324

2425
const defaultWmsParams = {
@@ -30,6 +31,7 @@ const defaultWmsParams = {
3031
transparent: false,
3132
version: '1.1.1'
3233
};
34+
let wmsExcludeParams;
3335

3436
/**
3537
* @classdesc
@@ -55,19 +57,33 @@ class WMSTileLayer extends TileLayer {
5557

5658
constructor(id, options) {
5759
super(id);
58-
const wmsParams = extend({}, defaultWmsParams);
59-
for (const p in options) {
60-
if (!(p in this.options)) {
61-
wmsParams[p] = options[p];
62-
}
60+
if (!wmsExcludeParams) {
61+
wmsExcludeParams = extend({}, this.options);
6362
}
63+
this.wmsParams = extend({}, defaultWmsParams);
6464
this.setOptions(options);
6565
this.setZIndex(options.zIndex);
66+
if (!Browser.proxy) {
67+
this._optionsHook(options);
68+
}
69+
}
70+
71+
//in Hook,Reset wmsParams
72+
_optionsHook(options = {}) {
73+
for (const p in options) {
74+
//clear tilesize cache
75+
if (p === 'tileSize') {
76+
this._tileSize = null;
77+
}
78+
if (!(p in wmsExcludeParams)) {
79+
this.wmsParams[p] = options[p];
80+
}
81+
}
6682
const tileSize = this.getTileSize();
67-
wmsParams.width = tileSize.width;
68-
wmsParams.height = tileSize.height;
69-
this.wmsParams = wmsParams;
70-
this._wmsVersion = parseFloat(wmsParams.version);
83+
this.wmsParams.width = tileSize.width;
84+
this.wmsParams.height = tileSize.height;
85+
this._wmsVersion = parseFloat(this.wmsParams.version);
86+
return this;
7187
}
7288

7389
onAdd() {
@@ -88,7 +104,7 @@ class WMSTileLayer extends TileLayer {
88104
const max = tileExtent.getMax(),
89105
min = tileExtent.getMin();
90106

91-
const bbox = (this._wmsVersion >= 1.3 && (this.wmsParams.crs === 'EPSG:4326' || this.wmsParams.crs === 'EPSG:4490') ?
107+
const bbox = (this._wmsVersion >= 1.3 && (this.wmsParams.crs === 'EPSG:4326' || this.wmsParams.crs === 'EPSG:4490') ?
92108
[min.y, min.x, max.y, max.x] :
93109
[min.x, min.y, max.x, max.y]).join(',');
94110

src/renderer/map/MapCanvasRenderer.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,7 @@ class MapCanvasRenderer extends MapRenderer {
5959
this._debugSky();
6060
}
6161
}
62+
this._needClear = false;
6263
// this._drawContainerExtent();
6364
// CAUTION: the order to fire frameend and layerload events
6465
// fire frameend before layerload, reason:
@@ -313,7 +314,7 @@ class MapCanvasRenderer extends MapRenderer {
313314
if (!map) {
314315
return false;
315316
}
316-
if (!this.isLayerCanvasUpdated() && !this.isViewChanged()) {
317+
if (!this.isLayerCanvasUpdated() && !this.isViewChanged() && this._needClear === false) {
317318
return false;
318319
}
319320
if (!this.canvas) {
@@ -389,6 +390,8 @@ class MapCanvasRenderer extends MapRenderer {
389390

390391
setToRedraw() {
391392
const layers = this._getAllLayerToRender();
393+
//set maprender for clear canvas
394+
this._needClear = true;
392395
for (let i = 0, l = layers.length; i < l; i++) {
393396
const renderer = layers[i].getRenderer();
394397
if (renderer && renderer.canvas && renderer.setToRedraw) {

test/layer/ImageLayerSpec.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ describe('Layer.ImageLayer', function () {
6969
});
7070
layer.on('layerload', function () {
7171
var parser = new UAParser();
72-
var alpha = 102;
72+
var alpha = 104;
7373
var result = parser.getOS();
7474
console.log(result);
7575
if (result.name) {
@@ -79,12 +79,13 @@ describe('Layer.ImageLayer', function () {
7979
}
8080
var size = map.getSize();
8181
var ctx = layer.getRenderer().canvas.getContext('2d');
82-
var imageData = ctx.getImageData(size.width / 2, size.height / 2, 1, 1);
82+
var imageData = ctx.getImageData(size.width / 2, size.height / 2, 1, 1).data;
8383
console.log(imageData);
8484
if (maptalks.Browser.ie) {
8585
expect(layer).to.be.painted(1, 1, [0, 0, 0, 128]);
8686
} else {
87-
expect(imageData.data).to.be.eql([0, 0, 0, alpha]);
87+
var color = [imageData[0], imageData[1], imageData[2], imageData[3]];
88+
expect(color).to.be.eql([0, 0, 0, alpha]);
8889
}
8990
done();
9091
});

test/layer/MaskSpec.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -240,10 +240,10 @@ describe('Spec of Masks', function () {
240240
new maptalks.Marker(map.getCenter().toArray()).addTo(layer);
241241
var ring = createRing(0.2), hole = createRing(0.1);
242242
var polygon = new maptalks.Polygon([ring, hole]);
243-
map.on('frameend', function () {
243+
map.once('frameend', function () {
244244
expect(layer).to.be.painted(0, 0);
245245
layer.setMask(polygon);
246-
map.on('frameend', function () {
246+
map.once('frameend', function () {
247247
expect(layer).to.be.painted(0, 0);
248248
})
249249
})

test/layer/TileLayerSpec.js

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,18 @@ describe('TileLayer', function () {
150150
},
151151
'attribution' : '&copy; <a target="_blank" href="http://map.baidu.com">Baidu</a>'
152152
}).addTo(map);
153-
expect(layer.getTiles().tileGrids[0].tiles.length).to.be.eql(5);
153+
var parser = new UAParser();
154+
var result = parser.getOS();
155+
var tilesLength=layer.getTiles().tileGrids[0].tiles.length;
156+
if (result.name) {
157+
if (result.name.toLowerCase().indexOf('windows') > -1) {
158+
expect(tilesLength).to.be.eql(4);
159+
}else{
160+
expect(tilesLength).to.be.eql(5);
161+
}
162+
}else{
163+
expect(tilesLength).to.be.eql(5);
164+
}
154165
});
155166
});
156167

test/map/MapSpec.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -895,4 +895,17 @@ describe('Map.Spec', function () {
895895
expect(map.isOffscreen([0, 100, 10, 110])).to.be.ok();
896896
expect(map.isOffscreen([0, -110, 10, -100])).to.be.ok();
897897
});
898+
899+
it('#centercross when map.layers=0', function () {
900+
//clear all layers
901+
map.removeLayer(baseLayer);
902+
map.options.centerCross=true;
903+
map.once('frameend',function(){
904+
expect(map).to.be.painted(0, 0);
905+
map.options.centerCross=false;
906+
map.once('frameend',function(){
907+
expect(map).not.to.be.painted(0, 0);
908+
})
909+
})
910+
});
898911
});

0 commit comments

Comments
 (0)