Question

更改画布上的像素。它在Chrome中不起作用。但是，当我在NetBeans IDE中执行此代码时，它的工作原理！为什么？我疯了......

<canvas id="myCanvas" width="100" height="300" style="border:1px solid #d3d3d3"></canvas>
    <br />
    <img id="myImg" src="flash-back.jpg" />
    <script type="text/javascript">
        var c,img,ctx;
        window.onload = function(){
            c = document.getElementById("myCanvas");
            img = document.getElementById("myImg");
            ctx = c.getContext("2d");
            ctx.drawImage(img,0,0,80,50);
            var imgData = ctx.getImageData(0, 0, 80, 50);
            alert(imgData.data.length);
            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, 70);
        };
    </script>

Answer 1

你的flash-back.jpg与html在同一个文件夹中吗？

更改画布上的像素。它在Chrome中不起作用

1 个答案: