回るキャンバスに絵が描けるものを作ってみた【解説】

マウスの座標はstage から取得して、それを shapeのgraphicsに描いて反映させます。

その時にポイントなるのが2点。

1つ目は、stage上で、shapeを回転させるための基準点を真ん中に変更。

stage.setTransform(canvas.width / 2, canvas.height / 2);

2つ目は、shapeを回転させて、角度が変わった分だけ、座標をずらして反映させる。

var x2 = Math.cos(radian)x+Math.sin(radian)y;
var y2 = Math.cos(radian)y-Math.sin(radian)x;