canvasへの文字の描画

文字の描画
文字の描画はマウスボタンがクリックされたときの
イベントを捕捉してから行う
あと、文字を描画するときには
一旦canvas全体を黒く塗りつぶしてから
行う
これは
すでにある文字の上に重なって表示されると
わかりにくいから
この処理のソースは
context.fillStyle=”black”;
context.fillRect(canvasObj.width,canvasObj.height);
となる
表示する文字は
テキストフィールドへ入力した文字なので
読み出して変数へ格納
ソースにすると
var text = document.getElementById(“char”).value;
あとは、fillText()で読み出した文字を描く
fillText()のパラメータは
書きたい文字
横幅
縦幅
これが
textに格納している文字
canvasObj.width /2
320
となる
canvasObj.width/2は
画面の大きさの半分

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です