From 4ef1f5e63f3b548eafe3acd7c65f72f86690b603 Mon Sep 17 00:00:00 2001 From: Bart van den Eijnden Date: Tue, 12 Jan 2016 15:44:50 +0100 Subject: [PATCH] Make sure icons show up in Safari Make sure that drawImage calls don't exceed source image dimensions. --- src/ol/render/canvas/canvasreplay.js | 7 +- test_rendering/spec/ol/data/me0.svg | 58 +++++++++++++++ .../style/expected/icon-canvas-svg-offset.png | Bin 0 -> 7674 bytes .../expected/icon-canvas-svg-offset2.png | Bin 0 -> 5312 bytes .../style/expected/icon-canvas-svg-scale.png | Bin 0 -> 10311 bytes test_rendering/spec/ol/style/icon.test.js | 67 ++++++++++++++---- 6 files changed, 115 insertions(+), 17 deletions(-) create mode 100644 test_rendering/spec/ol/data/me0.svg create mode 100644 test_rendering/spec/ol/style/expected/icon-canvas-svg-offset.png create mode 100644 test_rendering/spec/ol/style/expected/icon-canvas-svg-offset2.png create mode 100644 test_rendering/spec/ol/style/expected/icon-canvas-svg-scale.png diff --git a/src/ol/render/canvas/canvasreplay.js b/src/ol/render/canvas/canvasreplay.js index 4b55813774..ddfcd46144 100644 --- a/src/ol/render/canvas/canvasreplay.js +++ b/src/ol/render/canvas/canvasreplay.js @@ -349,8 +349,11 @@ ol.render.canvas.Replay.prototype.replay_ = function( context.globalAlpha = alpha * opacity; } - context.drawImage(image, originX, originY, width, height, - x, y, width * pixelRatio, height * pixelRatio); + var w = (width + originX > image.width) ? image.width - originX : width; + var h = (height + originY > image.height) ? image.height - originY : height; + + context.drawImage(image, originX, originY, w, h, + x, y, w * pixelRatio, h * pixelRatio); if (opacity != 1) { context.globalAlpha = alpha; diff --git a/test_rendering/spec/ol/data/me0.svg b/test_rendering/spec/ol/data/me0.svg new file mode 100644 index 0000000000..55ed860cd3 --- /dev/null +++ b/test_rendering/spec/ol/data/me0.svg @@ -0,0 +1,58 @@ + + + +image/svg+xml + + \ No newline at end of file diff --git a/test_rendering/spec/ol/style/expected/icon-canvas-svg-offset.png b/test_rendering/spec/ol/style/expected/icon-canvas-svg-offset.png new file mode 100644 index 0000000000000000000000000000000000000000..2f8c277bf0dfc746beeb59bd74d2da8a68591d46 GIT binary patch literal 7674 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 HeDi+*lB-ek literal 0 HcmV?d00001 diff --git a/test_rendering/spec/ol/style/expected/icon-canvas-svg-offset2.png b/test_rendering/spec/ol/style/expected/icon-canvas-svg-offset2.png new file mode 100644 index 0000000000000000000000000000000000000000..22eacf94d941bcc176943b1d6a24f694371ae9a9 GIT binary patch literal 5312 zcmeHJ`CC)R8lD^y2tf!4Tq;-+YAb6&FBA~MrckhKmR+`>RAZ4~ysZ${N%-&^N z6_fbIXFu-w+TN!6<0$`sR&9;opF4zmW(VUP+&(vOE#21Kq(idWZ(|c3_RFBP3-R>^ z$*Szi;`pOfp2wxIZzNtbs=YI`_Nn=AmRCn7DL5#d;OoBp#wdb|Yz0m@xEq4fq|y(o zxS&Y~uWLZ$cK76b3qgpH@dr*+pi34%(I*0L|FkA9_<&XrY)b{RV13ZK5bKWkUusCd zf(ymMyG#+!S7}987&Z!J<8vbI$_s|A=%+crOHVl&edFE{a;tid;KZq#Y3F1rWs3w!quiWK_QT zsFkTYAJS}VrhH0Y9ax@h92tL@^#M0i3+(J4kvYUp|6tQSQo;X96f6nLecVk z{=xTntOM^vU-4Y)c&Q%p7FB2#c$ATwjd^r`kWkXbt$>a`tu!|S9yh8|MnmB<&z_ypN`T3k0(AKIz`jV7UNT*KG;&1v~IP#%+a4HrvANc0Ig3@|h z_PtHN^XsKL@&i~7Xp;}+c97S+(Q2(}dpIt! zn~g3mf}}TT@S5n)#16BcAo^E9;;3Lv?$F{sl}@dOiNm2Ua!Bw+tjSg@DO4tH@$+&5 z5zU&*p7^-&&u7`QLZyb2$$4)frg#u>+p^wF`ATmKUDD1%F#im6RDzNT6*~Pku+_w5IjLqSKgkOfO z<+~yNONRot+>U^^>>H2GwfbDgh^6C;45I9~;V2XS9k$3kl)uCyy7c0y^x&-2FW5NuWtEjCHu$e!j{h|i%s&SUJuHD#px zWF@C9sdOwQPEO#};X3pS_@adDIW)dpQHDqQnM`f#LZc95)SwH*P4~CTWj&y%nv&u zwD#~#b_+5+P%I~6ogLMA!du8DXYxxgthj~8hsd&Fj9XBwWBxoPp(vc*! z=vxVoC*u9tihdKeVmCS?5){rmS@uZ?8tD&`PENZt9y3@=SO}%U)Ke4*=}Beh&_PMZ z;(#2xQ4Taz=~V4TPusAP9cV=XY_%H|4Bh)Qul**nX&1`%)p#|7wm1Dd{__GqWQi%1 zS$Ul|K)SLW6aB!*VE2$6OMr>N7~ANRl8CLB3YemiJx}=yTy_Gw?dD9~R-Wl=+w|1coag+Ozm#Y+?VN zdGojddY5BF;yw?5EKh(>RN(uPO-5cj&!vDkkN|lNrW#=Ek6=_?bJ5=^0{oJK$Q3KL!x7 t4zRAlx)0WKVZ9!#*TnU6;s4@nRFkV4X3SJ6;{^bFb_YcS-r1RU{J)G0={W!Z literal 0 HcmV?d00001 diff --git a/test_rendering/spec/ol/style/expected/icon-canvas-svg-scale.png b/test_rendering/spec/ol/style/expected/icon-canvas-svg-scale.png new file mode 100644 index 0000000000000000000000000000000000000000..58de0baf3417390c7d50ce077ed3190a9f33e65f GIT binary patch literal 10311 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 literal 0 HcmV?d00001 diff --git a/test_rendering/spec/ol/style/icon.test.js b/test_rendering/spec/ol/style/icon.test.js index bc1116396f..3effc5e4ee 100644 --- a/test_rendering/spec/ol/style/icon.test.js +++ b/test_rendering/spec/ol/style/icon.test.js @@ -4,8 +4,17 @@ describe('ol.rendering.style.Icon', function() { var target, map, vectorSource; - function createMap(renderer) { - target = createMapDiv(50, 50); + var imgInfo = { + anchor: [0.5, 46], + anchorXUnits: 'fraction', + anchorYUnits: 'pixels', + opacity: 0.75, + scale: 0.5, + imgSize: [32, 48] + }; + + function createMap(renderer, width, height) { + target = createMapDiv(width ? width : 50, height ? height : 50); vectorSource = new ol.source.Vector(); var vectorLayer = new ol.layer.Vector({ @@ -30,7 +39,7 @@ describe('ol.rendering.style.Icon', function() { disposeMap(map); }); - function createFeatures(callback) { + function createFeatures(src, imgInfo, callback) { var feature; feature = new ol.Feature({ geometry: new ol.geom.Point([0, 0]) @@ -38,35 +47,63 @@ describe('ol.rendering.style.Icon', function() { var img = new Image(); img.onload = function() { + imgInfo.img = img; feature.setStyle(new ol.style.Style({ - image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({ - anchor: [0.5, 46], - anchorXUnits: 'fraction', - anchorYUnits: 'pixels', - opacity: 0.75, - scale: 0.5, - img: img, - imgSize: [32, 48] - })) + image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ (imgInfo)) })); vectorSource.addFeature(feature); callback(); }; - img.src = 'spec/ol/data/icon.png'; + img.src = src; } it('tests the canvas renderer', function(done) { map = createMap('canvas'); - createFeatures(function() { + createFeatures('spec/ol/data/icon.png', imgInfo, function() { expectResemble(map, 'spec/ol/style/expected/icon-canvas.png', IMAGE_TOLERANCE, done); }); }); + it('scales svg correctly in the canvas renderer', function(done) { + map = createMap('canvas', 512, 512); + createFeatures('spec/ol/data/me0.svg', { + scale: 96 / 512, + imgSize: [512, 512] + }, function() { + expectResemble(map, 'spec/ol/style/expected/icon-canvas-svg-scale.png', + IMAGE_TOLERANCE, done); + }); + }); + + it('uses offset correctly in the canvas renderer', function(done) { + map = createMap('canvas', 256, 512); + createFeatures('spec/ol/data/me0.svg', { + offset: [0, 256], + size: [256, 256], + imgSize: [512, 512] + }, function() { + expectResemble(map, 'spec/ol/style/expected/icon-canvas-svg-offset.png', + IMAGE_TOLERANCE, done); + }); + }); + + it('uses offset correctly if it is larger than size in the canvas renderer', function(done) { + map = createMap('canvas', 256, 512); + createFeatures('spec/ol/data/me0.svg', { + offset: [0, 374], + size: [256, 256], + imgSize: [512, 512] + }, function() { + expectResemble(map, 'spec/ol/style/expected/icon-canvas-svg-offset2.png', + IMAGE_TOLERANCE, done); + }); + }); + it('tests the WebGL renderer', function(done) { assertWebGL(); map = createMap('webgl'); - createFeatures(function() { + createFeatures('spec/ol/data/icon.png', imgInfo, function() { expectResemble(map, 'spec/ol/style/expected/icon-webgl.png', 2.0, done); });