From b727e4f45e3fa4ab41496edc695dbc34053b831d Mon Sep 17 00:00:00 2001 From: mike-000 <49240900+mike-000@users.noreply.github.com> Date: Fri, 4 Oct 2019 22:00:20 +0100 Subject: [PATCH 1/3] Set label text for option styles Set label text for lonLabelStyle and latLabelStyle options --- src/ol/layer/Graticule.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/ol/layer/Graticule.js b/src/ol/layer/Graticule.js index e237ac85c8..ccca2201fe 100644 --- a/src/ol/layer/Graticule.js +++ b/src/ol/layer/Graticule.js @@ -332,9 +332,8 @@ class Graticule extends VectorLayer { const label = feature.get('graticule_label'); if (!this.lonLabelStyleCache_[label]) { this.lonLabelStyleCache_[label] = new Style({ - text: options.lonLabelStyle !== undefined ? options.lonLabelStyle : + text: options.lonLabelStyle !== undefined ? options.lonLabelStyle.clone() : new Text({ - text: label, font: '12px Calibri,sans-serif', textBaseline: 'bottom', fill: new Fill({ @@ -346,6 +345,7 @@ class Graticule extends VectorLayer { }) }) }); + this.lonLabelStyleCache_[label].getText().setText(label); } return this.lonLabelStyleCache_[label]; }.bind(this); @@ -365,9 +365,8 @@ class Graticule extends VectorLayer { const label = feature.get('graticule_label'); if (!this.latLabelStyleCache_[label]) { this.latLabelStyleCache_[label] = new Style({ - text: options.latLabelStyle !== undefined ? options.latLabelStyle : + text: options.latLabelStyle !== undefined ? options.latLabelStyle.clone() : new Text({ - text: label, font: '12px Calibri,sans-serif', textAlign: 'right', fill: new Fill({ @@ -379,6 +378,7 @@ class Graticule extends VectorLayer { }) }) }); + this.latLabelStyleCache_[label].getText().setText(label); } return this.latLabelStyleCache_[label]; }.bind(this); From 7edd10d66f6c76879f265e670c0d4e92957a7ea1 Mon Sep 17 00:00:00 2001 From: mike-000 <49240900+mike-000@users.noreply.github.com> Date: Mon, 21 Oct 2019 16:00:54 +0100 Subject: [PATCH 2/3] Test that label text is set in styles --- test/spec/ol/graticule.test.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/test/spec/ol/graticule.test.js b/test/spec/ol/graticule.test.js index 9fddf760df..e6c78e3f14 100644 --- a/test/spec/ol/graticule.test.js +++ b/test/spec/ol/graticule.test.js @@ -32,6 +32,7 @@ describe('ol.layer.Graticule', function() { }); it('creates a graticule with labels', function() { + const feature = new Feature(); graticule = new Graticule({ showLabels: true }); @@ -51,6 +52,10 @@ describe('ol.layer.Graticule', function() { expect(graticule.parallelsLabels_.length).to.be(3); expect(graticule.parallelsLabels_[0].text).to.be('0° 00′ 00″'); expect(graticule.parallelsLabels_[0].geom.getCoordinates()[1]).to.roughlyEqual(0, 1e-9); + feature.set('graticule_label', graticule.meridiansLabels_[0].text); + expect(graticule.lonLabelStyle_(feature).getText().getText()).to.be('0° 00′ 00″'); + feature.set('graticule_label', graticule.parallelsLabels_[0].text); + expect(graticule.latLabelStyle_(feature).getText().getText()).to.be('0° 00′ 00″'); }); it('has a default stroke style', function() { @@ -105,6 +110,10 @@ describe('ol.layer.Graticule', function() { expect(graticule.parallelsLabels_[0].text).to.be('lat: 0'); expect(graticule.lonLabelStyle_(feature).getText()).to.eql(lonLabelStyle); expect(graticule.latLabelStyle_(feature).getText()).to.eql(latLabelStyle); + feature.set('graticule_label', graticule.meridiansLabels_[0].text); + expect(graticule.lonLabelStyle_(feature).getText().getText()).to.be('lon: 0'); + feature.set('graticule_label', graticule.parallelsLabels_[0].text); + expect(graticule.latLabelStyle_(feature).getText().getText()).to.be('lat: 0'); expect(graticule.lonLabelPosition_).to.be(0.9); expect(graticule.latLabelPosition_).to.be(0.1); }); From 110c17cf9e45a38fc76c46f927ecd58fc05c1a33 Mon Sep 17 00:00:00 2001 From: mike-000 <49240900+mike-000@users.noreply.github.com> Date: Tue, 22 Oct 2019 12:04:06 +0100 Subject: [PATCH 3/3] Remove label style caches --- src/ol/layer/Graticule.js | 74 ++++++++++++++++++--------------------- 1 file changed, 34 insertions(+), 40 deletions(-) diff --git a/src/ol/layer/Graticule.js b/src/ol/layer/Graticule.js index ccca2201fe..d30fc2b2e3 100644 --- a/src/ol/layer/Graticule.js +++ b/src/ol/layer/Graticule.js @@ -318,10 +318,23 @@ class Graticule extends VectorLayer { options.latLabelPosition; /** - * @type {Object.} + * @type {Style} * @private */ - this.lonLabelStyleCache_ = {}; + this.lonLabelStyleBase_ = new Style({ + text: options.lonLabelStyle !== undefined ? options.lonLabelStyle.clone() : + new Text({ + font: '12px Calibri,sans-serif', + textBaseline: 'bottom', + fill: new Fill({ + color: 'rgba(0,0,0,1)' + }), + stroke: new Stroke({ + color: 'rgba(255,255,255,1)', + width: 3 + }) + }) + }); /** * @private @@ -330,31 +343,28 @@ class Graticule extends VectorLayer { */ this.lonLabelStyle_ = function(feature) { const label = feature.get('graticule_label'); - if (!this.lonLabelStyleCache_[label]) { - this.lonLabelStyleCache_[label] = new Style({ - text: options.lonLabelStyle !== undefined ? options.lonLabelStyle.clone() : - new Text({ - font: '12px Calibri,sans-serif', - textBaseline: 'bottom', - fill: new Fill({ - color: 'rgba(0,0,0,1)' - }), - stroke: new Stroke({ - color: 'rgba(255,255,255,1)', - width: 3 - }) - }) - }); - this.lonLabelStyleCache_[label].getText().setText(label); - } - return this.lonLabelStyleCache_[label]; + this.lonLabelStyleBase_.getText().setText(label); + return this.lonLabelStyleBase_; }.bind(this); /** - * @type {Object.} + * @type {Style} * @private */ - this.latLabelStyleCache_ = {}; + this.latLabelStyleBase_ = new Style({ + text: options.latLabelStyle !== undefined ? options.latLabelStyle.clone() : + new Text({ + font: '12px Calibri,sans-serif', + textAlign: 'right', + fill: new Fill({ + color: 'rgba(0,0,0,1)' + }), + stroke: new Stroke({ + color: 'rgba(255,255,255,1)', + width: 3 + }) + }) + }); /** * @private @@ -363,24 +373,8 @@ class Graticule extends VectorLayer { */ this.latLabelStyle_ = function(feature) { const label = feature.get('graticule_label'); - if (!this.latLabelStyleCache_[label]) { - this.latLabelStyleCache_[label] = new Style({ - text: options.latLabelStyle !== undefined ? options.latLabelStyle.clone() : - new Text({ - font: '12px Calibri,sans-serif', - textAlign: 'right', - fill: new Fill({ - color: 'rgba(0,0,0,1)' - }), - stroke: new Stroke({ - color: 'rgba(255,255,255,1)', - width: 3 - }) - }) - }); - this.latLabelStyleCache_[label].getText().setText(label); - } - return this.latLabelStyleCache_[label]; + this.latLabelStyleBase_.getText().setText(label); + return this.latLabelStyleBase_; }.bind(this); this.meridiansLabels_ = [];