Top/Lang/html/5/canvas

目次

Canvas が使えるか?

<script type="text/javascript" language="JavaScript">
  <!--
   if(window.HTMLCanvasElement){
     window.alert("Canvas API を利用できます。");
   }else{
     window.alert("Canvas API は利用できません。");
   }
 -->
</script>

領域を指定し、赤い四角を描画する

<canvas id="sample" style="border: 1px solid #000000;" width="200" height="200">ご利用のブラウザではCANVAS API が無効のためご覧頂けません。</canvas>
<script type="text/javascript">
  window.addEventListener("load",
  function() {
    var canvas  = document.getElementById("sample");
    var context = canvas.getContext("2d");
    context.fillStyle = "#ff0000";
    context.fillRect(20,20,50,50);
  },
  false);
</script>

Link


トップ   編集 凍結 差分 履歴 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2019-06-09 (日) 16:59:05