1

私はprocessing.jsをじっと見つめていますが、画像を回転させるたびに画面上の位置も変わるため、問題が発生しています。したがって、処理が行うように見えるのは、最初に画像を独自の軸を中心に回転させてから、指示した場所に配置するのではなく、配置するように指示したポイントを中心に画像を回転させることです（これはそのように行うことはできないと思いました/注文）。

これはコードです

PShape s;
float angle = 0.1; //rads
s = loadShape("sensor.svg");
s.rotate(angle);
//I change this angle manually or with my clickMouse function which isnt shown.

void setup(){
    size(400,350);
frameRate(30); //30 frames per seconds
}

void draw(){ //shape( shape, x, y, width, height);
    smooth();
    fill(153);
    ellipse(200, 350/2, 100, 100);
    shape(s, 200, 350/2, 20, 20);
    ellipse(200, 350/2, 2, 2);
}

私が基本的にやろうとしているのは、この「センサー」画像を、私が描いた円（楕円）の周りを正しい方向に回転させることです。それがアイデアです。どちらもしていません。たぶん、円の周りでSVG画像を回転させるクリック機能を持っています。ただし、代わりに、shape（image、x_coord、y_coord、width、height）関数の座標を中心に回転します。誰か提案があれば、私はとても幸せです！私の質問が理にかなっていることを願っています。そうでない場合は、その一部を明確にしたいと思います。

ありがとう！:)

4

1 に答える 1

2

形状を回転させるのではなく、座標系を回転させる方がはるかに簡単です。

void draw() {
  translate(s.width/2,s.height/2);
  rotate(PI/4);
  shape(s);
  resetMatrix();
  // keep on drawing here
}

これにより、最初に (0,0) が形状の中心の上になるように座標系が移動し、次に座標系全体が 45 度回転してから、形状が描画されます。次に、座標系をリセットして、通常どおり描画を続けます。

于 2012-07-07T15:14:20.797 に答える