0

そこで、javascript グラフィックスを使用した html5 サイトを作りたいと考えています。これまでのところ、縫い目はかなり簡単ですが。

正方形を描くと長方形になります。50 ピクセル x 50 ピクセルは正方形ではありませんか? だから私は数字で遊んでみました。幅を 2 ​​倍にすると、正方形に近づくことに気付きました。画面の比率が原因かもしれないと思ったので、ページを50インチの画面で解像度1920x1080で表示しています

したがって、正方形を画面の比率に合わせるには、計算を行う必要があるかもしれません。

しかし、私が円を描く場合、私が与えるのは中心と光線だけなので、円を完璧またはほぼ完璧にするにはどうすればよいでしょうか?

使用しているコード全体

<!DOCTYPE html>
<html lang="Fr">
<meta http-equiv="Content-type" content="text/html;charset=utf-8" />
<title>La Maison Repère</title>
<meta name="geo.placename" content="St-Hubert, Québec, Canada" /> 
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<link rel="stylesheet" media="all" href="lmr.css" /> 
<meta name="viewport" content="width=device-width" /> 

<SCRIPT type="text/javascript" SRC="js/jsDraw2D.js"> </SCRIPT>
<SCRIPT type="text/javascript" SRC="js/jquery-1.7.2.js"> </SCRIPT>



<body>
<canvas id="graph"></canvas>

<script type="text/javascript">

var c=document.getElementById("graph");
var ctx=c.getContext("2d");
var col1="FF0000";
ctx.fillStyle=col1;
ctx.fillRect(0,0,50,50);

function circle()
{
  var canvas = document.getElementById("graph"); 
  var context = canvas.getContext("2d");
  context.beginPath();
  context.lineWidth="3";
  context.arc(50, 50, 90, 0, 2 * Math.PI, true);
  context.stroke();
}
circle();  

</script>

</body>

誰が私が間違っているのか知っていますか?

4

1 に答える 1

1

JavaScriptでもキャンバスの幅と高さを設定する必要があります。

したがって、これは機能しませんが、これは機能します。

于 2012-06-15T15:49:33.260 に答える