createPattern方法实现

时间:2013-03-02 00:42:40

标签: javascript jquery html5 canvas

我正在尝试绘制一个填充矩形,该矩形使用fillStyle的模式。 下面的代码允许绘制一个rect,但在此之后,将为所有后续操作抛出绘图。

这是控制填充的代码:

var img = new Image();
img.src = 'https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcR4Ag1va1Vm9Tynun8vY89CS1pY1eNMWGMxrc5efOIzEcQ-4IFa'
var pat = context.createPattern(img, 'repeat');
context.fillStyle = pat;

我怀疑有一些关于我缺少的createPattern方法。 有没有替代我正在努力实现的不使用createPattern的东西? 我注意到一些使用onload()的例子; img.src的值在我的实时环境中发生了变化,所以我不确定这是否相关。

小提琴:http://jsfiddle.net/Dvtz3/10/

好的,所以事实证明,一旦我运行而不是本地运行,Chrome安全错误就会被修复,但是不是用一个模式填充矩形,而是填充它。填充模式在FF

中正常工作

https://dl.dropbox.com/u/97446129/2-28/joined%2011-1/filltest.html

1 个答案:

答案 0 :(得分:1)

查看错误控制台,我看到它已满SecurityError秒。这是因为当您绘制到画布时,您会使用跨原始图像污染它。这将禁止您出于安全原因致电getImageData,因此会产生“时髦”的结果。