HTML5 - canvas(1)

公開:2009-10-24 22:01
更新:2020-02-15 04:36
カテゴリ:web,html5,js

ただランダムに点を打つだけのサンプル。
(Google Chromeブラウザでのみ動作チェックしています)
https://www.sfpgmr.net/sfpgmr/sample0001.html


var ctx;
var bmp;
var w,h;
function pset(x,y,r,g,b,a)
{
var st = (x + w * y) * 4;
var dt = bmp.data;
dt[st++] = r;
dt[st++] = g;
dt[st++] = b;
dt[st++] = a;
}
function draw()
{
pset(Math.floor(Math.random() * 128),Math.floor(Math.random() * 128)
,Math.random() * 256,Math.random() * 255,Math.random() * 255,255);
ctx.putImageData(bmp,0,0);
}
window.onload = function()
{
ctx = document.getElementById("ctx").getContext("2d");
w = document.getElementById("ctx").width;
h = document.getElementById("ctx").height;
bmp = ctx.createImageData(w,h);
window.setInterval(draw,10);
}