<!DOCTYPE html><html> <meta charset="utf-8"> <title></title> border: 1px dashed grey; } </style> <script type="text/javascript"> window.onload = function() { // 캔버스 객체 가져오기 var oCanvas = document.getElementById("canvas"); if (oCanvas.getContext) { // 2D 드로잉 컨텍스트 가져오기 var oContext = oCanvas.getContext("2d"); var oImageData = oContext.createImageData(100, 100) var data = oImageData.data; 0 ; i < data.length; i += 4) { // 빨간색 데이터[i + 0] = 255; // 파란색 데이터[i + 2] = 0 ; // 투명도 데이터[i + 3] = 100; } oContext.putImageData(oImageData, 10, 10) } } </head> ="600" width="600"></canvas></body></html>