小编stm*_*tml的帖子

我使用 SVG 图像作为 HTML5 画布元素的背景图案，使用以下语法：

var img = new Image();
img.onload = function() {
    var pattern = badge.createPattern(img, 'repeat');
    badge.fillStyle = pattern;
    // draw 'badge' shape
    badge.fill();
    };  
img.src = '../flags/iso/'+country+'.svg';

这在 Firefox 和 Chrome 中按预期工作，但在 Safari (7.0.3) 中背景为空白（白色）。在 Safari 等中使用 png 或 jpg 作为背景图像可以正常工作 - 只有 SVG 渲染不正确。

任何指点都感激不尽。还有许多关于 Safari SVG 错误的其他报告，但我不确定这是否是特定于此，或者与 Canvas 实现有关。

更新：这是Safari 中先前报告的错误，但似乎尚未采取任何措施。问题是使用 SVG 创建图案。

如果 Safari 无法使用 createPattern 加载 SVG，是否有其他替代方法可以将图像加载到画布中的不规则形状（多边形）中，充当背景图像？