0

このポリゴンを小さくして、800X300 のキャンバス領域に収まるようにするにはどうすればよいでしょうか?

 context.beginPath();
 context.moveTo(200,0);
 context.lineTo(400,0);
 context.lineTo(600,200);
 context.lineTo(600,400);
 context.lineTo(400,600);
 context.lineTo(200,600);
 context.lineTo(0,400);
 context.lineTo(0,200);
 context.closePath();
 context.fill();

どの数字を変更する必要があるのか​​ わかりません。

4

2 に答える 2

3

メソッドを使用できますscale()。

context.scale(x, x);

ここxで、スケーリングする係数です。

于 2013-10-22T16:29:32.183 に答える
2

線を再プロットするか、最も簡単な方法は、このようにコンテキストで scale メソッドを使用することです

 context.scale(0.5,0.5);

それは半分のサイズになるので、完全な例は次のようになります

var c=document.getElementById("myCanvas");
 var context=c.getContext("2d");
 context.scale(0.5,0.5);

context.beginPath();
 context.moveTo(200,0);
 context.lineTo(400,0);
 context.lineTo(600,200);
 context.lineTo(600,400);
 context.lineTo(400,600);
 context.lineTo(200,600);
 context.lineTo(0,400);
 context.lineTo(0,200);

 context.closePath();
 context.fill();

ここでjsfiddleを参照してくださいhttp://jsfiddle.net/XLW2P/1/

于 2013-10-22T16:33:51.537 に答える