diff --git a/src/ol/render/canvas/immediate.js b/src/ol/render/canvas/immediate.js index 7a97a0ac23..cfba4e5711 100644 --- a/src/ol/render/canvas/immediate.js +++ b/src/ol/render/canvas/immediate.js @@ -681,16 +681,16 @@ ol.render.canvas.Immediate.prototype.drawMultiPolygon = function(geometry) { var endss = geometry.getEndss(); var stride = geometry.getStride(); var i, ii; + context.beginPath(); for (i = 0, ii = endss.length; i < ii; ++i) { var ends = endss[i]; - context.beginPath(); offset = this.drawRings_(flatCoordinates, offset, ends, stride); - if (this.fillState_) { - context.fill(); - } - if (this.strokeState_) { - context.stroke(); - } + } + if (this.fillState_) { + context.fill(); + } + if (this.strokeState_) { + context.stroke(); } } if (this.text_ !== '') { diff --git a/test/test-extensions.js b/test/test-extensions.js index 1c5c8c1c60..d42f09208e 100644 --- a/test/test-extensions.js +++ b/test/test-extensions.js @@ -383,7 +383,12 @@ function resembleCanvas(canvas, referenceImage, tolerance, done) { if (showMap) { - document.body.appendChild(canvas); + var wrapper = document.createElement('div'); + wrapper.style.width = canvas.width + 'px'; + wrapper.style.height = canvas.height + 'px'; + wrapper.appendChild(canvas); + document.body.appendChild(wrapper); + document.body.appendChild(document.createTextNode(referenceImage)); } resemble(referenceImage) diff --git a/test_rendering/spec/ol/data/tiles/osm/0/0/0.png b/test_rendering/spec/ol/data/tiles/osm/0/0/0.png new file mode 100644 index 0000000000..732e9096b1 Binary files /dev/null and b/test_rendering/spec/ol/data/tiles/osm/0/0/0.png differ diff --git a/test_rendering/spec/ol/layer/clip.test.js b/test_rendering/spec/ol/layer/clip.test.js new file mode 100644 index 0000000000..baa3a5e00f --- /dev/null +++ b/test_rendering/spec/ol/layer/clip.test.js @@ -0,0 +1,110 @@ +goog.provide('layer clipping'); + +goog.require('ol.Map'); +goog.require('ol.View'); +goog.require('ol.geom.MultiPolygon'); +goog.require('ol.layer.Tile'); +goog.require('ol.source.XYZ'); +goog.require('ol.style.Stroke'); +goog.require('ol.style.Style'); + + +describe('layer clipping', function() { + + function onLoad(source, callback) { + var loading = 0; + var loaded = 0; + var called = false; + + function check() { + if (!called && loading > 0 && loaded === loading) { + callback(); + } + } + + source.on('tileloadstart', function() { + ++loading; + }); + source.on('tileloadend', function() { + ++loaded; + setTimeout(check, 10); + }); + source.on('tileloaderror', function() { + callback(new Error('Tile loading failed')); + called = true; + }); + } + + + describe('MultiPolygon clipping', function() { + + var map = null; + beforeEach(function() { + map = new ol.Map({ + target: createMapDiv(256, 256), + view: new ol.View({ + center: [0, 0], + zoom: 0 + }) + }); + }); + + afterEach(function() { + disposeMap(map); + map = null; + }); + + it('clips to all parts of the MultiPolygon', function(done) { + + var source = new ol.source.XYZ({ + url: 'spec/ol/data/tiles/osm/{z}/{x}/{y}.png' + }); + + var layer = new ol.layer.Tile({ + source: source + }); + + var geometry = new ol.geom.MultiPolygon([ + [[[-80, -40], [-40, 0], [-80, 40], [-120, 0], [-80, -40]]], + [[[80, -40], [120, 0], [80, 40], [40, 0], [80, -40]]] + ]).transform('EPSG:4326', 'EPSG:3857'); + + var style = new ol.style.Style({ + stroke: new ol.style.Stroke({ + width: 2, + color: 'blue' + }) + }); + + layer.on('precompose', function(event) { + var context = event.context; + context.save(); + + var vectorContext = event.vectorContext; + vectorContext.setStyle(style); + vectorContext.drawGeometry(geometry); + + context.clip(); + }); + + layer.on('postcompose', function(event) { + var context = event.context; + context.restore(); + + var vectorContext = event.vectorContext; + vectorContext.setStyle(style); + vectorContext.drawGeometry(geometry); + }); + + onLoad(source, function(err) { + if (err) { + return done(err); + } + expectResemble(map, 'spec/ol/layer/expected/multipolygon-clip.png', IMAGE_TOLERANCE, done); + }); + + map.addLayer(layer); + + }); + }); +}); diff --git a/test_rendering/spec/ol/layer/expected/multipolygon-clip.png b/test_rendering/spec/ol/layer/expected/multipolygon-clip.png new file mode 100644 index 0000000000..709fd55a09 Binary files /dev/null and b/test_rendering/spec/ol/layer/expected/multipolygon-clip.png differ