HTML5のcanvasを使ってAndroidアプリ！描画練習④

サクウェブＴＶはコチラ↓↓↓

では、スクリプトをいじって描画を変えてます。

単純に線を増やしてみましょう。

描画処理を以下のように書きかえます。

for(var i=0;i<60;i++){
	c.beginPath();
	c.moveTo(10,10);
	c.lineTo(10+i*5,290);
	c.stroke();
}

for文で線を60本に増やしました。

c.lineTo(10+i*5,290);

でiを１ずつ増やしながら5に掛けたものを10に足していきます。

つまり、x座標を5pxずつずらして線を６０本描画する処理です。

これを実行すると以下のように表示されます。

しかし、これもまた線がたくさんあるだけなので面白くありません。

もう少し細工してみましょう。

＞＞HTML5のcanvasを使ってAndroidアプリ！描画練習⑤＜＜