Separate stroke and fill

examples/getfeatureinfo.js

@@ -6,7 +6,7 @@ goog.require('ol.layer.Vector');
 goog.require('ol.parser.GeoJSON');
 goog.require('ol.source.TiledWMS');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Polygon');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Rule');
 goog.require('ol.style.Style');
 
@@ -26,8 +26,8 @@ var vector = new ol.layer.Vector({
   style: new ol.style.Style({rules: [
     new ol.style.Rule({
       symbolizers: [
-        new ol.style.Polygon({
+        new ol.style.Fill({
-          strokeColor: '#bada55'
+          color: '#bada55'
         })
       ]
     })

examples/gml.js

@@ -6,7 +6,7 @@ goog.require('ol.layer.Vector');
 goog.require('ol.parser.ogc.GML_v3');
 goog.require('ol.source.MapQuestOpenAerial');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Polygon');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Rule');
 goog.require('ol.style.Style');
 
@@ -22,8 +22,8 @@ var vector = new ol.layer.Vector({
   style: new ol.style.Style({rules: [
     new ol.style.Rule({
       symbolizers: [
-        new ol.style.Polygon({
+        new ol.style.Fill({
-          strokeColor: '#bada55'
+          color: '#bada55'
         })
       ]
     })

examples/kml-timezones.js

@@ -7,8 +7,9 @@ goog.require('ol.layer.Vector');
 goog.require('ol.parser.KML');
 goog.require('ol.source.Stamen');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Polygon');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Rule');
+goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 
 
@@ -43,10 +44,12 @@ ol.expr.register('getOpacity', function() {
 var style = new ol.style.Style({rules: [
   new ol.style.Rule({
     symbolizers: [
-      new ol.style.Polygon({
+      new ol.style.Fill({
-        strokeColor: '#ffffff',
+        color: '#ffff33',
-        fillColor: '#ffff33',
+        opacity: ol.expr.parse('getOpacity()')
-        fillOpacity: ol.expr.parse('getOpacity()')
+      }),
+      new ol.style.Stroke({
+        color: '#ffffff',
       })
     ]
   })

examples/style-rules.js

@@ -7,9 +7,10 @@ goog.require('ol.layer.Vector');
 goog.require('ol.parser.GeoJSON');
 goog.require('ol.proj');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Line');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Rule');
 goog.require('ol.style.Shape');
+goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 goog.require('ol.style.Text');
 
@@ -18,25 +19,25 @@ var style = new ol.style.Style({rules: [
   new ol.style.Rule({
     filter: 'where == "outer"',
     symbolizers: [
-      new ol.style.Line({
+      new ol.style.Stroke({
-        strokeColor: ol.expr.parse('color'),
+        color: ol.expr.parse('color'),
-        strokeWidth: 4,
+        width: 4,
-        strokeOpacity: 1
+        opacity: 1
       })
     ]
   }),
   new ol.style.Rule({
     filter: 'where == "inner"',
     symbolizers: [
-      new ol.style.Line({
+      new ol.style.Stroke({
-        strokeColor: '#013',
+        color: '#013',
-        strokeWidth: 4,
+        width: 4,
-        strokeOpacity: 1
+        opacity: 1
       }),
-      new ol.style.Line({
+      new ol.style.Stroke({
-        strokeColor: ol.expr.parse('color'),
+        color: ol.expr.parse('color'),
-        strokeWidth: 2,
+        width: 2,
-        strokeOpacity: 1
+        opacity: 1
       })
     ]
   }),
@@ -45,7 +46,7 @@ var style = new ol.style.Style({rules: [
     symbolizers: [
       new ol.style.Shape({
         size: 40,
-        fillColor: '#013'
+        fill: new ol.style.Fill({color: '#013'})
       }),
       new ol.style.Text({
         color: '#bada55',

examples/topojson.js

@@ -6,8 +6,9 @@ goog.require('ol.layer.Vector');
 goog.require('ol.parser.TopoJSON');
 goog.require('ol.source.TileJSON');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Polygon');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Rule');
+goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 
 
@@ -25,12 +26,14 @@ var vector = new ol.layer.Vector({
   style: new ol.style.Style({rules: [
     new ol.style.Rule({
       symbolizers: [
-        new ol.style.Polygon({
+        new ol.style.Fill({
-          fillColor: '#BADA55',
+          color: '#BADA55',
-          fillOpacity: 0.5,
+          opacity: 0.5
-          strokeColor: '#FFF',
+        }),
-          strokeOpacity: 1,
+        new ol.style.Stroke({
-          strokeWidth: 1.5
+          color: '#FFF',
+          opacity: 1,
+          width: 1.5
         })
       ]
     })

examples/vector-layer.js

@@ -7,8 +7,9 @@ goog.require('ol.layer.Vector');
 goog.require('ol.parser.GeoJSON');
 goog.require('ol.source.MapQuestOpenAerial');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Polygon');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Rule');
+goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 goog.require('ol.style.Text');
 
@@ -30,11 +31,13 @@ var vector = new ol.layer.Vector({
   style: new ol.style.Style({rules: [
     new ol.style.Rule({
       symbolizers: [
-        new ol.style.Polygon({
+        new ol.style.Fill({
-          strokeColor: '#319FD3',
+          color: '#ffffff',
-          strokeOpacity: 1,
+          opacity: 0.6
-          fillColor: '#ffffff',
+        }),
-          fillOpacity: 0.6
+        new ol.style.Stroke({
+          color: '#319FD3',
+          opacity: 1
         })
       ]
     }),

src/objectliterals.jsdoc

@@ -612,23 +612,9 @@
  */
 
 /**
- * @typedef {Object} ol.style.LineOptions
+ * @typedef {Object} ol.style.FillOptions
- * @property {string|ol.expr.Expression|undefined} strokeColor Stroke
+ * @property {string|ol.expr.Expression|undefined} color Fill color as hex color
- *     color as hex color code.
+ *     code.
- * @property {number|ol.expr.Expression|undefined} strokeOpacity Stroke
- *     opacity (0-1).
- * @property {number|ol.expr.Expression|undefined} strokeWidth Stroke
- *     width in pixels.
- */
-
-/**
- * @typedef {Object} ol.style.PolygonOptions
- * @property {string|ol.expr.Expression|undefined} fillColor Fill color as
- *     hex color code.
- * @property {string|ol.expr.Expression|undefined} strokeColor Stroke
- *     color as hex color code.
- * @property {number|ol.expr.Expression|undefined} strokeWidth Stroke
- *     width in pixels.
  * @property {number|ol.expr.Expression|undefined} opacity Opacity (0-1).
  */
 
@@ -642,16 +628,16 @@
  * @typedef {Object} ol.style.ShapeOptions
  * @property {ol.style.ShapeType|undefined} type Type.
  * @property {number|ol.expr.Expression|undefined} size Size in pixels.
- * @property {string|ol.expr.Expression|undefined} fillColor Fill color as
+ * @property {ol.style.Fill|undefined} fill Fill symbolizer for shape.
- *     hex color code.
+ * @property {ol.style.Stroke|undefined} stroke Stroke symbolizer for shape.
- * @property {number|ol.expr.Expression|undefined} fillOpacity Fill opacity
+ */
- *     (0-1).
+
- * @property {string|ol.expr.Expression|undefined} strokeColor Stroke
+/**
- *     color as hex color code.
+ * @typedef {Object} ol.style.StrokeOptions
- * @property {number|ol.expr.Expression|undefined} strokeOpacity Stroke opacity
+ * @property {string|ol.expr.Expression|undefined} color Stroke color as hex
- *     (0-1).
+ *     color code.
- * @property {number|ol.expr.Expression|undefined} strokeWidth Stroke
+ * @property {number|ol.expr.Expression|undefined} opacity Stroke opacity (0-1).
- *     width in pixels.
+ * @property {number|ol.expr.Expression|undefined} width Stroke width in pixels.
  */
 
 /**

src/ol/feature.js

@@ -84,18 +84,11 @@ ol.Feature.prototype.getGeometry = function() {
 
 
 /**
- * @return {Array.<ol.style.Literal>} Symbolizer literals.
+ * Get any symbolizers set directly on the feature.
+ * @return {Array.<ol.style.Symbolizer>} Symbolizers (or null if none).
  */
-ol.Feature.prototype.getSymbolizerLiterals = function() {
+ol.Feature.prototype.getSymbolizers = function() {
-  var symbolizerLiterals = null;
+  return this.symbolizers_;
-  if (!goog.isNull(this.symbolizers_)) {
-    var numSymbolizers = this.symbolizers_.length;
-    symbolizerLiterals = new Array(numSymbolizers);
-    for (var i = 0; i < numSymbolizers; ++i) {
-      symbolizerLiterals[i] = this.symbolizers_[i].createLiteral(this);
-    }
-  }
-  return symbolizerLiterals;
 };
 
 

src/ol/layer/vectorlayer.js

@@ -384,15 +384,25 @@ ol.layer.Vector.prototype.groupFeaturesBySymbolizerLiteral =
   var uniqueLiterals = {},
       featuresBySymbolizer = [],
       style = this.style_,
-      i, j, l, feature, literals, numLiterals, literal, uniqueLiteral, key,
+      i, j, l, feature, geom, type, symbolizers, literals, numLiterals, literal,
-      item;
+      uniqueLiteral, key, item;
   for (i in features) {
     feature = features[i];
-    literals = feature.getSymbolizerLiterals();
+    geom = feature.getGeometry();
-    if (goog.isNull(literals)) {
+    if (geom) {
-      literals = goog.isNull(style) ?
+      type = geom.getType();
-          ol.style.Style.applyDefaultStyle(feature) :
+      // feature level symbolizers take precedence
-          style.apply(feature);
+      symbolizers = feature.getSymbolizers();
+      if (!goog.isNull(symbolizers)) {
+        literals = ol.style.Style.createLiterals(
+            symbolizers, type, feature);
+      } else {
+        if (!goog.isNull(style)) {
+          // layer style second
+          literals = style.apply(feature);
+        } else {
+          literals = ol.style.Style.applyDefaultStyle(feature);
+        }
       }
       numLiterals = literals.length;
       for (j = 0; j < numLiterals; ++j) {
@@ -420,6 +430,7 @@ ol.layer.Vector.prototype.groupFeaturesBySymbolizerLiteral =
         }
       }
     }
+  }
   return featuresBySymbolizer;
 };
 

src/ol/parser/kml.js

@@ -27,11 +27,9 @@ goog.require('ol.parser.DomFeatureParser');
 goog.require('ol.parser.ReadFeaturesOptions');
 goog.require('ol.parser.StringFeatureParser');
 goog.require('ol.parser.XML');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Icon');
-goog.require('ol.style.Line');
+goog.require('ol.style.Stroke');
-goog.require('ol.style.LineLiteral');
-goog.require('ol.style.Polygon');
-goog.require('ol.style.PolygonLiteral');
 
 
 
@@ -338,48 +336,48 @@ ol.parser.KML = function(opt_options) {
         }
       },
       'LineStyle': function(node, obj) {
-        var symbolizer = {};
+        var style = {}; // from KML
-        this.readChildNodes(node, symbolizer);
+        var options = {}; // for ol.style.Stroke
-        if (symbolizer.color) {
+        this.readChildNodes(node, style);
-          symbolizer.strokeColor = symbolizer.color.color;
+        if (style.color) {
-          symbolizer.strokeOpacity = symbolizer.color.opacity;
+          options.color = style.color.color;
+          options.opacity = style.color.opacity;
         }
-        if (symbolizer.width) {
+        if (style.width) {
-          symbolizer.strokeWidth = parseFloat(symbolizer.width);
+          options.width = parseFloat(style.width);
         }
-        delete symbolizer.color;
-        delete symbolizer.width;
         obj['ids'].push(node.getAttribute('id'));
-        obj['symbolizers'].push(new ol.style.Line(symbolizer));
+        obj['symbolizers'].push(new ol.style.Stroke(options));
       },
       'PolyStyle': function(node, obj) {
         var style = {}; // from KML
-        var symbolizer = {}; // for ol.style.Polygon
+        var options = {}; // for ol.style.Fill
         this.readChildNodes(node, style);
         // check if poly has fill
         if (!(style.fill === '0' || style.fill === 'false')) {
           if (style.color) {
-            symbolizer.fillColor = style.color.color;
+            options.color = style.color.color;
-            symbolizer.fillOpacity = style.color.opacity;
+            options.opacity = style.color.opacity;
           } else {
             // KML defaults
-            symbolizer.fillColor = '#ffffff';
+            options.color = '#ffffff';
-            symbolizer.fillOpacity = 1;
+            options.opacity = 1;
           }
+          obj['symbolizers'].push(new ol.style.Fill(options));
         }
         // check if poly has stroke
         if (!(style.outline === '0' || style.outline === 'false')) {
           if (style.color) {
-            symbolizer.strokeColor = style.color.color;
+            options.color = style.color.color;
-            symbolizer.strokeOpacity = style.color.opacity;
+            options.opacity = style.color.opacity;
           } else {
             // KML defaults
-            symbolizer.strokeColor = '#ffffff';
+            options.color = '#ffffff';
-            symbolizer.strokeOpacity = 1;
+            options.opacity = 1;
           }
+          obj['symbolizers'].push(new ol.style.Stroke(options));
         }
         obj['ids'].push(node.getAttribute('id'));
-        obj['symbolizers'].push(new ol.style.Polygon(symbolizer));
       },
       'fill': function(node, obj) {
         obj.fill = this.getChildValue(node);
@@ -418,19 +416,19 @@ ol.parser.KML = function(opt_options) {
         };
       },
       'IconStyle': function(node, obj) {
-        var symbolizer = {};
+        var style = {}; // from KML
-        this.readChildNodes(node, symbolizer);
+        var options = {}; // for ol.style.Icon
-        var scale = symbolizer.scale || 1;
+        this.readChildNodes(node, style);
+        var scale = style.scale || 1;
         // set default width and height of icon
         var width = 32 * scale;
         var height = 32 * scale;
         var x, y;
-        delete symbolizer.scale;
+        if (goog.isDef(style.icon)) {
-        if (goog.isDef(symbolizer.icon)) {
+          var href = style.icon.href;
-          var href = symbolizer.icon.href;
           if (goog.isDef(href)) {
-            var w = symbolizer.icon.w;
+            var w = style.icon.w;
-            var h = symbolizer.icon.h;
+            var h = style.icon.h;
             // Settings for Google specific icons that are 64x64
             // We set the width and height to 64 and halve the
             // scale to prevent icons from being too big
@@ -463,45 +461,42 @@ ol.parser.KML = function(opt_options) {
             if (matches) {
               var palette = matches[1];
               var file_extension = matches[2];
-              x = symbolizer.icon.x;
+              x = style.icon.x;
-              y = symbolizer.icon.y;
+              y = style.icon.y;
               var posX = x ? x / 32 : 0;
               var posY = y ? (7 - y / 32) : 7;
               var pos = posY * 8 + posX;
               href = 'http://maps.google.com/mapfiles/kml/pal' +
                   palette + '/icon' + pos + file_extension;
             }
-            symbolizer.opacity = 1;
+            options.opacity = 1;
-            symbolizer.url = href;
+            options.url = href;
           }
         }
-        if (goog.isDef(symbolizer.hotSpot)) {
+        if (goog.isDef(style.hotSpot)) {
-          x = symbolizer.hotSpot.x;
+          x = style.hotSpot.x;
-          y = symbolizer.hotSpot.y;
+          y = style.hotSpot.y;
-          var xUnits = symbolizer.hotSpot.xunits,
+          var xUnits = style.hotSpot.xunits,
-              yUnits = symbolizer.hotSpot.yunits;
+              yUnits = style.hotSpot.yunits;
           if (xUnits === 'pixels') {
-            symbolizer.graphicXOffset = -x * scale;
+            options.xOffset = -x * scale;
           } else if (xUnits === 'insetPixels') {
-            symbolizer.graphicXOffset = -width + (x * scale);
+            options.xOffset = -width + (x * scale);
           } else if (xUnits === 'fraction') {
-            symbolizer.graphicXOffset = -width * x;
+            options.xOffset = -width * x;
           }
           if (yUnits == 'pixels') {
-            symbolizer.graphicYOffset = -height + (y * scale) + 1;
+            options.yOffset = -height + (y * scale) + 1;
           } else if (yUnits == 'insetPixels') {
-            symbolizer.graphicYOffset = -(y * scale) + 1;
+            options.yOffset = -(y * scale) + 1;
           } else if (yUnits == 'fraction') {
-            symbolizer.graphicYOffset = -height * (1 - y) + 1;
+            options.yOffset = -height * (1 - y) + 1;
           }
         }
-        symbolizer.width = width;
+        options.width = width;
-        symbolizer.height = height;
+        options.height = height;
-        delete symbolizer.scale;
-        delete symbolizer.icon;
-        delete symbolizer.hotSpot;
         obj['ids'].push(node.getAttribute('id'));
-        obj['symbolizers'].push(new ol.style.Icon(symbolizer));
+        obj['symbolizers'].push(new ol.style.Icon(options));
       },
       'color': function(node, obj) {
         var kmlColor = this.getChildValue(node);
@@ -611,31 +606,27 @@ ol.parser.KML = function(opt_options) {
         }
         return node;
       },
-      '_symbolizer': function(symbolizerObj) {
+      '_symbolizer': function(obj) {
-        var symbolizer = symbolizerObj.symbolizer;
+        var symbolizer = obj.symbolizer;
         if (symbolizer instanceof ol.style.Icon) {
-          return this.writeNode('IconStyle', symbolizerObj);
+          return this.writeNode('IconStyle', obj);
-        } else if (symbolizer instanceof ol.style.Line ||
+        } else if (symbolizer instanceof ol.style.Stroke) {
-            symbolizer instanceof ol.style.LineLiteral) {
+          return this.writeNode('LineStyle', obj);
-          return this.writeNode('LineStyle', symbolizerObj);
+        } else if (symbolizer instanceof ol.style.Fill) {
-        } else if (symbolizer instanceof ol.style.Polygon ||
+          return this.writeNode('PolyStyle', obj);
-            symbolizer instanceof ol.style.PolygonLiteral) {
-          return this.writeNode('PolyStyle', symbolizerObj);
         }
       },
-      'PolyStyle': function(symbolizerObj) {
+      'PolyStyle': function(obj) {
         /**
-         * There is not a 1:1 mapping between KML PolyStyle and
+         * In KML, if a PolyStyle has <outline>1</outline>
-         * ol.style.Polygon.  In KML, if a PolyStyle has <outline>1</outline>
          * then the "current" LineStyle is used to stroke the polygon.
          */
         var node = this.createElementNS('PolyStyle');
-        if (symbolizerObj.id) {
+        if (obj.id) {
-          this.setAttributeNS(node, null, 'id', symbolizerObj.id);
+          this.setAttributeNS(node, null, 'id', obj.id);
         }
-        var symbolizer = symbolizerObj.symbolizer;
+        var literal = obj.symbolizer.createLiteral(
-        var literal = symbolizer instanceof ol.style.PolygonLiteral ?
+            ol.geom.GeometryType.POLYGON);
-            symbolizer : symbolizer.createLiteral();
         var color, opacity;
         if (literal.fillOpacity !== 0) {
           this.writeNode('fill', '1', null, node);
@@ -669,14 +660,13 @@ ol.parser.KML = function(opt_options) {
         node.appendChild(this.createTextNode(outline));
         return node;
       },
-      'LineStyle': function(symbolizerObj) {
+      'LineStyle': function(obj) {
         var node = this.createElementNS('LineStyle');
-        if (symbolizerObj.id) {
+        if (obj.id) {
-          this.setAttributeNS(node, null, 'id', symbolizerObj.id);
+          this.setAttributeNS(node, null, 'id', obj.id);
         }
-        var symbolizer = symbolizerObj.symbolizer;
+        var literal = obj.symbolizer.createLiteral(
-        var literal = symbolizer instanceof ol.style.LineLiteral ?
+            ol.geom.GeometryType.LINESTRING);
-            symbolizer : symbolizer.createLiteral();
         this.writeNode('color', {
           color: literal.strokeColor.substring(1),
           opacity: literal.strokeOpacity
@@ -698,10 +688,11 @@ ol.parser.KML = function(opt_options) {
         node.appendChild(this.createTextNode(width));
         return node;
       },
-      'IconStyle': function(symbolizerObj) {
+      'IconStyle': function(obj) {
         var node = this.createElementNS('IconStyle');
-        this.setAttributeNS(node, null, 'id', symbolizerObj.id);
+        this.setAttributeNS(node, null, 'id', obj.id);
-        this.writeNode('Icon', symbolizerObj.symbolizer.createLiteral().url,
+        this.writeNode('Icon', 
+            obj.symbolizer.createLiteral(ol.geom.GeometryType.POINT).url,
             null, node);
         return node;
       },
@@ -723,12 +714,14 @@ ol.parser.KML = function(opt_options) {
         }
         this.writeNode('name', feature, null, node);
         this.writeNode('description', feature, null, node);
-        var literals = feature.getSymbolizerLiterals();
         if (goog.isDef(feature.get('styleUrl'))) {
           this.writeNode('styleUrl', feature, null, node);
-        } else if (goog.isDefAndNotNull(literals)) {
+        } else {
           // inline style
-          this.writeNode('_style', {symbolizers: literals}, null, node);
+          var symbolizers = feature.getSymbolizers();
+          if (!goog.isNull(symbolizers)) {
+            this.writeNode('_style', {symbolizers: symbolizers}, null, node);
+          }
         }
         this.writeNode('_geometry', feature.getGeometry(), null, node);
         return node;
@@ -995,14 +988,13 @@ ol.parser.KML.prototype.read = function(data, opt_callback) {
  * @private
  * @param {ol.Feature} feature The feature to apply the style to.
  * @param {Array} styles The style list to search in.
- * @param {Array=} opt_symbolizers Optional symbolizers.
+ * @param {Array.<ol.style.Symbolizer>=} opt_symbolizers Optional symbolizers.
  */
 ol.parser.KML.prototype.applyStyle_ = function(feature, styles,
     opt_symbolizers) {
   var symbolizers = opt_symbolizers;
   var i, ii;
-  if (feature.get('styleUrl') &&
+  if (feature.get('styleUrl') && feature.getSymbolizers() === null) {
-      feature.getSymbolizerLiterals() === null) {
     var styleUrl = feature.get('styleUrl');
     styleUrl = styleUrl.substring(styleUrl.indexOf('#') + 1);
     // look for the style and set in the feature
@@ -1016,14 +1008,6 @@ ol.parser.KML.prototype.applyStyle_ = function(feature, styles,
     }
   }
   if (goog.isDef(symbolizers)) {
-    var geom = feature.getGeometry();
-    if (geom && geom instanceof ol.geom.LineString) {
-      for (i = 0, ii = symbolizers.length; i < ii; i++) {
-        if (symbolizers[i] instanceof ol.style.Polygon) {
-          symbolizers.splice(i, 1);
-        }
-      }
-    }
     feature.setSymbolizers(symbolizers);
   }
 };

src/ol/style.exports

@@ -1,8 +1,8 @@
+@exportClass ol.style.Fill ol.style.FillOptions
 @exportClass ol.style.Icon ol.style.IconOptions
-@exportClass ol.style.Line ol.style.LineOptions
-@exportClass ol.style.Polygon ol.style.PolygonOptions
 @exportClass ol.style.Rule ol.style.RuleOptions
 @exportClass ol.style.Shape ol.style.ShapeOptions
+@exportClass ol.style.Stroke ol.style.StrokeOptions
 @exportClass ol.style.Style ol.style.StyleOptions
 @exportClass ol.style.Text ol.style.TextOptions
 @exportSymbol ol.style.IconType

src/ol/style/fillsymbolizer.js

@@ -0,0 +1,117 @@
+goog.provide('ol.style.Fill');
+
+goog.require('goog.asserts');
+goog.require('ol.geom.GeometryType');
+goog.require('ol.expr');
+goog.require('ol.expr.Expression');
+goog.require('ol.expr.Literal');
+goog.require('ol.style.PolygonLiteral');
+goog.require('ol.style.Symbolizer');
+
+
+
+/**
+ * @constructor
+ * @extends {ol.style.Symbolizer}
+ * @param {ol.style.FillOptions=} opt_options Polygon options.
+ */
+ol.style.Fill = function(opt_options) {
+  goog.base(this);
+  var options = opt_options || {};
+
+  /**
+   * @type {ol.expr.Expression}
+   * @private
+   */
+  this.color_ = !goog.isDefAndNotNull(options.color) ?
+      new ol.expr.Literal(ol.style.FillDefaults.color) :
+      (options.color instanceof ol.expr.Expression) ?
+          options.color : new ol.expr.Literal(options.color);
+
+  /**
+   * @type {ol.expr.Expression}
+   * @private
+   */
+  this.opacity_ = !goog.isDefAndNotNull(options.opacity) ?
+      new ol.expr.Literal(ol.style.FillDefaults.opacity) :
+      (options.opacity instanceof ol.expr.Expression) ?
+          options.opacity : new ol.expr.Literal(options.opacity);
+
+};
+goog.inherits(ol.style.Fill, ol.style.Symbolizer);
+
+
+/**
+ * @inheritDoc
+ * @return {ol.style.PolygonLiteral} Literal shape symbolizer.
+ */
+ol.style.Fill.prototype.createLiteral = function(type, opt_feature) {
+  var literal = null;
+
+  if (type === ol.geom.GeometryType.POLYGON ||
+      type === ol.geom.GeometryType.MULTIPOLYGON) {
+
+    var color = ol.expr.evaluateFeature(this.color_, opt_feature);
+    goog.asserts.assertString(
+        color, 'color must be a string');
+
+    var opacity = ol.expr.evaluateFeature(this.opacity_, opt_feature);
+    goog.asserts.assertNumber(
+        opacity, 'color must be a number');
+
+    literal = new ol.style.PolygonLiteral({
+      fillColor: color,
+      fillOpacity: opacity
+    });
+  }
+
+  return literal;
+};
+
+
+/**
+ * Get the fill color.
+ * @return {ol.expr.Expression} Fill color.
+ */
+ol.style.Fill.prototype.getColor = function() {
+  return this.color_;
+};
+
+
+/**
+ * Get the fill opacity.
+ * @return {ol.expr.Expression} Fill opacity.
+ */
+ol.style.Fill.prototype.getOpacity = function() {
+  return this.opacity_;
+};
+
+
+/**
+ * Set the fill color.
+ * @param {ol.expr.Expression} color Fill color.
+ */
+ol.style.Fill.prototype.setColor = function(color) {
+  goog.asserts.assertInstanceof(color, ol.expr.Expression);
+  this.color_ = color;
+};
+
+
+/**
+ * Set the fill opacity.
+ * @param {ol.expr.Expression} opacity Fill opacity.
+ */
+ol.style.Fill.prototype.setOpacity = function(opacity) {
+  goog.asserts.assertInstanceof(opacity, ol.expr.Expression);
+  this.opacity_ = opacity;
+};
+
+
+/**
+ * @typedef {{fillColor: (string),
+ *            fillOpacity: (number)}}
+ */
+ol.style.FillDefaults = {
+  color: '#ffffff',
+  opacity: 0.4
+};

src/ol/style/iconsymbolizer.js

@@ -1,6 +1,7 @@
 goog.provide('ol.style.Icon');
 
 goog.require('goog.asserts');
+goog.require('ol.geom.GeometryType');
 goog.require('ol.expr');
 goog.require('ol.expr.Expression');
 goog.require('ol.expr.Literal');
@@ -70,7 +71,7 @@ ol.style.Icon = function(options) {
  * @inheritDoc
  * @return {ol.style.IconLiteral} Literal shape symbolizer.
  */
-ol.style.Icon.prototype.createLiteral = function(opt_feature) {
+ol.style.Icon.prototype.createLiteral = function(type, opt_feature) {
 
   var url = ol.expr.evaluateFeature(this.url_, opt_feature);
   goog.asserts.assertString(url, 'url must be a string');
@@ -200,10 +201,10 @@ ol.style.Icon.prototype.setWidth = function(width) {
 
 
 /**
- * @type {ol.style.IconLiteral}
+ * @typedef {{opacity: (number),
+ *            rotation: (number)}}
  */
-ol.style.IconDefaults = new ol.style.IconLiteral({
+ol.style.IconDefaults = {
-  url: '#',
   opacity: 1,
   rotation: 0
-});
+};

src/ol/style/linesymbolizer.js

@@ -1,143 +0,0 @@
-goog.provide('ol.style.Line');
-
-goog.require('goog.asserts');
-goog.require('ol.expr');
-goog.require('ol.expr.Expression');
-goog.require('ol.expr.Literal');
-goog.require('ol.style.LineLiteral');
-goog.require('ol.style.Symbolizer');
-goog.require('ol.style.Literal');
-
-
-
-/**
- * @constructor
- * @extends {ol.style.Symbolizer}
- * @param {ol.style.LineOptions} options Line options.
- */
-ol.style.Line = function(options) {
-  goog.base(this);
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeColor_ = !goog.isDef(options.strokeColor) ?
-      new ol.expr.Literal(ol.style.LineDefaults.strokeColor) :
-      (options.strokeColor instanceof ol.expr.Expression) ?
-          options.strokeColor : new ol.expr.Literal(options.strokeColor);
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeOpacity_ = !goog.isDef(options.strokeOpacity) ?
-      new ol.expr.Literal(ol.style.LineDefaults.strokeOpacity) :
-      (options.strokeOpacity instanceof ol.expr.Expression) ?
-          options.strokeOpacity : new ol.expr.Literal(options.strokeOpacity);
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeWidth_ = !goog.isDef(options.strokeWidth) ?
-      new ol.expr.Literal(ol.style.LineDefaults.strokeWidth) :
-      (options.strokeWidth instanceof ol.expr.Expression) ?
-          options.strokeWidth : new ol.expr.Literal(options.strokeWidth);
-
-};
-goog.inherits(ol.style.Line, ol.style.Symbolizer);
-
-
-/**
- * @inheritDoc
- * @return {ol.style.LineLiteral} Literal line symbolizer.
- */
-ol.style.Line.prototype.createLiteral = function(opt_feature) {
-
-  var strokeColor = ol.expr.evaluateFeature(
-      this.strokeColor_, opt_feature);
-  goog.asserts.assertString(strokeColor, 'strokeColor must be a string');
-
-  var strokeOpacity = ol.expr.evaluateFeature(
-      this.strokeOpacity_, opt_feature);
-  goog.asserts.assertNumber(strokeOpacity, 'strokeOpacity must be a number');
-
-  var strokeWidth = ol.expr.evaluateFeature(
-      this.strokeWidth_, opt_feature);
-  goog.asserts.assertNumber(strokeWidth, 'strokeWidth must be a number');
-
-
-  return new ol.style.LineLiteral({
-    strokeColor: strokeColor,
-    strokeOpacity: strokeOpacity,
-    strokeWidth: strokeWidth
-  });
-};
-
-
-/**
- * Get the stroke color.
- * @return {ol.expr.Expression} Stroke color.
- */
-ol.style.Line.prototype.getStrokeColor = function() {
-  return this.strokeColor_;
-};
-
-
-/**
- * Get the stroke opacity.
- * @return {ol.expr.Expression} Stroke opacity.
- */
-ol.style.Line.prototype.getStrokeOpacity = function() {
-  return this.strokeOpacity_;
-};
-
-
-/**
- * Get the stroke width.
- * @return {ol.expr.Expression} Stroke width.
- */
-ol.style.Line.prototype.getStrokeWidth = function() {
-  return this.strokeWidth_;
-};
-
-
-/**
- * Set the stroke color.
- * @param {ol.expr.Expression} strokeColor Stroke color.
- */
-ol.style.Line.prototype.setStrokeColor = function(strokeColor) {
-  goog.asserts.assertInstanceof(strokeColor, ol.expr.Expression);
-  this.strokeColor_ = strokeColor;
-};
-
-
-/**
- * Set the stroke opacity.
- * @param {ol.expr.Expression} strokeOpacity Stroke opacity.
- */
-ol.style.Line.prototype.setStrokeOpacity = function(strokeOpacity) {
-  goog.asserts.assertInstanceof(strokeOpacity, ol.expr.Expression);
-  this.strokeOpacity_ = strokeOpacity;
-};
-
-
-/**
- * Set the stroke width.
- * @param {ol.expr.Expression} strokeWidth Stroke width.
- */
-ol.style.Line.prototype.setStrokeWidth = function(strokeWidth) {
-  goog.asserts.assertInstanceof(strokeWidth, ol.expr.Expression);
-  this.strokeWidth_ = strokeWidth;
-};
-
-
-/**
- * @type {ol.style.LineLiteral}
- */
-ol.style.LineDefaults = new ol.style.LineLiteral({
-  strokeColor: '#696969',
-  strokeOpacity: 0.75,
-  strokeWidth: 1.5
-});

src/ol/style/polygonsymbolizer.js

@@ -1,286 +0,0 @@
-goog.provide('ol.style.Polygon');
-
-goog.require('goog.asserts');
-goog.require('ol.expr');
-goog.require('ol.expr.Expression');
-goog.require('ol.expr.Literal');
-goog.require('ol.style.PolygonLiteral');
-goog.require('ol.style.Symbolizer');
-
-
-
-/**
- * @constructor
- * @extends {ol.style.Symbolizer}
- * @param {ol.style.PolygonOptions} options Polygon options.
- */
-ol.style.Polygon = function(options) {
-  goog.base(this);
-
-
-  // fill handling - if any fill property is supplied, use all defaults
-  var fillColor = null,
-      fillOpacity = null;
-
-  if (goog.isDefAndNotNull(options.fillColor) ||
-      goog.isDefAndNotNull(options.fillOpacity)) {
-
-    if (goog.isDefAndNotNull(options.fillColor)) {
-      fillColor = (options.fillColor instanceof ol.expr.Expression) ?
-          options.fillColor :
-          new ol.expr.Literal(options.fillColor);
-    } else {
-      fillColor = new ol.expr.Literal(
-          /** @type {string} */ (ol.style.PolygonDefaults.fillColor));
-    }
-
-    if (goog.isDefAndNotNull(options.fillOpacity)) {
-      fillOpacity = (options.fillOpacity instanceof ol.expr.Expression) ?
-          options.fillOpacity :
-          new ol.expr.Literal(options.fillOpacity);
-    } else {
-      fillOpacity = new ol.expr.Literal(
-          /** @type {number} */ (ol.style.PolygonDefaults.fillOpacity));
-    }
-
-  }
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.fillColor_ = fillColor;
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.fillOpacity_ = fillOpacity;
-
-
-  // stroke handling - if any stroke property is supplied, use defaults
-  var strokeColor = null,
-      strokeOpacity = null,
-      strokeWidth = null;
-
-  if (goog.isDefAndNotNull(options.strokeColor) ||
-      goog.isDefAndNotNull(options.strokeOpacity) ||
-      goog.isDefAndNotNull(options.strokeWidth)) {
-
-    if (goog.isDefAndNotNull(options.strokeColor)) {
-      strokeColor = (options.strokeColor instanceof ol.expr.Expression) ?
-          options.strokeColor :
-          new ol.expr.Literal(options.strokeColor);
-    } else {
-      strokeColor = new ol.expr.Literal(
-          /** @type {string} */ (ol.style.PolygonDefaults.strokeColor));
-    }
-
-    if (goog.isDefAndNotNull(options.strokeOpacity)) {
-      strokeOpacity = (options.strokeOpacity instanceof ol.expr.Expression) ?
-          options.strokeOpacity :
-          new ol.expr.Literal(options.strokeOpacity);
-    } else {
-      strokeOpacity = new ol.expr.Literal(
-          /** @type {number} */ (ol.style.PolygonDefaults.strokeOpacity));
-    }
-
-    if (goog.isDefAndNotNull(options.strokeWidth)) {
-      strokeWidth = (options.strokeWidth instanceof ol.expr.Expression) ?
-          options.strokeWidth :
-          new ol.expr.Literal(options.strokeWidth);
-    } else {
-      strokeWidth = new ol.expr.Literal(
-          /** @type {number} */ (ol.style.PolygonDefaults.strokeWidth));
-    }
-
-  }
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeColor_ = strokeColor;
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeOpacity_ = strokeOpacity;
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeWidth_ = strokeWidth;
-
-  // one of stroke or fill can be null, both null is user error
-  var fill = !goog.isNull(this.fillColor_) && !goog.isNull(this.fillOpacity_);
-  var stroke = !goog.isNull(this.strokeColor_) &&
-      !goog.isNull(this.strokeOpacity_) &&
-      !goog.isNull(this.strokeWidth_);
-  goog.asserts.assert(fill || stroke,
-      'Stroke or fill properties must be provided');
-
-};
-goog.inherits(ol.style.Polygon, ol.style.Symbolizer);
-
-
-/**
- * @inheritDoc
- * @return {ol.style.PolygonLiteral} Literal shape symbolizer.
- */
-ol.style.Polygon.prototype.createLiteral = function(opt_feature) {
-
-  var fillColor;
-  if (!goog.isNull(this.fillColor_)) {
-    fillColor = ol.expr.evaluateFeature(this.fillColor_, opt_feature);
-    goog.asserts.assertString(fillColor, 'fillColor must be a string');
-  }
-
-  var fillOpacity;
-  if (!goog.isNull(this.fillOpacity_)) {
-    fillOpacity = ol.expr.evaluateFeature(this.fillOpacity_, opt_feature);
-    goog.asserts.assertNumber(fillOpacity, 'fillOpacity must be a number');
-  }
-
-  var strokeColor;
-  if (!goog.isNull(this.strokeColor_)) {
-    strokeColor = ol.expr.evaluateFeature(this.strokeColor_, opt_feature);
-    goog.asserts.assertString(strokeColor, 'strokeColor must be a string');
-  }
-
-  var strokeOpacity;
-  if (!goog.isNull(this.strokeOpacity_)) {
-    strokeOpacity = ol.expr.evaluateFeature(this.strokeOpacity_, opt_feature);
-    goog.asserts.assertNumber(strokeOpacity, 'strokeOpacity must be a number');
-  }
-
-  var strokeWidth;
-  if (!goog.isNull(this.strokeWidth_)) {
-    strokeWidth = ol.expr.evaluateFeature(this.strokeWidth_, opt_feature);
-    goog.asserts.assertNumber(strokeWidth, 'strokeWidth must be a number');
-  }
-
-  var fill = goog.isDef(fillColor) && goog.isDef(fillOpacity);
-  var stroke = goog.isDef(strokeColor) && goog.isDef(strokeOpacity) &&
-      goog.isDef(strokeWidth);
-
-  goog.asserts.assert(fill || stroke,
-      'either fill or stroke properties must be defined');
-
-  return new ol.style.PolygonLiteral({
-    fillColor: fillColor,
-    fillOpacity: fillOpacity,
-    strokeColor: strokeColor,
-    strokeOpacity: strokeOpacity,
-    strokeWidth: strokeWidth
-  });
-};
-
-
-/**
- * Get the fill color.
- * @return {ol.expr.Expression} Fill color.
- */
-ol.style.Polygon.prototype.getFillColor = function() {
-  return this.fillColor_;
-};
-
-
-/**
- * Get the fill opacity.
- * @return {ol.expr.Expression} Fill opacity.
- */
-ol.style.Polygon.prototype.getFillOpacity = function() {
-  return this.fillOpacity_;
-};
-
-
-/**
- * Get the stroke color.
- * @return {ol.expr.Expression} Stroke color.
- */
-ol.style.Polygon.prototype.getStrokeColor = function() {
-  return this.strokeColor_;
-};
-
-
-/**
- * Get the stroke opacity.
- * @return {ol.expr.Expression} Stroke opacity.
- */
-ol.style.Polygon.prototype.getStrokeOpacity = function() {
-  return this.strokeOpacity_;
-};
-
-
-/**
- * Get the stroke width.
- * @return {ol.expr.Expression} Stroke width.
- */
-ol.style.Polygon.prototype.getStrokeWidth = function() {
-  return this.strokeWidth_;
-};
-
-
-/**
- * Set the fill color.
- * @param {ol.expr.Expression} fillColor Fill color.
- */
-ol.style.Polygon.prototype.setFillColor = function(fillColor) {
-  goog.asserts.assertInstanceof(fillColor, ol.expr.Expression);
-  this.fillColor_ = fillColor;
-};
-
-
-/**
- * Set the fill opacity.
- * @param {ol.expr.Expression} fillOpacity Fill opacity.
- */
-ol.style.Polygon.prototype.setFillOpacity = function(fillOpacity) {
-  goog.asserts.assertInstanceof(fillOpacity, ol.expr.Expression);
-  this.fillOpacity_ = fillOpacity;
-};
-
-
-/**
- * Set the stroke color.
- * @param {ol.expr.Expression} strokeColor Stroke color.
- */
-ol.style.Polygon.prototype.setStrokeColor = function(strokeColor) {
-  goog.asserts.assertInstanceof(strokeColor, ol.expr.Expression);
-  this.strokeColor_ = strokeColor;
-};
-
-
-/**
- * Set the stroke opacity.
- * @param {ol.expr.Expression} strokeOpacity Stroke opacity.
- */
-ol.style.Polygon.prototype.setStrokeOpacity = function(strokeOpacity) {
-  goog.asserts.assertInstanceof(strokeOpacity, ol.expr.Expression);
-  this.strokeOpacity_ = strokeOpacity;
-};
-
-
-/**
- * Set the stroke width.
- * @param {ol.expr.Expression} strokeWidth Stroke width.
- */
-ol.style.Polygon.prototype.setStrokeWidth = function(strokeWidth) {
-  goog.asserts.assertInstanceof(strokeWidth, ol.expr.Expression);
-  this.strokeWidth_ = strokeWidth;
-};
-
-
-/**
- * @type {ol.style.PolygonLiteral}
- */
-ol.style.PolygonDefaults = new ol.style.PolygonLiteral({
-  fillColor: '#ffffff',
-  fillOpacity: 0.4,
-  strokeColor: '#696969',
-  strokeOpacity: 0.8,
-  strokeWidth: 1.5
-});

src/ol/style/shapesymbolizer.js

@@ -1,13 +1,16 @@
 goog.provide('ol.style.Shape');
 
 goog.require('goog.asserts');
+goog.require('ol.geom.GeometryType');
 goog.require('ol.expr');
 goog.require('ol.expr.Expression');
 goog.require('ol.expr.Literal');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Point');
 goog.require('ol.style.PointLiteral');
 goog.require('ol.style.ShapeLiteral');
 goog.require('ol.style.ShapeType');
+goog.require('ol.style.Stroke');
 
 
 
@@ -34,109 +37,21 @@ ol.style.Shape = function(options) {
       (options.size instanceof ol.expr.Expression) ?
           options.size : new ol.expr.Literal(options.size);
 
-  // fill handling - if any fill property is supplied, use all defaults
-  var fillColor = null,
-      fillOpacity = null;
-
-  if (goog.isDefAndNotNull(options.fillColor) ||
-      goog.isDefAndNotNull(options.fillOpacity)) {
-
-    if (goog.isDefAndNotNull(options.fillColor)) {
-      fillColor = (options.fillColor instanceof ol.expr.Expression) ?
-          options.fillColor :
-          new ol.expr.Literal(options.fillColor);
-    } else {
-      fillColor = new ol.expr.Literal(
-          /** @type {string} */ (ol.style.ShapeDefaults.fillColor));
-    }
-
-    if (goog.isDefAndNotNull(options.fillOpacity)) {
-      fillOpacity = (options.fillOpacity instanceof ol.expr.Expression) ?
-          options.fillOpacity :
-          new ol.expr.Literal(options.fillOpacity);
-    } else {
-      fillOpacity = new ol.expr.Literal(
-          /** @type {number} */ (ol.style.ShapeDefaults.fillOpacity));
-    }
-
-  }
-
   /**
-   * @type {ol.expr.Expression}
+   * @type {ol.style.Fill}
    * @private
    */
-  this.fillColor_ = fillColor;
+  this.fill_ = goog.isDefAndNotNull(options.fill) ? options.fill : null;
 
   /**
-   * @type {ol.expr.Expression}
+   * @type {ol.style.Stroke}
    * @private
    */
-  this.fillOpacity_ = fillOpacity;
+  this.stroke_ = goog.isDefAndNotNull(options.stroke) ? options.stroke : null;
-
-
-  // stroke handling - if any stroke property is supplied, use defaults
-  var strokeColor = null,
-      strokeOpacity = null,
-      strokeWidth = null;
-
-  if (goog.isDefAndNotNull(options.strokeColor) ||
-      goog.isDefAndNotNull(options.strokeOpacity) ||
-      goog.isDefAndNotNull(options.strokeWidth)) {
-
-    if (goog.isDefAndNotNull(options.strokeColor)) {
-      strokeColor = (options.strokeColor instanceof ol.expr.Expression) ?
-          options.strokeColor :
-          new ol.expr.Literal(options.strokeColor);
-    } else {
-      strokeColor = new ol.expr.Literal(
-          /** @type {string} */ (ol.style.ShapeDefaults.strokeColor));
-    }
-
-    if (goog.isDefAndNotNull(options.strokeOpacity)) {
-      strokeOpacity = (options.strokeOpacity instanceof ol.expr.Expression) ?
-          options.strokeOpacity :
-          new ol.expr.Literal(options.strokeOpacity);
-    } else {
-      strokeOpacity = new ol.expr.Literal(
-          /** @type {number} */ (ol.style.ShapeDefaults.strokeOpacity));
-    }
-
-    if (goog.isDefAndNotNull(options.strokeWidth)) {
-      strokeWidth = (options.strokeWidth instanceof ol.expr.Expression) ?
-          options.strokeWidth :
-          new ol.expr.Literal(options.strokeWidth);
-    } else {
-      strokeWidth = new ol.expr.Literal(
-          /** @type {number} */ (ol.style.ShapeDefaults.strokeWidth));
-    }
-
-  }
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeColor_ = strokeColor;
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeOpacity_ = strokeOpacity;
-
-  /**
-   * @type {ol.expr.Expression}
-   * @private
-   */
-  this.strokeWidth_ = strokeWidth;
 
   // one of stroke or fill can be null, both null is user error
-  var fill = !goog.isNull(this.fillColor_) && !goog.isNull(this.fillOpacity_);
+  goog.asserts.assert(this.fill_ || this.stroke_,
-  var stroke = !goog.isNull(this.strokeColor_) &&
+      'Stroke or fill must be provided');
-      !goog.isNull(this.strokeOpacity_) &&
-      !goog.isNull(this.strokeWidth_);
-  goog.asserts.assert(fill || stroke,
-      'Stroke or fill properties must be provided');
 
 };
 
@@ -145,49 +60,39 @@ ol.style.Shape = function(options) {
  * @inheritDoc
  * @return {ol.style.ShapeLiteral} Literal shape symbolizer.
  */
-ol.style.Shape.prototype.createLiteral = function(opt_feature) {
+ol.style.Shape.prototype.createLiteral = function(type, opt_feature) {
+  var literal = null;
 
+  if (type === ol.geom.GeometryType.POINT ||
+      type === ol.geom.GeometryType.MULTIPOINT) {
     var size = ol.expr.evaluateFeature(this.size_, opt_feature);
     goog.asserts.assertNumber(size, 'size must be a number');
 
-  var fillColor;
+    var fillColor, fillOpacity;
-  if (!goog.isNull(this.fillColor_)) {
+    if (!goog.isNull(this.fill_)) {
-    fillColor = ol.expr.evaluateFeature(this.fillColor_, opt_feature);
+      fillColor = ol.expr.evaluateFeature(this.fill_.getColor(), opt_feature);
-    goog.asserts.assertString(fillColor, 'fillColor must be a string');
+      goog.asserts.assertString(
+          fillColor, 'fillColor must be a string');
+      fillOpacity = ol.expr.evaluateFeature(this.fill_.getOpacity(), opt_feature);
+      goog.asserts.assertNumber(
+          fillOpacity, 'fillOpacity must be a number');
     }
 
-  var fillOpacity;
+    var strokeColor, strokeOpacity, strokeWidth;
-  if (!goog.isNull(this.fillOpacity_)) {
+    if (!goog.isNull(this.stroke_)) {
-    fillOpacity = ol.expr.evaluateFeature(this.fillOpacity_, opt_feature);
+      strokeColor = ol.expr.evaluateFeature(this.stroke_.getColor(), opt_feature);
-    goog.asserts.assertNumber(fillOpacity, 'fillOpacity must be a number');
+      goog.asserts.assertString(
+          strokeColor, 'strokeColor must be a string');
+      strokeOpacity = ol.expr.evaluateFeature(this.stroke_.getOpacity(),
+          opt_feature);
+      goog.asserts.assertNumber(
+          strokeOpacity, 'strokeOpacity must be a number');
+      strokeWidth = ol.expr.evaluateFeature(this.stroke_.getWidth(), opt_feature);
+      goog.asserts.assertNumber(
+          strokeWidth, 'strokeWidth must be a number');
     }
 
-  var strokeColor;
+    literal = new ol.style.ShapeLiteral({
-  if (!goog.isNull(this.strokeColor_)) {
-    strokeColor = ol.expr.evaluateFeature(this.strokeColor_, opt_feature);
-    goog.asserts.assertString(strokeColor, 'strokeColor must be a string');
-  }
-
-  var strokeOpacity;
-  if (!goog.isNull(this.strokeOpacity_)) {
-    strokeOpacity = ol.expr.evaluateFeature(this.strokeOpacity_, opt_feature);
-    goog.asserts.assertNumber(strokeOpacity, 'strokeOpacity must be a number');
-  }
-
-  var strokeWidth;
-  if (!goog.isNull(this.strokeWidth_)) {
-    strokeWidth = ol.expr.evaluateFeature(this.strokeWidth_, opt_feature);
-    goog.asserts.assertNumber(strokeWidth, 'strokeWidth must be a number');
-  }
-
-  var fill = goog.isDef(fillColor) && goog.isDef(fillOpacity);
-  var stroke = goog.isDef(strokeColor) && goog.isDef(strokeOpacity) &&
-      goog.isDef(strokeWidth);
-
-  goog.asserts.assert(fill || stroke,
-      'either fill or stroke properties must be defined');
-
-  return new ol.style.ShapeLiteral({
       type: this.type_,
       size: size,
       fillColor: fillColor,
@@ -196,24 +101,18 @@ ol.style.Shape.prototype.createLiteral = function(opt_feature) {
       strokeOpacity: strokeOpacity,
       strokeWidth: strokeWidth
     });
+  }
+
+  return literal;
 };
 
 
 /**
- * Get the fill color.
+ * Get the fill.
- * @return {ol.expr.Expression} Fill color.
+ * @return {ol.style.Fill} Shape fill.
  */
-ol.style.Shape.prototype.getFillColor = function() {
+ol.style.Shape.prototype.getFill = function() {
-  return this.fillColor_;
+  return this.fill_;
-};
-
-
-/**
- * Get the fill opacity.
- * @return {ol.expr.Expression} Fill opacity.
- */
-ol.style.Shape.prototype.getFillOpacity = function() {
-  return this.fillOpacity_;
 };
 
 
@@ -227,29 +126,11 @@ ol.style.Shape.prototype.getSize = function() {
 
 
 /**
- * Get the stroke color.
+ * Get the stroke.
- * @return {ol.expr.Expression} Stroke color.
+ * @return {ol.style.Stroke} Shape stroke.
  */
-ol.style.Shape.prototype.getStrokeColor = function() {
+ol.style.Shape.prototype.getStroke = function() {
-  return this.strokeColor_;
+  return this.stroke_;
-};
-
-
-/**
- * Get the stroke opacity.
- * @return {ol.expr.Expression} Stroke opacity.
- */
-ol.style.Shape.prototype.getStrokeOpacity = function() {
-  return this.strokeOpacity_;
-};
-
-
-/**
- * Get the stroke width.
- * @return {ol.expr.Expression} Stroke width.
- */
-ol.style.Shape.prototype.getStrokeWidth = function() {
-  return this.strokeWidth_;
 };
 
 
@@ -263,22 +144,14 @@ ol.style.Shape.prototype.getType = function() {
 
 
 /**
- * Set the fill color.
+ * Set the fill.
- * @param {ol.expr.Expression} fillColor Fill color.
+ * @param {ol.style.Fill} fill Shape fill.
  */
-ol.style.Shape.prototype.setFillColor = function(fillColor) {
+ol.style.Shape.prototype.setFill = function(fill) {
-  goog.asserts.assertInstanceof(fillColor, ol.expr.Expression);
+  if (!goog.isNull(fill)) {
-  this.fillColor_ = fillColor;
+    goog.asserts.assertInstanceof(fill, ol.style.Fill);
-};
+  }
-
+  this.fill_ = fill;
-
-/**
- * Set the fill opacity.
- * @param {ol.expr.Expression} fillOpacity Fill opacity.
- */
-ol.style.Shape.prototype.setFillOpacity = function(fillOpacity) {
-  goog.asserts.assertInstanceof(fillOpacity, ol.expr.Expression);
-  this.fillOpacity_ = fillOpacity;
 };
 
 
@@ -293,32 +166,14 @@ ol.style.Shape.prototype.setSize = function(size) {
 
 
 /**
- * Set the stroke color.
+ * Set the stroke.
- * @param {ol.expr.Expression} strokeColor Stroke color.
+ * @param {ol.style.Stroke} stroke Shape stroke.
  */
-ol.style.Shape.prototype.setStrokeColor = function(strokeColor) {
+ol.style.Shape.prototype.setStroke = function(stroke) {
-  goog.asserts.assertInstanceof(strokeColor, ol.expr.Expression);
+  if (!goog.isNull(stroke)) {
-  this.strokeColor_ = strokeColor;
+    goog.asserts.assertInstanceof(stroke, ol.style.Stroke);
-};
+  }
-
+  this.stroke_ = stroke;
-
-/**
- * Set the stroke opacity.
- * @param {ol.expr.Expression} strokeOpacity Stroke opacity.
- */
-ol.style.Shape.prototype.setStrokeOpacity = function(strokeOpacity) {
-  goog.asserts.assertInstanceof(strokeOpacity, ol.expr.Expression);
-  this.strokeOpacity_ = strokeOpacity;
-};
-
-
-/**
- * Set the stroke width.
- * @param {ol.expr.Expression} strokeWidth Stroke width.
- */
-ol.style.Shape.prototype.setStrokeWidth = function(strokeWidth) {
-  goog.asserts.assertInstanceof(strokeWidth, ol.expr.Expression);
-  this.strokeWidth_ = strokeWidth;
 };
 
 
@@ -332,14 +187,10 @@ ol.style.Shape.prototype.setType = function(type) {
 
 
 /**
- * @type {ol.style.ShapeLiteral}
+ * @typedef {{type: (ol.style.ShapeType),
+ *            size: (number)}}
  */
-ol.style.ShapeDefaults = new ol.style.ShapeLiteral({
+ol.style.ShapeDefaults = {
   type: ol.style.ShapeType.CIRCLE,
-  size: 5,
+  size: 5
-  fillColor: '#ffffff',
+};
-  fillOpacity: 0.4,
-  strokeColor: '#696969',
-  strokeOpacity: 0.8,
-  strokeWidth: 1.5
-});

src/ol/style/strokesymbolizer.js

@@ -0,0 +1,158 @@
+goog.provide('ol.style.Stroke');
+goog.provide('ol.style.StrokeDefaults');
+
+goog.require('goog.asserts');
+goog.require('ol.geom.GeometryType');
+goog.require('ol.expr');
+goog.require('ol.expr.Expression');
+goog.require('ol.expr.Literal');
+goog.require('ol.style.LineLiteral');
+goog.require('ol.style.Symbolizer');
+goog.require('ol.style.Literal');
+
+
+
+/**
+ * @constructor
+ * @extends {ol.style.Symbolizer}
+ * @param {ol.style.StrokeOptions=} opt_options Stroke options.
+ */
+ol.style.Stroke = function(opt_options) {
+  goog.base(this);
+  var options = opt_options || {};
+
+  /**
+   * @type {ol.expr.Expression}
+   * @private
+   */
+  this.color_ = !goog.isDefAndNotNull(options.color) ?
+      new ol.expr.Literal(ol.style.StrokeDefaults.color) :
+      (options.color instanceof ol.expr.Expression) ?
+          options.color : new ol.expr.Literal(options.color);
+
+  /**
+   * @type {ol.expr.Expression}
+   * @private
+   */
+  this.opacity_ = !goog.isDefAndNotNull(options.opacity) ?
+      new ol.expr.Literal(ol.style.StrokeDefaults.opacity) :
+      (options.opacity instanceof ol.expr.Expression) ?
+          options.opacity : new ol.expr.Literal(options.opacity);
+
+  /**
+   * @type {ol.expr.Expression}
+   * @private
+   */
+  this.width_ = !goog.isDefAndNotNull(options.width) ?
+      new ol.expr.Literal(ol.style.StrokeDefaults.width) :
+      (options.width instanceof ol.expr.Expression) ?
+          options.width : new ol.expr.Literal(options.width);
+
+};
+goog.inherits(ol.style.Stroke, ol.style.Symbolizer);
+
+
+/**
+ * @inheritDoc
+ * @return {ol.style.LineLiteral|ol.style.PolygonLiteral} Symbolizer literal.
+ */
+ol.style.Stroke.prototype.createLiteral = function(type, opt_feature) {
+  var color = ol.expr.evaluateFeature(
+      this.color_, opt_feature);
+  goog.asserts.assertString(color, 'color must be a string');
+
+  var opacity = ol.expr.evaluateFeature(
+      this.opacity_, opt_feature);
+  goog.asserts.assertNumber(opacity, 'opacity must be a number');
+
+  var width = ol.expr.evaluateFeature(
+      this.width_, opt_feature);
+  goog.asserts.assertNumber(width, 'width must be a number');
+
+  var literal = null;
+  if (type === ol.geom.GeometryType.LINESTRING ||
+      type === ol.geom.GeometryType.MULTILINESTRING) {
+    literal = new ol.style.LineLiteral({
+      strokeColor: color,
+      strokeOpacity: opacity,
+      strokeWidth: width
+    });
+  } else if (type === ol.geom.GeometryType.POLYGON ||
+      type === ol.geom.GeometryType.MULTIPOLYGON) {
+    literal = new ol.style.PolygonLiteral({
+      strokeColor: color,
+      strokeOpacity: opacity,
+      strokeWidth: width
+    });
+  }
+  return literal;
+};
+
+
+/**
+ * Get the stroke color.
+ * @return {ol.expr.Expression} Stroke color.
+ */
+ol.style.Stroke.prototype.getColor = function() {
+  return this.color_;
+};
+
+
+/**
+ * Get the stroke opacity.
+ * @return {ol.expr.Expression} Stroke opacity.
+ */
+ol.style.Stroke.prototype.getOpacity = function() {
+  return this.opacity_;
+};
+
+
+/**
+ * Get the stroke width.
+ * @return {ol.expr.Expression} Stroke width.
+ */
+ol.style.Stroke.prototype.getWidth = function() {
+  return this.width_;
+};
+
+
+/**
+ * Set the stroke color.
+ * @param {ol.expr.Expression} color Stroke color.
+ */
+ol.style.Stroke.prototype.setColor = function(color) {
+  goog.asserts.assertInstanceof(color, ol.expr.Expression);
+  this.color_ = color;
+};
+
+
+/**
+ * Set the stroke opacity.
+ * @param {ol.expr.Expression} opacity Stroke opacity.
+ */
+ol.style.Stroke.prototype.setOpacity = function(opacity) {
+  goog.asserts.assertInstanceof(opacity, ol.expr.Expression);
+  this.opacity_ = opacity;
+};
+
+
+/**
+ * Set the stroke width.
+ * @param {ol.expr.Expression} width Stroke width.
+ */
+ol.style.Stroke.prototype.setWidth = function(width) {
+  goog.asserts.assertInstanceof(width, ol.expr.Expression);
+  this.width_ = width;
+};
+
+
+/**
+ * @typedef {{strokeColor: (string),
+ *            strokeOpacity: (number),
+ *            strokeWidth: (number)}}
+ */
+ol.style.StrokeDefaults = {
+  color: '#696969',
+  opacity: 0.75,
+  width: 1.5
+};

src/ol/style/style.js

@@ -1,10 +1,14 @@
 goog.provide('ol.style.Style');
 
+goog.require('goog.object');
 goog.require('ol.Feature');
 goog.require('ol.geom.GeometryType');
-goog.require('ol.style.Rule');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Literal');
 goog.require('ol.style.PolygonLiteral');
+goog.require('ol.style.Rule');
+goog.require('ol.style.Shape');
+goog.require('ol.style.Stroke');
 
 
 
@@ -31,16 +35,21 @@ ol.style.Style = function(options) {
 ol.style.Style.prototype.apply = function(feature) {
   var rules = this.rules_,
       literals = [],
+      geometry = feature.getGeometry(),
       rule, symbolizers;
+  var type = geometry ? geometry.getType() : null;
+  if (!goog.isNull(type)) {
     for (var i = 0, ii = rules.length; i < ii; ++i) {
       rule = rules[i];
       if (rule.applies(feature)) {
         symbolizers = rule.getSymbolizers();
         for (var j = 0, jj = symbolizers.length; j < jj; ++j) {
-        literals.push(symbolizers[j].createLiteral(feature));
+          literals.push(symbolizers[j].createLiteral(type, feature));
         }
       }
     }
+    literals = ol.style.Style.reduceLiterals_(literals);
+  }
   return literals;
 };
 
@@ -51,32 +60,54 @@ ol.style.Style.prototype.apply = function(feature) {
  *     the feature.
  */
 ol.style.Style.applyDefaultStyle = function(feature) {
-  var geometry = feature.getGeometry(),
+  return ol.style.Style.defaults.apply(feature);
-      symbolizerLiterals = [];
-  if (!goog.isNull(geometry)) {
-    var type = geometry.getType();
-    if (type === ol.geom.GeometryType.POINT ||
-        type === ol.geom.GeometryType.MULTIPOINT) {
-      symbolizerLiterals.push(ol.style.ShapeDefaults);
-    } else if (type === ol.geom.GeometryType.LINESTRING ||
-        type === ol.geom.GeometryType.MULTILINESTRING) {
-      symbolizerLiterals.push(ol.style.LineDefaults);
-    } else if (type === ol.geom.GeometryType.LINEARRING ||
-        type === ol.geom.GeometryType.POLYGON ||
-        type === ol.geom.GeometryType.MULTIPOLYGON) {
-      symbolizerLiterals.push(ol.style.PolygonDefaults);
-    }
-  }
-  return symbolizerLiterals;
 };
 
 
 /**
- * Collapse partial polygon symbolizers.
+ * The default style.
+ * @type {ol.style.Style}
+ */
+ol.style.Style.defaults = new ol.style.Style({
+  rules: [
+    new ol.style.Rule({
+      symbolizers: [
+        new ol.style.Shape({
+          fill: new ol.style.Fill(),
+          stroke: new ol.style.Stroke()
+        }),
+        new ol.style.Fill(),
+        new ol.style.Stroke()
+      ]    
+    })
+  ]
+});
+
+
+/**
+ * Given an array of symbolizers, generate an array of literals.
+ * @param {Array.<ol.style.Symbolizer>} symbolizers List of symbolizers.
+ * @param {ol.geom.GeometryType} type Geometry type.
+ * @param {ol.Feature=} opt_feature Optional feature.
+ * @return {Array.<ol.style.Literal>} Array of literals.
+ */
+ol.style.Style.createLiterals = function(symbolizers, type, opt_feature) {
+  var length = symbolizers.length;
+  var literals = new Array(length);
+  for (var i = 0; i < length; ++i) {
+    literals[i] = symbolizers[i].createLiteral(type, opt_feature);
+  }
+  return ol.style.Style.reduceLiterals_(literals);
+}
+
+
+/**
+ * Collapse partial polygon symbolizers and remove null symbolizers.
  * @param {Array.<ol.style.Literal>} literals Input literals.
  * @return {Array.<ol.style.Literal>} Reduced literals.
+ * @private
  */
-ol.style.Style.reduceLiterals = function(literals) {
+ol.style.Style.reduceLiterals_ = function(literals) {
   var reduced = [];
   var literal, stroke, fill, key, value;
   for (var i = 0, ii = literals.length; i < ii; ++i) {
@@ -116,7 +147,7 @@ ol.style.Style.reduceLiterals = function(literals) {
         // both stroke and fill, proceed
         reduced.push(literal);
       }
-    } else {
+    } else if (literal) {
       reduced.push(literal);
     }
   }

src/ol/style/symbolizer.js

@@ -12,6 +12,7 @@ ol.style.Symbolizer = function() {};
 
 
 /**
+ * @param {ol.geom.GeometryType} type Geometry type.
  * @param {ol.Feature=} opt_feature Feature for evaluating expressions.
  * @return {ol.style.Literal} Literal symbolizer.
  */

src/ol/style/textsymbolizer.js

@@ -67,7 +67,7 @@ goog.inherits(ol.style.Text, ol.style.Symbolizer);
  * @inheritDoc
  * @return {ol.style.TextLiteral} Literal text symbolizer.
  */
-ol.style.Text.prototype.createLiteral = function(opt_feature) {
+ol.style.Text.prototype.createLiteral = function(type, opt_feature) {
 
   var color = ol.expr.evaluateFeature(this.color_, opt_feature);
   goog.asserts.assertString(color, 'color must be a string');
@@ -190,12 +190,14 @@ ol.style.Text.prototype.setText = function(text) {
 
 
 /**
- * @type {ol.style.TextLiteral}
+ * @typedef {{color: string,
+ *            fontFamily: string,
+ *            fontSize: number,
+ *            opacity: number}}
  */
-ol.style.TextDefaults = new ol.style.TextLiteral({
+ol.style.TextDefaults = {
   color: '#000',
   fontFamily: 'sans-serif',
   fontSize: 10,
-  text: '',
   opacity: 1
-});
+};

test/spec/ol/layer/vectorlayer.test.js

@@ -106,9 +106,9 @@ describe('ol.layer.Vector', function() {
         rules: [
           new ol.style.Rule({
             symbolizers: [
-              new ol.style.Line({
+              new ol.style.Stroke({
-                strokeWidth: 2,
+                width: 2,
-                strokeColor: ol.expr.parse('colorProperty'),
+                color: ol.expr.parse('colorProperty'),
                 opacity: 1
               })
             ]
@@ -143,14 +143,14 @@ describe('ol.layer.Vector', function() {
     });
 
     it('groups equal symbolizers also when defined on features', function() {
-      var symbolizer = new ol.style.Line({
+      var symbolizer = new ol.style.Stroke({
-        strokeWidth: 3,
+        width: 3,
-        strokeColor: ol.expr.parse('colorProperty'),
+        color: ol.expr.parse('colorProperty'),
         opacity: 1
       });
-      var anotherSymbolizer = new ol.style.Line({
+      var anotherSymbolizer = new ol.style.Stroke({
-        strokeWidth: 3,
+        width: 3,
-        strokeColor: '#BADA55',
+        color: '#BADA55',
         opacity: 1
       });
       var featureWithSymbolizers = new ol.Feature({
@@ -165,7 +165,7 @@ describe('ol.layer.Vector', function() {
       features.push(featureWithSymbolizers, anotherFeatureWithSymbolizers);
 
       var groups = layer.groupFeaturesBySymbolizerLiteral(features);
-      expect(groups.length).to.be(3);
+      expect(groups).to.have.length(3);
       expect(groups[2][0].length).to.be(2);
       expect(groups[2][1].strokeWidth).to.be(3);
 
@@ -188,6 +188,6 @@ goog.require('ol.geom.Point');
 goog.require('ol.proj');
 goog.require('ol.layer.Vector');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Line');
 goog.require('ol.style.Rule');
+goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');

test/spec/ol/parser/kml.test.js

@@ -1,6 +1,6 @@
-goog.provide('ol.test.parser.kml');
+goog.provide('ol.test.parser.KML');
 
-describe('ol.parser.kml', function() {
+describe('ol.parser.KML', function() {
 
   var parser = new ol.parser.KML();
 
@@ -165,8 +165,9 @@ describe('ol.parser.kml', function() {
       expect(obj.features[0].get('description')).to.eql('Full of text.');
       expect(obj.features[0].get('name')).to.eql('Pezinok');
     });
-    it('Test line style (read / write)', function() {
+
-      var test_style = '<kml xmlns="http://www.opengis.net/kml/2.2" ' +
+    it('handles line style (read / write)', function() {
+      var kml = '<kml xmlns="http://www.opengis.net/kml/2.2" ' +
           'xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" ' +
           'xsi:schemaLocation="http://www.opengis.net/kml/2.2 ' +
           'http://schemas.opengis.net/kml/2.2.0/ogckml22.xsd"> ' +
@@ -175,16 +176,24 @@ describe('ol.parser.kml', function() {
           '<coordinates> -112,36 -113,37 </coordinates> </LineString>' +
           '</Placemark></Document></kml>';
       var p = new ol.parser.KML({extractStyles: true});
-      var obj = p.read(test_style);
+      var obj = p.read(kml);
       var output = p.write(obj);
-      expect(goog.dom.xml.loadXml(test_style)).to.xmleql(
+      expect(goog.dom.xml.loadXml(kml)).to.xmleql(
           goog.dom.xml.loadXml(output));
-      var symbolizer = obj.features[0].getSymbolizerLiterals()[0];
+
-      expect(symbolizer instanceof ol.style.LineLiteral).to.be.ok();
+      var symbolizers = obj.features[0].getSymbolizers();
-      expect(symbolizer.strokeColor).to.eql('#ff0000');
+      expect(symbolizers).to.have.length(1);
-      expect(symbolizer.strokeOpacity).to.eql(0.5294117647058824);
+
-      expect(symbolizer.strokeWidth).to.eql(10);
+      var stroke = symbolizers[0];
+      expect(stroke).to.be.a(ol.style.Stroke);
+
+      var literal = stroke.createLiteral(ol.geom.GeometryType.LINESTRING);
+      expect(literal).to.be.a(ol.style.LineLiteral);
+      expect(literal.strokeColor).to.eql('#ff0000');
+      expect(literal.strokeOpacity).to.eql(0.5294117647058824);
+      expect(literal.strokeWidth).to.eql(10);
     });
+
     it('reads PolyStyle fill', function() {
       var kml = '<kml xmlns="http://www.opengis.net/kml/2.2">' +
           '<Document><Placemark>    <Style> <PolyStyle> <fill>1</fill> ' +
@@ -203,11 +212,34 @@ describe('ol.parser.kml', function() {
           '</outerBoundaryIs></Polygon></Placemark></Document></kml>';
       var p = new ol.parser.KML({extractStyles: true});
       var obj = p.read(kml);
-      var symbolizer1 = obj.features[0].getSymbolizerLiterals()[0];
+
-      var symbolizer2 = obj.features[1].getSymbolizerLiterals()[0];
+      var symbolizers = obj.features[0].getSymbolizers();
-      expect(symbolizer1.strokeColor).to.be('#ff0000');
+      expect(symbolizers).to.have.length(2);
-      expect(symbolizer2.fillOpacity).to.be(undefined);
+      expect(symbolizers[0]).to.be.a(ol.style.Fill);
+      expect(symbolizers[1]).to.be.a(ol.style.Stroke);
+
+      var literals = ol.style.Style.createLiterals(
+          symbolizers, ol.geom.GeometryType.POLYGON);
+      expect(literals).to.have.length(1);
+
+      var literal = literals[0];
+      expect(literal).to.be.a(ol.style.PolygonLiteral);
+      expect(literal.fillColor).to.be('#ff0000');
+      expect(literal.strokeColor).to.be('#ff0000');
+
+      symbolizers = obj.features[1].getSymbolizers();
+      expect(symbolizers).to.have.length(1);
+      expect(symbolizers[0]).to.be.a(ol.style.Stroke);
+
+      var literals = ol.style.Style.createLiterals(
+          symbolizers, ol.geom.GeometryType.POLYGON);
+      expect(literals).to.have.length(1);
+
+      literal = literals[0];
+      expect(literal).to.be.a(ol.style.PolygonLiteral);
+      expect(literal.fillColor).to.be(undefined);
     });
+
     it('writes PolyStyle fill and outline', function() {
       var kml = '<kml xmlns="http://www.opengis.net/kml/2.2" ' +
           'xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" ' +
@@ -226,18 +258,28 @@ describe('ol.parser.kml', function() {
       expect(goog.dom.xml.loadXml(kml)).to.xmleql(
           goog.dom.xml.loadXml(output));
     });
-    it('Test iconStyle (read / write)', function(done) {
+
+    it('handles iconStyle (read / write)', function(done) {
       var url = 'spec/ol/parser/kml/iconstyle.kml';
       afterLoadXml(url, function(xml) {
         var p = new ol.parser.KML({extractStyles: true});
         var obj = p.read(xml);
         var output = p.write(obj);
         expect(goog.dom.xml.loadXml(output)).to.xmleql(xml);
-        var symbolizer = obj.features[0].getSymbolizerLiterals()[0];
+
+        var symbolizers = obj.features[0].getSymbolizers();
+        expect(symbolizers).to.have.length(1);
+
+        var symbolizer = symbolizers[0];
+        expect(symbolizer).to.be.a(ol.style.Icon);
+
+        var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
+        expect(literal).to.be.a(ol.style.IconLiteral);
+
         var url = 'http://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png';
-        expect(symbolizer.url).to.eql(url);
+        expect(literal.url).to.eql(url);
-        expect(symbolizer.width).to.eql(32);
+        expect(literal.width).to.eql(32);
-        expect(symbolizer.height).to.eql(32);
+        expect(literal.height).to.eql(32);
         done();
       });
     });
@@ -295,6 +337,7 @@ goog.require('goog.array');
 goog.require('goog.dom.xml');
 
 goog.require('ol.Feature');
+goog.require('ol.geom.GeometryType')
 goog.require('ol.geom.GeometryCollection');
 goog.require('ol.geom.LineString');
 goog.require('ol.geom.MultiLineString');
@@ -302,4 +345,8 @@ goog.require('ol.geom.MultiPolygon');
 goog.require('ol.geom.Point');
 goog.require('ol.geom.Polygon');
 goog.require('ol.parser.KML');
+goog.require('ol.style.Fill');
 goog.require('ol.style.LineLiteral');
+goog.require('ol.style.PolygonLiteral');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');

test/spec/ol/style/fillsymbolizer.test.js

@@ -0,0 +1,162 @@
+goog.provide('ol.test.style.Fill');
+
+describe('ol.style.Fill', function() {
+
+  describe('constructor', function() {
+
+    it('accepts literal values', function() {
+      var symbolizer = new ol.style.Fill({
+        color: '#BADA55'
+      });
+      expect(symbolizer).to.be.a(ol.style.Fill);
+    });
+
+    it('accepts expressions', function() {
+      var symbolizer = new ol.style.Fill({
+        opacity: ol.expr.parse('value / 100'),
+        color: ol.expr.parse('fillAttr')
+      });
+      expect(symbolizer).to.be.a(ol.style.Fill);
+    });
+
+  });
+
+  describe('#createLiteral()', function() {
+
+    it('evaluates expressions with the given feature', function() {
+      var symbolizer = new ol.style.Fill({
+        opacity: ol.expr.parse('value / 100'),
+        color: ol.expr.parse('fillAttr')
+      });
+
+      var feature = new ol.Feature({
+        value: 42,
+        fillAttr: '#ff0000'
+      });
+
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POLYGON,
+          feature);
+      expect(literal).to.be.a(ol.style.PolygonLiteral);
+      expect(literal.fillOpacity).to.be(42 / 100);
+      expect(literal.fillColor).to.be('#ff0000');
+    });
+
+    it('applies default opacity', function() {
+      var symbolizer = new ol.style.Fill({
+        color: '#ff0000'
+      });
+
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POLYGON);
+      expect(literal).to.be.a(ol.style.PolygonLiteral);
+      expect(literal.fillColor).to.be('#ff0000');
+      expect(literal.fillOpacity).to.be(0.4);
+    });
+
+    it('applies default color', function() {
+      var symbolizer = new ol.style.Fill({
+        opacity: 0.8
+      });
+
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POLYGON);
+      expect(literal).to.be.a(ol.style.PolygonLiteral);
+      expect(literal.fillColor).to.be('#ffffff');
+      expect(literal.fillOpacity).to.be(0.8);
+    });
+
+  });
+
+  describe('#getColor()', function() {
+
+    it('returns the fill color', function() {
+      var symbolizer = new ol.style.Fill({
+        color: '#ff0000'
+      });
+
+      var color = symbolizer.getColor();
+      expect(color).to.be.a(ol.expr.Literal);
+      expect(color.getValue()).to.be('#ff0000');
+    });
+
+  });
+
+  describe('#getOpacity()', function() {
+
+    it('returns the fill opacity', function() {
+      var symbolizer = new ol.style.Fill({
+        color: '#ffffff',
+        opacity: 0.123
+      });
+
+      var opacity = symbolizer.getOpacity();
+      expect(opacity).to.be.a(ol.expr.Literal);
+      expect(opacity.getValue()).to.be(0.123);
+    });
+
+  });
+
+  describe('#setColor()', function() {
+
+    it('sets the fill color', function() {
+      var symbolizer = new ol.style.Fill({
+        color: '#ff0000'
+      });
+
+      symbolizer.setColor(new ol.expr.Literal('#0000ff'));
+
+      var color = symbolizer.getColor();
+      expect(color).to.be.a(ol.expr.Literal);
+      expect(color.getValue()).to.be('#0000ff');
+    });
+
+    it('throws when not provided an expression', function() {
+      var symbolizer = new ol.style.Fill({
+        color: '#ff0000'
+      });
+
+      expect(function() {
+        symbolizer.setColor('#0000ff');
+      }).throwException(function(err) {
+        expect(err).to.be.a(goog.asserts.AssertionError);
+      });
+    });
+
+  });
+
+  describe('#setOpacity()', function() {
+
+    it('sets the fill opacity', function() {
+      var symbolizer = new ol.style.Fill({
+        color: '#ff0000'
+      });
+
+      symbolizer.setOpacity(new ol.expr.Literal(0.321));
+
+      var opacity = symbolizer.getOpacity();
+      expect(opacity).to.be.a(ol.expr.Literal);
+      expect(opacity.getValue()).to.be(0.321);
+    });
+
+    it('throws when not provided an expression', function() {
+      var symbolizer = new ol.style.Fill({
+        color: '#ff0000'
+      });
+
+      expect(function() {
+        symbolizer.setOpacity(0.123);
+      }).throwException(function(err) {
+        expect(err).to.be.a(goog.asserts.AssertionError);
+      });
+    });
+
+  });
+
+});
+
+goog.require('goog.asserts.AssertionError');
+
+goog.require('ol.Feature');
+goog.require('ol.expr');
+goog.require('ol.expr.Literal');
+goog.require('ol.geom.GeometryType');
+goog.require('ol.style.Fill');
+goog.require('ol.style.PolygonLiteral');

test/spec/ol/style/iconsymbolizer.test.js

@@ -44,10 +44,12 @@ describe('ol.style.Icon', function() {
         widthAttr: 0.42,
         opacityAttr: 0.5,
         rotationAttr: 123,
-        urlAttr: 'http://example.com/1.png'
+        urlAttr: 'http://example.com/1.png',
+        geometry: new ol.geom.Point([1, 2])
       });
 
-      var literal = symbolizer.createLiteral(feature);
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT,
+          feature);
       expect(literal).to.be.a(ol.style.IconLiteral);
       expect(literal.height).to.be(42);
       expect(literal.width).to.be(.42);
@@ -65,7 +67,7 @@ describe('ol.style.Icon', function() {
         url: ol.expr.parse('"http://example.com/1.png"')
       });
 
-      var literal = symbolizer.createLiteral();
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
       expect(literal).to.be.a(ol.style.IconLiteral);
       expect(literal.height).to.be(10);
       expect(literal.width).to.be(20);
@@ -81,7 +83,7 @@ describe('ol.style.Icon', function() {
         url: ol.expr.parse('"http://example.com/1.png"')
       });
 
-      var literal = symbolizer.createLiteral();
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
       expect(literal).to.be.a(ol.style.IconLiteral);
       expect(literal.opacity).to.be(1);
       expect(literal.rotation).to.be(0);
@@ -331,5 +333,7 @@ goog.require('goog.asserts.AssertionError');
 goog.require('ol.Feature');
 goog.require('ol.expr');
 goog.require('ol.expr.Literal');
+goog.require('ol.geom.GeometryType');
+goog.require('ol.geom.Point');
 goog.require('ol.style.Icon');
 goog.require('ol.style.IconLiteral');

test/spec/ol/style/linesymbolizer.test.js

@@ -1,178 +0,0 @@
-goog.provide('ol.test.style.Line');
-
-describe('ol.style.Line', function() {
-
-  describe('constructor', function() {
-
-    it('accepts literal values', function() {
-      var symbolizer = new ol.style.Line({
-        strokeColor: '#BADA55',
-        strokeWidth: 3
-      });
-      expect(symbolizer).to.be.a(ol.style.Line);
-    });
-
-    it('accepts expressions', function() {
-      var symbolizer = new ol.style.Line({
-        strokeOpacity: ol.expr.parse('value / 100'),
-        strokeWidth: ol.expr.parse('widthAttr')
-      });
-      expect(symbolizer).to.be.a(ol.style.Line);
-    });
-
-  });
-
-  describe('#createLiteral()', function() {
-
-    it('evaluates expressions with the given feature', function() {
-      var symbolizer = new ol.style.Line({
-        strokeOpacity: ol.expr.parse('value / 100'),
-        strokeWidth: ol.expr.parse('widthAttr')
-      });
-
-      var feature = new ol.Feature({
-        value: 42,
-        widthAttr: 1.5
-      });
-
-      var literal = symbolizer.createLiteral(feature);
-      expect(literal).to.be.a(ol.style.LineLiteral);
-      expect(literal.strokeOpacity).to.be(42 / 100);
-      expect(literal.strokeWidth).to.be(1.5);
-    });
-
-  });
-
-  describe('#getStrokeColor()', function() {
-
-    it('returns the stroke color', function() {
-      var symbolizer = new ol.style.Line({
-        strokeColor: '#ff0000'
-      });
-
-      var strokeColor = symbolizer.getStrokeColor();
-      expect(strokeColor).to.be.a(ol.expr.Literal);
-      expect(strokeColor.getValue()).to.be('#ff0000');
-    });
-
-  });
-
-  describe('#getStrokeWidth()', function() {
-
-    it('returns the stroke width', function() {
-      var symbolizer = new ol.style.Line({
-        strokeWidth: 10
-      });
-
-      var strokeWidth = symbolizer.getStrokeWidth();
-      expect(strokeWidth).to.be.a(ol.expr.Literal);
-      expect(strokeWidth.getValue()).to.be(10);
-    });
-
-  });
-
-  describe('#getStrokeOpacity()', function() {
-
-    it('returns the stroke opacity', function() {
-      var symbolizer = new ol.style.Line({
-        strokeOpacity: 0.123
-      });
-
-      var opacity = symbolizer.getStrokeOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.123);
-    });
-
-  });
-
-  describe('#setStrokeColor()', function() {
-
-    it('sets the stroke color', function() {
-      var symbolizer = new ol.style.Line({
-        strokeColor: '#ff0000'
-      });
-
-      symbolizer.setStrokeColor(new ol.expr.Literal('#0000ff'));
-
-      var strokeColor = symbolizer.getStrokeColor();
-      expect(strokeColor).to.be.a(ol.expr.Literal);
-      expect(strokeColor.getValue()).to.be('#0000ff');
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Line({
-        strokeColor: '#ff0000'
-      });
-
-      expect(function() {
-        symbolizer.setStrokeColor('#0000ff');
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-  describe('#setStrokeWidth()', function() {
-
-    it('sets the stroke width', function() {
-      var symbolizer = new ol.style.Line({
-        strokeWidth: 10
-      });
-      symbolizer.setStrokeWidth(new ol.expr.Literal(20));
-
-      var strokeWidth = symbolizer.getStrokeWidth();
-      expect(strokeWidth).to.be.a(ol.expr.Literal);
-      expect(strokeWidth.getValue()).to.be(20);
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Line({
-        strokeWidth: 10
-      });
-
-      expect(function() {
-        symbolizer.setStrokeWidth(10);
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-  describe('#setStrokeOpacity()', function() {
-
-    it('sets the stroke opacity', function() {
-      var symbolizer = new ol.style.Line({
-        strokeOpacity: 0.123
-      });
-      symbolizer.setStrokeOpacity(new ol.expr.Literal(0.321));
-
-      var opacity = symbolizer.getStrokeOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.321);
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Line({
-        strokeOpacity: 1
-      });
-
-      expect(function() {
-        symbolizer.setStrokeOpacity(0.5);
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-});
-
-goog.require('goog.asserts.AssertionError');
-
-goog.require('ol.Feature');
-goog.require('ol.expr');
-goog.require('ol.expr.Literal');
-goog.require('ol.style.Line');
-goog.require('ol.style.LineLiteral');

test/spec/ol/style/polygonsymbolizer.test.js

@@ -1,251 +0,0 @@
-goog.provide('ol.test.style.Polygon');
-
-describe('ol.style.Polygon', function() {
-
-  describe('constructor', function() {
-
-    it('accepts literal values', function() {
-      var symbolizer = new ol.style.Polygon({
-        fillColor: '#BADA55',
-        strokeWidth: 3
-      });
-      expect(symbolizer).to.be.a(ol.style.Polygon);
-    });
-
-    it('accepts expressions', function() {
-      var symbolizer = new ol.style.Polygon({
-        fillOpacity: ol.expr.parse('value / 100'),
-        fillColor: ol.expr.parse('fillAttr')
-      });
-      expect(symbolizer).to.be.a(ol.style.Polygon);
-    });
-
-  });
-
-  describe('#createLiteral()', function() {
-
-    it('evaluates expressions with the given feature', function() {
-      var symbolizer = new ol.style.Polygon({
-        fillOpacity: ol.expr.parse('value / 100'),
-        fillColor: ol.expr.parse('fillAttr')
-      });
-
-      var feature = new ol.Feature({
-        value: 42,
-        fillAttr: '#ff0000'
-      });
-
-      var literal = symbolizer.createLiteral(feature);
-      expect(literal).to.be.a(ol.style.PolygonLiteral);
-      expect(literal.fillOpacity).to.be(42 / 100);
-      expect(literal.fillColor).to.be('#ff0000');
-      expect(literal.strokeColor).to.be(undefined);
-    });
-
-    it('applies default strokeWidth if only strokeColor is given', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeColor: '#ff0000'
-      });
-
-      var literal = symbolizer.createLiteral();
-      expect(literal).to.be.a(ol.style.PolygonLiteral);
-      expect(literal.strokeColor).to.be('#ff0000');
-      expect(literal.strokeWidth).to.be(1.5);
-      expect(literal.fillColor).to.be(undefined);
-    });
-
-  });
-
-  describe('#getFillColor()', function() {
-
-    it('returns the fill color', function() {
-      var symbolizer = new ol.style.Polygon({
-        fillColor: '#ff0000'
-      });
-
-      var fillColor = symbolizer.getFillColor();
-      expect(fillColor).to.be.a(ol.expr.Literal);
-      expect(fillColor.getValue()).to.be('#ff0000');
-    });
-
-  });
-
-  describe('#getFillOpacity()', function() {
-
-    it('returns the fill opacity', function() {
-      var symbolizer = new ol.style.Polygon({
-        fillColor: '#ffffff',
-        fillOpacity: 0.123
-      });
-
-      var opacity = symbolizer.getFillOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.123);
-    });
-
-  });
-
-  describe('#getStrokeColor()', function() {
-
-    it('returns the stroke color', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeColor: '#ff0000'
-      });
-
-      var strokeColor = symbolizer.getStrokeColor();
-      expect(strokeColor).to.be.a(ol.expr.Literal);
-      expect(strokeColor.getValue()).to.be('#ff0000');
-    });
-
-  });
-
-  describe('#getStrokeWidth()', function() {
-
-    it('returns the stroke width', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeWidth: 10
-      });
-
-      var strokeWidth = symbolizer.getStrokeWidth();
-      expect(strokeWidth).to.be.a(ol.expr.Literal);
-      expect(strokeWidth.getValue()).to.be(10);
-    });
-
-  });
-
-  describe('#getStrokeOpacity()', function() {
-
-    it('returns the stroke opacity', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeWidth: 1,
-        strokeOpacity: 0.123
-      });
-
-      var opacity = symbolizer.getStrokeOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.123);
-    });
-
-  });
-
-  describe('#setFillColor()', function() {
-
-    it('sets the fill color', function() {
-      var symbolizer = new ol.style.Polygon({
-        fillColor: '#ff0000'
-      });
-
-      symbolizer.setFillColor(new ol.expr.Literal('#0000ff'));
-
-      var fillColor = symbolizer.getFillColor();
-      expect(fillColor).to.be.a(ol.expr.Literal);
-      expect(fillColor.getValue()).to.be('#0000ff');
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Polygon({
-        fillColor: '#ff0000'
-      });
-
-      expect(function() {
-        symbolizer.setFillColor('#0000ff');
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-  describe('#setStrokeColor()', function() {
-
-    it('sets the stroke color', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeColor: '#ff0000'
-      });
-
-      symbolizer.setStrokeColor(new ol.expr.Literal('#0000ff'));
-
-      var strokeColor = symbolizer.getStrokeColor();
-      expect(strokeColor).to.be.a(ol.expr.Literal);
-      expect(strokeColor.getValue()).to.be('#0000ff');
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeColor: '#ff0000'
-      });
-
-      expect(function() {
-        symbolizer.setStrokeColor('#0000ff');
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-  describe('#setStrokeWidth()', function() {
-
-    it('sets the stroke width', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeWidth: 10
-      });
-      symbolizer.setStrokeWidth(new ol.expr.Literal(20));
-
-      var strokeWidth = symbolizer.getStrokeWidth();
-      expect(strokeWidth).to.be.a(ol.expr.Literal);
-      expect(strokeWidth.getValue()).to.be(20);
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeWidth: 10
-      });
-
-      expect(function() {
-        symbolizer.setStrokeWidth(10);
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-  describe('#setStrokeOpacity()', function() {
-
-    it('sets the stroke opacity', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeWidth: 1,
-        strokeOpacity: 0.123
-      });
-      symbolizer.setStrokeOpacity(new ol.expr.Literal(0.321));
-
-      var opacity = symbolizer.getStrokeOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.321);
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Polygon({
-        strokeWidth: 1,
-        strokeOpacity: 1
-      });
-
-      expect(function() {
-        symbolizer.setStrokeOpacity(0.5);
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-});
-
-goog.require('goog.asserts.AssertionError');
-
-goog.require('ol.Feature');
-goog.require('ol.expr');
-goog.require('ol.expr.Literal');
-goog.require('ol.style.Polygon');
-goog.require('ol.style.PolygonLiteral');

test/spec/ol/style/shapesymbolizer.test.js

@@ -7,7 +7,9 @@ describe('ol.style.Shape', function() {
     it('accepts literal values', function() {
       var symbolizer = new ol.style.Shape({
         size: 4,
-        fillColor: '#BADA55'
+        fill: new ol.style.Fill({
+          color: '#ff0000'
+        })
       });
       expect(symbolizer).to.be.a(ol.style.Shape);
     });
@@ -15,7 +17,9 @@ describe('ol.style.Shape', function() {
     it('accepts expressions', function() {
       var symbolizer = new ol.style.Shape({
         size: ol.expr.parse('sizeAttr'),
-        strokeColor: ol.expr.parse('color')
+        stroke: new ol.style.Stroke({
+          color: ol.expr.parse('color')
+        })
       });
       expect(symbolizer).to.be.a(ol.style.Shape);
     });
@@ -27,16 +31,20 @@ describe('ol.style.Shape', function() {
     it('evaluates expressions with the given feature', function() {
       var symbolizer = new ol.style.Shape({
         size: ol.expr.parse('sizeAttr'),
-        fillOpacity: ol.expr.parse('opacityAttr'),
+        fill: new ol.style.Fill({
-        fillColor: '#BADA55'
+          opacity: ol.expr.parse('opacityAttr'),
+          color: '#BADA55'
+        })
       });
 
       var feature = new ol.Feature({
         sizeAttr: 42,
-        opacityAttr: 0.4
+        opacityAttr: 0.4,
+        geometry: new ol.geom.Point([1, 2])
       });
 
-      var literal = symbolizer.createLiteral(feature);
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT,
+          feature);
       expect(literal).to.be.a(ol.style.ShapeLiteral);
       expect(literal.size).to.be(42);
       expect(literal.fillOpacity).to.be(0.4);
@@ -45,13 +53,17 @@ describe('ol.style.Shape', function() {
     it('can be called without a feature', function() {
       var symbolizer = new ol.style.Shape({
         size: 10,
-        fillColor: '#BADA55',
+        fill: new ol.style.Fill({
-        strokeColor: '#013',
+          color: '#BADA55'
-        strokeOpacity: 1,
+        }),
-        strokeWidth: 2
+        stroke: new ol.style.Stroke({
+          color: '#013',
+          opacity: 1,
+          width: 2
+        })
       });
 
-      var literal = symbolizer.createLiteral();
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
       expect(literal).to.be.a(ol.style.ShapeLiteral);
       expect(literal.size).to.be(10);
       expect(literal.fillColor).to.be('#BADA55');
@@ -62,93 +74,32 @@ describe('ol.style.Shape', function() {
 
   });
 
-  describe('#getFillColor()', function() {
+  describe('#getFill()', function() {
 
-    it('returns the fill color', function() {
+    it('returns the fill', function() {
       var symbolizer = new ol.style.Shape({
-        fillColor: '#ff0000'
+        fill: new ol.style.Fill({
+          color: '#ff0000'
+        })
       });
 
-      var fillColor = symbolizer.getFillColor();
+      var fill = symbolizer.getFill();
-      expect(fillColor).to.be.a(ol.expr.Literal);
+      expect(fill).to.be.a(ol.style.Fill);
-      expect(fillColor.getValue()).to.be('#ff0000');
     });
 
   });
 
-  describe('#getFillOpacity()', function() {
+  describe('#getStroke()', function() {
 
-    it('returns the fill opacity', function() {
+    it('returns the stroke', function() {
       var symbolizer = new ol.style.Shape({
-        fillOpacity: 0.123
+        stroke: new ol.style.Stroke({
+          color: '#ff0000'
+        })
       });
 
-      var opacity = symbolizer.getFillOpacity();
+      var stroke = symbolizer.getStroke();
-      expect(opacity).to.be.a(ol.expr.Literal);
+      expect(stroke).to.be.a(ol.style.Stroke);
-      expect(opacity.getValue()).to.be(0.123);
-    });
-
-    it('returns the default if none provided', function() {
-      var symbolizer = new ol.style.Shape({
-        fillColor: '#ffffff'
-      });
-
-      var opacity = symbolizer.getFillOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.4);
-    });
-
-  });
-
-  describe('#getStrokeColor()', function() {
-
-    it('returns the stroke color', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeColor: '#ff0000'
-      });
-
-      var strokeColor = symbolizer.getStrokeColor();
-      expect(strokeColor).to.be.a(ol.expr.Literal);
-      expect(strokeColor.getValue()).to.be('#ff0000');
-    });
-
-  });
-
-  describe('#getStrokeOpacity()', function() {
-
-    it('returns the stroke opacity', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeWidth: 1,
-        strokeOpacity: 0.123
-      });
-
-      var opacity = symbolizer.getStrokeOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.123);
-    });
-
-    it('returns the default if none provided', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeWidth: 1
-      });
-
-      var opacity = symbolizer.getStrokeOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.8);
-    });
-
-  });
-
-  describe('#getStrokeWidth()', function() {
-
-    it('returns the stroke width', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeWidth: 10
-      });
-
-      var strokeWidth = symbolizer.getStrokeWidth();
-      expect(strokeWidth).to.be.a(ol.expr.Literal);
-      expect(strokeWidth.getValue()).to.be(10);
     });
 
   });
@@ -157,8 +108,10 @@ describe('ol.style.Shape', function() {
 
     it('returns the shape type', function() {
       var symbolizer = new ol.style.Shape({
-        strokeWidth: 1,
+        stroke: new ol.style.Stroke({
+          width: 1,
           opacity: 0.123
+        })
       });
 
       var type = symbolizer.getType();
@@ -167,27 +120,25 @@ describe('ol.style.Shape', function() {
 
   });
 
-  describe('#setFillColor()', function() {
+  describe('#setFill()', function() {
 
-    it('sets the fill color', function() {
+    it('sets the fill', function() {
       var symbolizer = new ol.style.Shape({
-        fillColor: '#ff0000'
+        stroke: new ol.style.Stroke({color: '#ff0000'})
+      });
+      expect(symbolizer.getFill()).to.be(null);
+
+      symbolizer.setFill(new ol.style.Fill({color: '#0000ff'}));
+      expect(symbolizer.getFill()).to.be.a(ol.style.Fill);
     });
 
-      symbolizer.setFillColor(new ol.expr.Literal('#0000ff'));
+    it('throws when not provided a fill', function() {
-
-      var fillColor = symbolizer.getFillColor();
-      expect(fillColor).to.be.a(ol.expr.Literal);
-      expect(fillColor.getValue()).to.be('#0000ff');
-    });
-
-    it('throws when not provided an expression', function() {
       var symbolizer = new ol.style.Shape({
-        fillColor: '#ff0000'
+        fill: new ol.style.Fill({color: '#ff0000'})
       });
 
       expect(function() {
-        symbolizer.setFillColor('#0000ff');
+        symbolizer.setFill('#0000ff');
       }).throwException(function(err) {
         expect(err).to.be.a(goog.asserts.AssertionError);
       });
@@ -195,111 +146,25 @@ describe('ol.style.Shape', function() {
 
   });
 
-  describe('#setFillOpacity()', function() {
+  describe('#setStroke()', function() {
 
-    it('sets the fill opacity', function() {
+    it('sets the stroke', function() {
       var symbolizer = new ol.style.Shape({
-        fillOpacity: 0.5
+        fill: new ol.style.Fill({color: '#ff0000'})
+      });
+      expect(symbolizer.getStroke()).to.be(null);
+
+      symbolizer.setStroke(new ol.style.Stroke({color: '#0000ff'}));
+      expect(symbolizer.getStroke()).to.be.a(ol.style.Stroke);
     });
 
-      symbolizer.setFillOpacity(new ol.expr.Literal(0.6));
+    it('throws when not provided a stroke', function() {
-
-      var fillOpacity = symbolizer.getFillOpacity();
-      expect(fillOpacity).to.be.a(ol.expr.Literal);
-      expect(fillOpacity.getValue()).to.be(0.6);
-    });
-
-    it('throws when not provided an expression', function() {
       var symbolizer = new ol.style.Shape({
-        fillOpacity: 0.5
+        stroke: new ol.style.Stroke({color: '#ff0000'})
       });
 
       expect(function() {
-        symbolizer.setFillOpacity(0.4);
+        symbolizer.setStroke('#0000ff');
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-  describe('#setStrokeColor()', function() {
-
-    it('sets the stroke color', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeColor: '#ff0000'
-      });
-
-      symbolizer.setStrokeColor(new ol.expr.Literal('#0000ff'));
-
-      var strokeColor = symbolizer.getStrokeColor();
-      expect(strokeColor).to.be.a(ol.expr.Literal);
-      expect(strokeColor.getValue()).to.be('#0000ff');
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeColor: '#ff0000'
-      });
-
-      expect(function() {
-        symbolizer.setStrokeColor('#0000ff');
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-  describe('#setStrokeOpacity()', function() {
-
-    it('sets the stroke opacity', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeWidth: 1,
-        strokeOpacity: 0.123
-      });
-      symbolizer.setStrokeOpacity(new ol.expr.Literal(0.321));
-
-      var opacity = symbolizer.getStrokeOpacity();
-      expect(opacity).to.be.a(ol.expr.Literal);
-      expect(opacity.getValue()).to.be(0.321);
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeWidth: 1,
-        strokeOpacity: 1
-      });
-
-      expect(function() {
-        symbolizer.setStrokeOpacity(0.5);
-      }).throwException(function(err) {
-        expect(err).to.be.a(goog.asserts.AssertionError);
-      });
-    });
-
-  });
-
-  describe('#setStrokeWidth()', function() {
-
-    it('sets the stroke width', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeWidth: 10
-      });
-      symbolizer.setStrokeWidth(new ol.expr.Literal(20));
-
-      var strokeWidth = symbolizer.getStrokeWidth();
-      expect(strokeWidth).to.be.a(ol.expr.Literal);
-      expect(strokeWidth.getValue()).to.be(20);
-    });
-
-    it('throws when not provided an expression', function() {
-      var symbolizer = new ol.style.Shape({
-        strokeWidth: 10
-      });
-
-      expect(function() {
-        symbolizer.setStrokeWidth(10);
       }).throwException(function(err) {
         expect(err).to.be.a(goog.asserts.AssertionError);
       });
@@ -311,8 +176,10 @@ describe('ol.style.Shape', function() {
 
     it('sets the shape type', function() {
       var symbolizer = new ol.style.Shape({
-        strokeWidth: 1,
+        stroke: new ol.style.Stroke({
+          width: 1,
           opacity: 0.123
+        })
       });
       symbolizer.setType(ol.style.ShapeType.CIRCLE);
 
@@ -327,8 +194,12 @@ describe('ol.style.Shape', function() {
 goog.require('goog.asserts.AssertionError');
 
 goog.require('ol.Feature');
+goog.require('ol.geom.GeometryType');
+goog.require('ol.geom.Point');
 goog.require('ol.expr');
 goog.require('ol.expr.Literal');
+goog.require('ol.style.Fill');
 goog.require('ol.style.Shape');
 goog.require('ol.style.ShapeLiteral');
 goog.require('ol.style.ShapeType');
+goog.require('ol.style.Stroke');

test/spec/ol/style/strokesymbolizer.test.js

@@ -0,0 +1,190 @@
+goog.provide('ol.test.style.Stroke');
+
+describe('ol.style.Stroke', function() {
+
+  describe('constructor', function() {
+
+    it('accepts literal values', function() {
+      var symbolizer = new ol.style.Stroke({
+        color: '#BADA55',
+        width: 3
+      });
+      expect(symbolizer).to.be.a(ol.style.Stroke);
+    });
+
+    it('accepts expressions', function() {
+      var symbolizer = new ol.style.Stroke({
+        opacity: ol.expr.parse('value / 100'),
+        width: ol.expr.parse('widthAttr')
+      });
+      expect(symbolizer).to.be.a(ol.style.Stroke);
+    });
+
+  });
+
+  describe('#createLiteral()', function() {
+
+    it('evaluates expressions with the given feature', function() {
+      var symbolizer = new ol.style.Stroke({
+        opacity: ol.expr.parse('value / 100'),
+        width: ol.expr.parse('widthAttr')
+      });
+
+      var feature = new ol.Feature({
+        value: 42,
+        widthAttr: 1.5
+      });
+
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.LINESTRING,
+          feature);
+      expect(literal).to.be.a(ol.style.LineLiteral);
+      expect(literal.strokeOpacity).to.be(42 / 100);
+      expect(literal.strokeWidth).to.be(1.5);
+    });
+
+    it('applies the default values', function() {
+      var symbolizer = new ol.style.Stroke({});
+
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.LINESTRING);
+      expect(literal).to.be.a(ol.style.LineLiteral);
+      expect(literal.strokeColor).to.be('#696969');
+      expect(literal.strokeOpacity).to.be(0.75);
+      expect(literal.strokeWidth).to.be(1.5);
+    });
+
+  });
+
+  describe('#getColor()', function() {
+
+    it('returns the stroke color', function() {
+      var symbolizer = new ol.style.Stroke({
+        color: '#ff0000'
+      });
+
+      var color = symbolizer.getColor();
+      expect(color).to.be.a(ol.expr.Literal);
+      expect(color.getValue()).to.be('#ff0000');
+    });
+
+  });
+
+  describe('#getWidth()', function() {
+
+    it('returns the stroke width', function() {
+      var symbolizer = new ol.style.Stroke({
+        width: 10
+      });
+
+      var width = symbolizer.getWidth();
+      expect(width).to.be.a(ol.expr.Literal);
+      expect(width.getValue()).to.be(10);
+    });
+
+  });
+
+  describe('#getOpacity()', function() {
+
+    it('returns the stroke opacity', function() {
+      var symbolizer = new ol.style.Stroke({
+        opacity: 0.123
+      });
+
+      var opacity = symbolizer.getOpacity();
+      expect(opacity).to.be.a(ol.expr.Literal);
+      expect(opacity.getValue()).to.be(0.123);
+    });
+
+  });
+
+  describe('#setColor()', function() {
+
+    it('sets the stroke color', function() {
+      var symbolizer = new ol.style.Stroke({
+        color: '#ff0000'
+      });
+
+      symbolizer.setColor(new ol.expr.Literal('#0000ff'));
+
+      var color = symbolizer.getColor();
+      expect(color).to.be.a(ol.expr.Literal);
+      expect(color.getValue()).to.be('#0000ff');
+    });
+
+    it('throws when not provided an expression', function() {
+      var symbolizer = new ol.style.Stroke({
+        color: '#ff0000'
+      });
+
+      expect(function() {
+        symbolizer.setColor('#0000ff');
+      }).throwException(function(err) {
+        expect(err).to.be.a(goog.asserts.AssertionError);
+      });
+    });
+
+  });
+
+  describe('#setWidth()', function() {
+
+    it('sets the stroke width', function() {
+      var symbolizer = new ol.style.Stroke({
+        width: 10
+      });
+      symbolizer.setWidth(new ol.expr.Literal(20));
+
+      var width = symbolizer.getWidth();
+      expect(width).to.be.a(ol.expr.Literal);
+      expect(width.getValue()).to.be(20);
+    });
+
+    it('throws when not provided an expression', function() {
+      var symbolizer = new ol.style.Stroke({
+        width: 10
+      });
+
+      expect(function() {
+        symbolizer.setWidth(10);
+      }).throwException(function(err) {
+        expect(err).to.be.a(goog.asserts.AssertionError);
+      });
+    });
+
+  });
+
+  describe('#setOpacity()', function() {
+
+    it('sets the stroke opacity', function() {
+      var symbolizer = new ol.style.Stroke({
+        opacity: 0.123
+      });
+      symbolizer.setOpacity(new ol.expr.Literal(0.321));
+
+      var opacity = symbolizer.getOpacity();
+      expect(opacity).to.be.a(ol.expr.Literal);
+      expect(opacity.getValue()).to.be(0.321);
+    });
+
+    it('throws when not provided an expression', function() {
+      var symbolizer = new ol.style.Stroke({
+        opacity: 1
+      });
+
+      expect(function() {
+        symbolizer.setOpacity(0.5);
+      }).throwException(function(err) {
+        expect(err).to.be.a(goog.asserts.AssertionError);
+      });
+    });
+
+  });
+
+});
+
+goog.require('goog.asserts.AssertionError');
+
+goog.require('ol.Feature');
+goog.require('ol.expr');
+goog.require('ol.expr.Literal');
+goog.require('ol.geom.GeometryType');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.LineLiteral');

test/spec/ol/style/style.test.js

@@ -13,13 +13,15 @@ describe('ol.style.Style', function() {
             symbolizers: [
               new ol.style.Shape({
                 size: 4,
-                fillColor: '#BADA55'
+                fill: new ol.style.Fill({color: '#BADA55'})
               })
             ]
           })
         ]
       });
-      var feature = new ol.Feature();
+      var feature = new ol.Feature({
+        geometry: new ol.geom.Point([1, 2])
+      });
       feature.set('foo', 'bar');
       expect(style.apply(feature).length).to.be(1);
       expect(style.apply(feature)[0].fillColor).to.be('#BADA55');
@@ -38,27 +40,51 @@ describe('ol.style.Style', function() {
 
     it('returns an array with the Shape default for points', function() {
       feature.setGeometry(new ol.geom.Point([0, 0]));
-      var symbolizers = ol.style.Style.applyDefaultStyle(feature);
+
-      expect(symbolizers.length).to.be(1);
+      var literals = ol.style.Style.applyDefaultStyle(feature);
-      expect(symbolizers[0]).to.be.a(ol.style.ShapeLiteral);
+      expect(literals).to.have.length(1);
-      expect(symbolizers[0].equals(ol.style.ShapeDefaults)).to.be(true);
+
+      var literal = literals[0];
+      expect(literal).to.be.a(ol.style.ShapeLiteral);
+      expect(literal.type).to.be(ol.style.ShapeDefaults.type);
+      expect(literal.fillColor).to.be(ol.style.FillDefaults.color);
+      expect(literal.fillOpacity).to.be(ol.style.FillDefaults.opacity);
+      expect(literal.strokeColor).to.be(ol.style.StrokeDefaults.color);
+      expect(literal.strokeOpacity).to.be(ol.style.StrokeDefaults.opacity);
+      expect(literal.strokeWidth).to.be(ol.style.StrokeDefaults.width);
     });
 
     it('returns an array with the Line default for lines', function() {
       feature.setGeometry(new ol.geom.LineString([[0, 0], [1, 1]]));
-      expect(ol.style.Style.applyDefaultStyle(feature)[0]
+
-          .equals(ol.style.LineDefaults)).to.be(true);
+      var literals = ol.style.Style.applyDefaultStyle(feature);
+      expect(literals).to.have.length(1);
+
+      var literal = literals[0];
+      expect(literal).to.be.a(ol.style.LineLiteral);
+      expect(literal.strokeColor).to.be(ol.style.StrokeDefaults.color);
+      expect(literal.strokeOpacity).to.be(ol.style.StrokeDefaults.opacity);
+      expect(literal.strokeWidth).to.be(ol.style.StrokeDefaults.width);
     });
 
     it('returns an array with the Polygon default for polygons', function() {
       feature.setGeometry(new ol.geom.Polygon([[[0, 0], [1, 1], [0, 0]]]));
-      expect(ol.style.Style.applyDefaultStyle(feature)[0]
+
-          .equals(ol.style.PolygonDefaults)).to.be(true);
+      var literals = ol.style.Style.applyDefaultStyle(feature);
+      expect(literals).to.have.length(1);
+
+      var literal = literals[0];
+      expect(literal).to.be.a(ol.style.PolygonLiteral);
+      expect(literal.fillColor).to.be(ol.style.FillDefaults.color);
+      expect(literal.fillOpacity).to.be(ol.style.FillDefaults.opacity);
+      expect(literal.strokeColor).to.be(ol.style.StrokeDefaults.color);
+      expect(literal.strokeOpacity).to.be(ol.style.StrokeDefaults.opacity);
+      expect(literal.strokeWidth).to.be(ol.style.StrokeDefaults.width);
     });
 
   });
 
-  describe('#reduceLiterals', function() {
+  describe('#reduceLiterals_', function() {
 
     it('collapses stroke or fill only literals where possible', function() {
       var literals = [
@@ -73,7 +99,7 @@ describe('ol.style.Style', function() {
         })
       ];
 
-      var reduced = ol.style.Style.reduceLiterals(literals);
+      var reduced = ol.style.Style.reduceLiterals_(literals);
       expect(reduced).to.have.length(1);
 
       var poly = reduced[0];
@@ -100,7 +126,7 @@ describe('ol.style.Style', function() {
         })
       ];
 
-      var reduced = ol.style.Style.reduceLiterals(literals);
+      var reduced = ol.style.Style.reduceLiterals_(literals);
       expect(reduced).to.have.length(2);
 
       var first = reduced[0];
@@ -138,7 +164,7 @@ describe('ol.style.Style', function() {
         })
       ];
 
-      var reduced = ol.style.Style.reduceLiterals(literals);
+      var reduced = ol.style.Style.reduceLiterals_(literals);
       expect(reduced).to.have.length(2);
 
       var first = reduced[0];

test/spec/ol/style/textsymbolizer.test.js

@@ -47,7 +47,8 @@ describe('ol.style.Text', function() {
         opacityAttr: 0.4
       });
 
-      var literal = symbolizer.createLiteral(feature);
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT,
+          feature);
       expect(literal).to.be.a(ol.style.TextLiteral);
       expect(literal.color).to.be('#ff0000');
       expect(literal.fontFamily).to.be('Dingbats');
@@ -65,7 +66,7 @@ describe('ol.style.Text', function() {
         opacity: ol.expr.parse('0.6')
       });
 
-      var literal = symbolizer.createLiteral();
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
       expect(literal).to.be.a(ol.style.TextLiteral);
       expect(literal.color).to.be('#ff0000');
       expect(literal.fontFamily).to.be('Arial');
@@ -79,7 +80,7 @@ describe('ol.style.Text', function() {
         text: 'Test'
       });
 
-      var literal = symbolizer.createLiteral();
+      var literal = symbolizer.createLiteral(ol.geom.GeometryType.POINT);
       expect(literal).to.be.a(ol.style.TextLiteral);
       expect(literal.color).to.be('#000');
       expect(literal.fontFamily).to.be('sans-serif');
@@ -297,5 +298,6 @@ goog.require('ol.Feature');
 goog.require('ol.expr');
 goog.require('ol.expr.Literal');
 goog.require('ol.expr.Literal');
+goog.require('ol.geom.GeometryType');
 goog.require('ol.style.Text');
 goog.require('ol.style.TextLiteral');