コメント：HTML5は多くの形を描画できます。以下は、長方形を描くコードです。それを参照してください。
<！doctype html> <head>
<メタcharset = utf-8>
<title> html5 draw rectangle </title>
<スクリプトsrc = "<a href =" http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js "> </script"> </script </a >>
</head>
<スクリプト>
$（document）.ready（function（）{
var c = document.getElementById（ "drawbox"）;
var draw = c.getContext（ "2d"）; // 2Dコンテンツへの参照を取得し、図面APIを呼び出します
draw.fillstyle = "＃ff0000"; //方法1塗りつぶしの色を指定します
draw.fillrect（0,0,300,100）; //座標と長さと幅
draw.fillstyle = "rgba（0,0,255,0.5）"; //方法2 RGB+透明性
draw.fillrect（400,0,100,100）; //座標と長さと幅
}）
</script>
</body>
<canvas> </canvas>
</body>
</html>
複製図