<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> canvas { border: 1px dashed gray; } </style> <script type="text/javascript"> window.onload = function() { // 取得canvas物件 var oCanvas = document.getElementById("canvas") ; if (oCanvas.getContext) { // 得到2d繪圖上下文環境 var oContext = oCanvas.getContext("2d"); var oImageData = oContext.createImageData(100, 100); var data = oImageData.data; for (var i.data; for (var i.data; for (var i.data; for (var i.data; for (var i.data; for (var i.data; for (var i.data; for (var i.data; = 0; i < data.length; i = 4) { // 紅色 data[i 0] = 255; // 綠色 data[i 1] = 0; // 藍色 data[i 2] = 0； / / 透明度 data[i 3] = 100; } oContext.putImageData(oImageData, 10, 10); } } </script> </head> <body> <canvas id="canvas" height="600 " width="600"></canvas> </body></html>
