JavaScript»基礎»関数 指定した2ケタの数を画像で表示する関数

ファイル名: js-basic/quest_00336.html

下のソースコードに必要なプログラムを書き加えて、2けたの数を3つ表示ひょうじするプログラムを完成させてください。画像がぞうは下のリンクからダウンロードできます。

画像をダウンロード

ソースコード

const canvas = document.getElementById("canvas");
const context = canvas.getContext("2d");

const image = new Image();
image.src = "mes01_f01_d01_c04_02.png";
image.onload = function() {

  // ここに、指定した2ケタの数を表示する関数drawDoubleDigitsを書いてください
  // drawDoubleDigitsの引数は、1つ目が表示したい2ケタの数、2つ目以降が、表示先の、左上頂点のx・左上頂点のy・横はば・高さ、です。

  drawDoubleDigits(29, 100, 50, 120, 60);
  drawDoubleDigits(10, 130, 130, 60, 60);
  drawDoubleDigits(43, 70, 210, 180, 60);
};

ヒント

0から9までの数字で2ケタの数を表示ひょうじするには、どうすればいいか考えよう。