慕无忌1532157
com.createdPattern is not a function多明显,createPattern不是createdPattern
qq_慕数据1222313
解决了
慕函数5127544
guoyansi
是重新创建的canvas
慕粉4042427
我把你的代码修改了下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<canvas id="canvas" style ="divplay:block;margin:0 auto;border:1px solid #aaa;">
当前浏览器不支持Canvas,请更换浏览器后再试
</canvas>
<script>
window.onload=function (){
var canvas=document.getElementById('canvas');
var context=canvas.getContext('2d');
var image = new Image()
image.src = "s7.ico" //背景图路径
image.onload = function(){
var pattern = context.createPattern(image ,"repeat-x");
context.fillStyle = pattern
context.fillRect( 0 , 0 , 800 , 800 )
}
}
</script>
</body>
</html>这下绝对没问题了~
刚毅87
慕九州1311592
var context = canvas.getContext('2d');
var video = document.createElement('video');
video.src = '吔屎吧梁非凡_x264压制.mp4';
video.preload = 'preload';
video.autoplay = 'autoplay';
video.height = context.canvas.height;
video.width = context.canvas.width;
setInterval(function () {
var pattern = context.createPattern(video, 'no-repeat');
context.fillStyle = pattern;
context.fillRect(0, 0, context.canvas.width, context.canvas.height);
pattern = null;
//drowStar...这里执行其他绘画步骤
}, 100);测试可用,setInterval的时间间隔尽量调大,不然电脑风扇会狂飙...
楼上的方法应该更高效吧 XD
v小方
终于找开了,starPath(cxt);未定义
qq_你的肩膀我的远方_0
cxt.closePath();
context.lineWidth=3;
context.strokeStyle='#fb5';
context.fillStyle='#fb3';
context.fill();
还有这里的context应该是cxt
撞门人
ecmadao
mysunnytime
这样可以再需要时在加载图片,在加载页面时就不会因为加载静态资源时浪费时间。
袁三日
笑问苍天
这样写肯定不行的,我觉得第一个参数应该是一帧图像的数据,查了下文档
createPattern 第一个参数是CanvasImageSource数据类型
typeof (HTMLImageElement or HTMLVideoElement or HTMLCanvasElement)CanvasImageSource;
具体HTMLVideoElement数据类型我也没有了解。
把你的代码这样改可行:
//设置video填充
var video = document.createElement("video");
video.src = "movie.ogg";
video.autoplay = "autoplay";
setInterval(function(){
var pattern= context.createPattern(video, "no-repeat");
context.fillStyle = pattern;
context.fillRect(0, 0, windowWidth, windowHeight);
},
16);
喵
kugouming
kugouming
kugouming
kugouming
kugouming