2017-05-01 14 views
1

こんにちは私はキャンバスで練習していますが、私は方法を使うと正方形だけを回転させたいのですc.rotate(Degrees*Math.PI/180);キャンバスを回転させる理由は、原点を動かすと正方形です他の場所に行く。例えばキャンバスの正方形だけを回転する方法html5

私は()にenter image description here

をこの広場を持って、私は45度平方

を回転させると、私は正方形の位置(0,0)を移動しかし、それはのために行きます他の場所

enter image description here

+0

を回転させます。.. – Ninjaneer

答えて

1

移動位置まで平方(-square.width/2)/ 2を-square.height

0

ケース翻訳

case 1: //trasladar 
 
    X = prompt("Selecciona una cordenada para trasladar X"); 
 
    Y = prompt("Selecciona una cordenada trasladar Y"); 
 
    Xreal=X*20; 
 
    Yreal=Y*20; 
 
    PuntoX= 400+Xreal; 
 
    PuntoY= 200-Yreal; 
 

 
     if(ban==1){ 
 
     c.clearRect(0, 0, canvas.width, canvas.height) 
 
     c.fillStyle="red"; 
 
     c.fillRect(PuntoX,PuntoY,40,40); 
 
     } 
 
    

ケースいくつかのコードを入力してください

case 2: 
 
    if(ban==1){ 
 
     c.save(); 
 
     var D = prompt("Degree"); 
 
    c.clearRect(0, 0, canvas.width, canvas.height) 
 
     c.translate(PuntoX,PuntoY); 
 

 
     c.rotate(D*Math.PI/180); 
 
     c.translate(-(PuntoX),-(PuntoY)); 
 
     c.fillRect(PuntoX,PuntoY,40,40); 
 
     c.restore()

関連する問題