書式
コンテキスト.createImageData(w,h)
属性
| 属性名／パラメーター |
内 容 |
| w |
作成する画像の横幅を指定します。 |
| h |
作成する画像の縦幅を指定します。 |
説明
指定したサイズの画像オブジェクト（Canvas用ピクセル配列を持ったオブジェクト）を作成します。createImageData()で作成したイメージは
putImageData()を使って描画することができます。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Sample</title>
<script>
window.onload = function(){
var canvasObj = document.getElementById("imgCanvas");
var context = canvasObj.getContext("2d");
var myImage = context.createImageData(320, 240);
for(var i=0; i<320*240*4; i+=4){
myImage.data[i+0] = i & 255;
myImage.data[i+1] = parseInt(i / 512);
myImage.data[i+2] = parseInt(i / 1024);
myImage.data[i+3] = 255;
}
context.putImageData(myImage, 0, 0);
}
</script>
</head>
<body>
<h1>Sample</h1>
<canvas id="imgCanvas" width="320" height="240" style="border:1px black solid"></canvas>
</body>
</html>