canvas教程

HTML canvas getImageData() 方法

字号+ 作者:H5之家 来源:H5之家 2016-11-19 12:00 我要评论( )

HTML canvas getImageData() 方法 Canvas 对象 实例 下面的代码通过 getImageData() 复制画布上指定矩形的像素数据,然后通过 putImageData() 将图像数据放回画

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=document.getElementById("scream");
ctx.drawImage(img,0,0);
var imgData=ctx.getImageData(0,0,c.width,c.height);
// invert colors
for (var i=0;i<imgData.data.length;i+=4)
{
imgData.data[i]=255-imgData.data[i];
imgData.data[i+1]=255-imgData.data[i+1];
imgData.data[i+2]=255-imgData.data[i+2];
imgData.data[i+3]=255;
}
ctx.putImageData(imgData,0,0);

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • HTML canvas translate() 方法

    HTML canvas translate() 方法

    2016-11-19 13:01

  • jQuery插件Flot简介 学习Canvas绘制图形的原理

    jQuery插件Flot简介 学习Canvas绘制图形的原理

    2016-11-19 11:01

  • JavaScript基

    JavaScript基

    2016-11-18 12:07

  • Occipital公司推出空间3D扫描和测量的IOS应用程序Canvas

    Occipital公司推出空间3D扫描和测量的IOS应用程序Canvas

    2016-11-18 10:01

网友点评
<