美文网首页
canvas图像填充createPattern

canvas图像填充createPattern

作者: infi_ | 来源:发表于2017-12-29 15:33 被阅读0次
    var canvas_2=document.getElementById("canvas_2");
    var can2_context=canvas_2.getContext("2d");
    var img=new Image();
    img.src='./images/hover2.png'
    
    function fillimage(){
        var pattern=can2_context.createPattern(img,'no-repeat')
        can2_context.fillStyle=pattern;
        can2_context.fillRect(0,0,canvas_2.width,canvas_2.height)
        
    
    }
    img.onload=function(e){
      fillimage()
    }
    

    createPattern官方解释:创建一个可以用来在canvas之中对图形和文本进行描边与填充的图案。该方法的第一个参数指定了图案所用图像,它可以是images元素,canvas元素或者video元素.第2个参数告诉浏览器,对图形进行扫描或填充时,应该如何重复该图案,这个参数的有效值是repeat,repeat-x,repeat-y,no-repeat

    相关文章

      网友评论

          本文标题:canvas图像填充createPattern

          本文链接:https://www.haomeiwen.com/subject/hsnigxtx.html