3

fillStyle のパターンを使用して、塗りつぶされた四角形を描画しようとしています。次のコードでは、1 つの四角形を描画できますが、その後のすべてのアクションで描画が破棄されます。

塗りつぶしを制御するコードは次のとおりです。

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/

わかりましたので、ローカルではなくライブで実行すると、クロムのセキュリティエラーは修正されますが、四角形がパターンで埋められるのではなく、しっかりと埋められます。塗りつぶしパターンは FF で正常に機能しています

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

4

1 に答える 1

1

エラーコンソールを見ると、SecurityErrorsでいっぱいです。これは、キャンバスに描画するときに、クロスオリジンイメージでキャンバスを汚染しているためです。getImageDataこれにより、セキュリティ上の理由で電話をかけることができなくなり、「ファンキー」な結果になります。

于 2013-03-02T00:53:27.897 に答える