[PGA] js-canvasプログラミング
関連タイピング
-
Pythonプログラミングのタイピング超入門です。
プレイ回数3758 短文90秒 -
全文字タイピング練習(108文字×100問,2分間ランダム)
プレイ回数4988 英語長文120秒 -
ホームポジションが自然と身につく!
プレイ回数2246 短文60秒 -
Linux+Bashコマンド。数字と記号を全て含んでいます。
プレイ回数9718 英語長文305打 -
Javascriptの基礎的なコード集
プレイ回数3429 長文英字358打 -
コマンドラインやプログラミング言語のタイピング練習用
プレイ回数3246 英語長文90秒 -
『+』『-』『=』の練習に『:』を追加しました
プレイ回数2832 長文記号281打 -
英数と記号を混ぜた文章です
プレイ回数970 英語長文1468打
問題文
ふりがな非表示
ふりがな表示
(document.getelementbyid(”canvas”);)
canvas要素を手に入れる
(canvas.getcontext(”2d”);)
描画コンテキストを手に入れる
(context.fillrect(0, 0, 0, 0);)
四角形をぬりつぶす
(rgb(255, 255, 255))
RGBで白をあらわす文字列
(context.fillstyle = ”rgb(0, 0, 0)”;)
ぬりつぶしのスタイルを黒にする
(context.linewidth = 5;)
線はばを5にする
(context.strokestyle = ”rgb(0, 0, 0)”;)
線をえがくときのスタイルを黒にする
(context.strokerect(0, 0, 0, 0);)
四角形の線をえがく
(context.beginpath();)
新しいパス作成をはじめる
(context.closepath();)
パスを閉じる
(context.moveto(0, 0);)
パスをかかずにペン先を移動する
(context.lineto(0, 0);)
線のパスをえがく
(context.arc(160, 160, 80, 0, math.pi * 2);)
円形のパスをえがく
(context.filltext(”hi”, 0, 0);)
テキストをぬりつぶす
(context.drawimage(image, 0, 0);)
画像をえがく
(image.onload = function() {};)
画像の読みこみが終わったときに何かする
(const image = new image();)
新しい画像オブジェクトをつくる
(image.src = ”images/neko.png”;)
画像オブジェクトに画像ファイルの場所をセットする
(<script>)
スクリプトタグを開く
(</script>)
スクリプトタグを閉じる