Merge pull request #1070 from tschaub/text-stroke

Add stroke support to text symbolizers.

src/objectliterals.jsdoc

@@ -762,6 +762,7 @@
  * @property {number|ol.expr.Expression|undefined} fontSize Font size in pixels.
  * @property {string|ol.expr.Expression} text Text for the label.
  * @property {number|ol.expr.Expression|undefined} opacity Opacity (0-1).
+ * @property {ol.style.Stroke|undefined} stroke Stroke symbolizer for text.
  * @property {number|ol.expr.Expression|undefined} zIndex Stack order.
  */
 

src/ol/renderer/canvas/canvasvectorrenderer.js

@@ -293,6 +293,15 @@ ol.renderer.canvas.Vector.prototype.renderText_ =
   context.textAlign = 'center';
   context.textBaseline = 'middle';
 
+  var stroke = false;
+  if (goog.isDef(text.strokeColor)) {
+    stroke = true;
+    goog.asserts.assertString(text.strokeColor);
+    context.strokeStyle = text.strokeColor;
+    goog.asserts.assertNumber(text.strokeWidth);
+    context.lineWidth = text.strokeWidth;
+  }
+
   for (var i = 0, ii = features.length; i < ii; ++i) {
     feature = features[i];
     if (feature.renderIntent === ol.layer.VectorLayerRenderIntent.HIDDEN) {
@@ -303,6 +312,16 @@ ol.renderer.canvas.Vector.prototype.renderText_ =
     for (var j = 0, jj = vecs.length; j < jj; ++j) {
       vec = vecs[j];
       goog.vec.Mat4.multVec3(this.transform_, vec, vec);
+      if (stroke) {
+        if (text.strokeOpacity !== text.opacity) {
+          goog.asserts.assertNumber(text.strokeOpacity);
+          context.globalAlpha = text.strokeOpacity;
+        }
+        context.strokeText(texts[i], vec[0], vec[1]);
+        if (text.strokeOpacity !== text.opacity) {
+          context.globalAlpha = text.opacity;
+        }
+      }
       context.fillText(texts[i], vec[0], vec[1]);
     }
   }

src/ol/style/textliteral.js

@@ -10,6 +10,9 @@ goog.require('ol.style.Literal');
  *            fontSize: number,
  *            text: string,
  *            opacity: number,
+ *            strokeColor: (string|undefined),
+ *            strokeOpacity: (number|undefined),
+ *            strokeWidth: (number|undefined),
  *            zIndex: number}}
  */
 ol.style.TextLiteralOptions;
@@ -43,6 +46,37 @@ ol.style.TextLiteral = function(options) {
   /** @type {number} */
   this.opacity = options.opacity;
 
+  /** @type {string|undefined} */
+  this.strokeColor = options.strokeColor;
+  if (goog.isDef(this.strokeColor)) {
+    goog.asserts.assertString(
+        this.strokeColor, 'strokeColor must be a string');
+  }
+
+  /** @type {number|undefined} */
+  this.strokeOpacity = options.strokeOpacity;
+  if (goog.isDef(this.strokeOpacity)) {
+    goog.asserts.assertNumber(
+        this.strokeOpacity, 'strokeOpacity must be a number');
+  }
+
+  /** @type {number|undefined} */
+  this.strokeWidth = options.strokeWidth;
+  if (goog.isDef(this.strokeWidth)) {
+    goog.asserts.assertNumber(
+        this.strokeWidth, 'strokeWidth must be a number');
+  }
+
+  // if any stroke property is defined, all must be defined
+  var strokeDef = goog.isDef(this.strokeColor) &&
+      goog.isDef(this.strokeOpacity) &&
+      goog.isDef(this.strokeWidth);
+  var strokeUndef = !goog.isDef(this.strokeColor) &&
+      !goog.isDef(this.strokeOpacity) &&
+      !goog.isDef(this.strokeWidth);
+  goog.asserts.assert(strokeDef || strokeUndef,
+      'If any stroke property is defined, all must be defined');
+
   goog.asserts.assertNumber(options.zIndex, 'zIndex must be a number');
   /** @type {number} */
   this.zIndex = options.zIndex;
@@ -59,5 +93,8 @@ ol.style.TextLiteral.prototype.equals = function(other) {
       this.fontFamily == other.fontFamily &&
       this.fontSize == other.fontSize &&
       this.opacity == other.opacity &&
+      this.strokeColor == other.strokeColor &&
+      this.strokeOpacity == other.strokeOpacity &&
+      this.strokeWidth == other.strokeWidth &&
       this.zIndex == other.zIndex;
 };

src/ol/style/textsymbolizer.js

@@ -60,6 +60,12 @@ ol.style.Text = function(options) {
       (options.opacity instanceof ol.expr.Expression) ?
           options.opacity : new ol.expr.Literal(options.opacity);
 
+  /**
+   * @type {ol.style.Stroke}
+   * @private
+   */
+  this.stroke_ = goog.isDefAndNotNull(options.stroke) ? options.stroke : null;
+
   /**
    * @type {ol.expr.Expression}
    * @private
@@ -102,6 +108,20 @@ ol.style.Text.prototype.createLiteral = function(featureOrType) {
   var opacity = Number(ol.expr.evaluateFeature(this.opacity_, feature));
   goog.asserts.assert(!isNaN(opacity), 'opacity must be a number');
 
+  var strokeColor, strokeOpacity, strokeWidth;
+  if (!goog.isNull(this.stroke_)) {
+    strokeColor = ol.expr.evaluateFeature(this.stroke_.getColor(), feature);
+    goog.asserts.assertString(
+        strokeColor, 'strokeColor must be a string');
+    strokeOpacity = Number(ol.expr.evaluateFeature(
+        this.stroke_.getOpacity(), feature));
+    goog.asserts.assert(!isNaN(strokeOpacity),
+        'strokeOpacity must be a number');
+    strokeWidth = Number(ol.expr.evaluateFeature(
+        this.stroke_.getWidth(), feature));
+    goog.asserts.assert(!isNaN(strokeWidth), 'strokeWidth must be a number');
+  }
+
   var zIndex = Number(ol.expr.evaluateFeature(this.zIndex_, feature));
   goog.asserts.assert(!isNaN(zIndex), 'zIndex must be a number');
 
@@ -111,6 +131,9 @@ ol.style.Text.prototype.createLiteral = function(featureOrType) {
     fontSize: fontSize,
     text: text,
     opacity: opacity,
+    strokeColor: strokeColor,
+    strokeOpacity: strokeOpacity,
+    strokeWidth: strokeWidth,
     zIndex: zIndex
   });
 };