プログラミング

暇つぶし

線が描かれるだけ

color = のところを変えるといろいろな色が設定できます。

詳しくは「javascript 配列」で検索してみてください。

if (q === のところでは、書く線の本数を指定しています。

o = では、線の描かれる幅(?)を指定しています。

適当に変えてみてください。

setAttributeのところでは解像度を設定しています。

お好みで変更してください。

以下コピペ↓

javascript:

(function(){

var f = document.createElement('canvas');

f.id = "ab";

f.style.width = "100%";

f.style.height = "100%";

document.querySelector("body").appendChild(f);

var q = 0;

var o = 3000;

var j = document.getElementById("ab").getContext('2d');

document.getElementById("ab").setAttribute("width", 3000);

document.getElementById("ab").setAttribute("height", 3000);

var color = ["#ff0000", "#00ff00", "#0000ff", "#000000"];

var d = setInterval(function(){

j.strokeStyle = color[Math.floor(Math.random() * color.length)];

q++;

j.beginPath();

j.moveTo(Math.floor(Math.random() * o), Math.floor(Math.random() * o));

j.lineTo(Math.floor(Math.random() * o), Math.floor(Math.random() * o));

j.stroke();

if (q == 500){

clearInterval(d);

}

}, 20);

})();