createPattern()不成功

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

For Existing Member Sign In

Dive into HTML5

This topic created in 4082 days ago, the information mentioned may be changed or developed.

var canvas = document.getElementById("canvas");
var context = canvas.getContext('2d');
var img= new Image();
img.src='lamp.gif';

var pattern = context.createPattern(img,'repeat');

context.clearRect(0,0,canvas.width,canvas.height);
context.fillStyle = pattern;
context.fillRect(0,0,canvas.width,canvas.height);
context.fill();

结果是黑块，
createPattern直接写图片路径为啥不行

var

canvas

pattern

3 replies • 2015-02-26 07:10:30 +08:00

wovfeng

Feb 25, 2015 via iPhone

这里需要图片加载完的吧把你下面的代码写到 img.onload 里面试试？

strom001

Feb 26, 2015

@wovfeng 不管用呢。昨天我在html里加了个<img>成功显示了，今天再试又不行了。
现在加了<img>，然后用complete？alert(“不行”):(img.onload的部分)；
这样做还是不行，弹出不行。如果不加<img>，连弹都不弹
safari

strom001

Feb 26, 2015

complete删了，这是现在的
var canvas = document.getElementById("canvas");
var context = canvas.getContext('2d');
var pattern = context.createPattern(img, 'repeat');
var img= new Image();
img.src='lamp.gif';
img.conload=function() {
context.clearRect(0, 0, canvas.width, canvas.height);
context.fillStyle = pattern;
context.fillRect(0, 0, canvas.width, canvas.height);
context.fill();
};