如何圍繞它的中心旋轉三角形？

Question

    document.onkeydown = function (event) {
        switch (event.keyCode) {
            case 74:
                //player presses "j"
                px = player.calculateCentreX();
                py = player.calculateCentreY();
                x1 = rotateX(player.x1,player.y1,35,px,py);
                x2 = rotateX(player.x2,player.y2,35,px,py);
                x3 = rotateX(player.x3,player.y3,35,px,py);
                y1 = rotateY(player.x1,player.y1,35,px,py);
                y2 = rotateY(player.x2,player.y2,35,px,py);
                y3 = rotateY(player.x3,player.y3,35,px,py);
                
                player.setPoints(x1,y1,x2,y2,x3,y3);
                break;
                
            default:
                break;
        }
    };
    
    function rotateX(cx,cy,angle,px,py) {
        x = Math.cos(angle)*(px-cx) - Math.sin(angle)*(py-cy) + cx
        return x
        }
        
    function rotateY(cx,cy,angle,px,py) {
        y = Math.sin(angle)*(px-cx) + Math.cos(angle)*(py-cy) + cy
        return y
        }

每當用戶按下“J”時，我正在使用上面的方法嘗試圍繞它的中心旋轉一個三角形（播放器）。 setPoints 方法只是將三角形 x1,y1,x2,y2,x3,y3 的值設置為更新的點。 每當用戶按下 J 時，三角形確實會旋轉但會變大 - 有人可以指出這里出了什么問題嗎？

Answer 1

似乎您使用了錯誤的參數順序：函數是用center, angle, point序列定義的

cx,cy, angle, px,py
  ^             ^
center        point

但你用point, angle, center序列來稱呼它

px = player.calculateCentreX();
py = player.calculateCentreY();
x1 = rotateX(player.x1,player.y1,  35,  px,py); !!!!!
                     ^                   ^           
                   point                center calculated above

結果，前中心圍繞頂點旋轉