diff --git a/src/ol/parser/kml.js b/src/ol/parser/kml.js
index ba2025e3fc..7242762bea 100644
--- a/src/ol/parser/kml.js
+++ b/src/ol/parser/kml.js
@@ -353,30 +353,31 @@ ol.parser.KML = function(opt_options) {
obj['symbolizers'].push(new ol.style.Line(symbolizer));
},
'PolyStyle': function(node, obj) {
- var symbolizer = {};
- this.readChildNodes(node, symbolizer);
- if (symbolizer.color) {
- symbolizer.fillColor = symbolizer.color.color;
+ var style = {}; // from KML
+ var symbolizer = {}; // for ol.style.Polygon
+ this.readChildNodes(node, style);
+ // check if poly has fill
+ if (!(style.fill === '0' || style.fill === 'false')) {
+ if (style.color) {
+ symbolizer.fillColor = style.color.color;
+ symbolizer.fillOpacity = style.color.opacity;
+ } else {
+ // KML defaults
+ symbolizer.fillColor = '#ffffff';
+ symbolizer.fillOpacity = 1;
+ }
}
- if (symbolizer.fill === '0' || symbolizer.fill === 'false') {
- // TODO we need a better way in the symbolizer to disable fill
- // now we are using opacity for this, but it's a workaround
- // see also: https://github.com/openlayers/ol3/issues/475
- symbolizer.opacity = 0;
- } else {
- symbolizer.opacity = symbolizer.color.opacity;
+ // check if poly has stroke
+ if (!(style.outline === '0' || style.outline === 'false')) {
+ if (style.color) {
+ symbolizer.strokeColor = style.color.color;
+ symbolizer.strokeOpacity = style.color.opacity;
+ } else {
+ // KML defaults
+ symbolizer.strokeColor = '#ffffff';
+ symbolizer.strokeOpacity = 1;
+ }
}
- if (symbolizer.width) {
- symbolizer.strokeWidth = parseFloat(symbolizer.width);
- }
- // outline disabled
- if (symbolizer.outline === '0' || symbolizer.outline === 'false') {
- symbolizer.strokeWidth = 0;
- }
- delete symbolizer.outline;
- delete symbolizer.width;
- delete symbolizer.color;
- delete symbolizer.fill;
obj['ids'].push(node.getAttribute('id'));
obj['symbolizers'].push(new ol.style.Polygon(symbolizer));
},
@@ -623,6 +624,11 @@ ol.parser.KML = function(opt_options) {
}
},
'PolyStyle': function(symbolizerObj) {
+ /**
+ * There is not a 1:1 mapping between KML PolyStyle and
+ * ol.style.Polygon. In KML, if a PolyStyle has 1
+ * then the "current" LineStyle is used to stroke the polygon.
+ */
var node = this.createElementNS('PolyStyle');
if (symbolizerObj.id) {
this.setAttributeNS(node, null, 'id', symbolizerObj.id);
@@ -630,16 +636,27 @@ ol.parser.KML = function(opt_options) {
var symbolizer = symbolizerObj.symbolizer;
var literal = symbolizer instanceof ol.style.PolygonLiteral ?
symbolizer : symbolizer.createLiteral();
- if (literal.opacity !== 0) {
+ var color, opacity;
+ if (literal.fillOpacity !== 0) {
this.writeNode('fill', '1', null, node);
+ color = literal.fillColor;
+ opacity = literal.fillOpacity;
} else {
this.writeNode('fill', '0', null, node);
}
- this.writeNode('color', {
- color: literal.fillColor.substring(1),
- opacity: literal.opacity
- }, null, node);
- this.writeNode('width', literal.strokeWidth, null, node);
+ if (literal.strokeOpacity) {
+ this.writeNode('outline', '1', null, node);
+ color = color || literal.strokeColor;
+ opacity = opacity || literal.strokeOpacity;
+ } else {
+ this.writeNode('outline', '0', null, node);
+ }
+ if (color && opacity) {
+ this.writeNode('color', {
+ color: color.substring(1),
+ opacity: opacity
+ }, null, node);
+ }
return node;
},
'fill': function(fill) {
@@ -647,6 +664,11 @@ ol.parser.KML = function(opt_options) {
node.appendChild(this.createTextNode(fill));
return node;
},
+ 'outline': function(outline) {
+ var node = this.createElementNS('outline');
+ node.appendChild(this.createTextNode(outline));
+ return node;
+ },
'LineStyle': function(symbolizerObj) {
var node = this.createElementNS('LineStyle');
if (symbolizerObj.id) {
diff --git a/test/spec/ol/parser/kml.test.js b/test/spec/ol/parser/kml.test.js
index d4d310c741..694e222a86 100644
--- a/test/spec/ol/parser/kml.test.js
+++ b/test/spec/ol/parser/kml.test.js
@@ -185,42 +185,46 @@ describe('ol.parser.kml', function() {
expect(symbolizer.strokeOpacity).to.eql(0.5294117647058824);
expect(symbolizer.strokeWidth).to.eql(10);
});
- it('Test style fill (read / write)', function() {
- var test_style_fill = '' +
+ it('reads PolyStyle fill', function() {
+ var kml = '' +
' ' +
+ '870000ff ' +
'' +
'5.001370157823406,49.26855713824488 8.214706453896161,' +
'49.630662409673505 8.397385910100951,48.45172350357396 ' +
'5.001370157823406,49.26855713824488' +
' ' +
'' +
'5.001370157823406,49.26855713824488 8.214706453896161,' +
'49.630662409673505 8.397385910100951,48.45172350357396 ' +
'5.001370157823406,49.26855713824488' +
'';
- var style_fill_write = ' ' +
- ' ' +
+ '' +
'' +
'5.001370157823406,49.26855713824488 8.214706453896161,' +
'49.630662409673505 8.397385910100951,48.45172350357396 ' +
'5.001370157823406,49.26855713824488' +
'';
var p = new ol.parser.KML({extractStyles: true});
- var obj = p.read(test_style_fill);
- var output = p.write(p.read(style_fill_write));
- expect(goog.dom.xml.loadXml(style_fill_write)).to.xmleql(
+ var output = p.write(p.read(kml));
+ expect(goog.dom.xml.loadXml(kml)).to.xmleql(
goog.dom.xml.loadXml(output));
- var symbolizer1 = obj.features[0].getSymbolizerLiterals()[0];
- var symbolizer2 = obj.features[1].getSymbolizerLiterals()[0];
- expect(symbolizer1.fillColor).to.eql('#ff0000');
- expect(symbolizer2.opacity).to.eql(0);
});
it('Test iconStyle (read / write)', function(done) {
var url = 'spec/ol/parser/kml/iconstyle.kml';