Javascript 画布旋转重置比例

我有视频和画布，它们改变了视频：

<video id="v" controls loop autoplay="autoplay">
<source src="file:///clip01-sound.mp4"
        type=video/mp4>

我有两个按钮：旋转和缩放

以下是代码：

function makeRotate() {
    var canvas = document.getElementById('c');
    var oldW = canvas.width;
    var oldH = canvas.height;
    canvas.width = oldH;
    canvas.height = oldW;
    var ctx = canvas.getContext('2d');
    ctx.translate(canvas.width, 0);
    ctx.rotate(Math.PI / 2);
}

function makeScale() {
    var canvas = document.getElementById('c');
    var ctx = canvas.getContext('2d');
    ctx.scale(1.5, 1.5);
}

如果我单击“旋转”按钮并缩放，则一切正常。 但若我按下“缩放”按钮，它工作正常，但随后旋转，我会收到旋转的视频，但“缩放”被重置为1

我的代码有什么问题，或者它是rotate函数的默认行为。如果是，我如何更改它

---

感谢调整画布大小重置其上下文，因此如果调整画布大小后不应用比例，其比例将为1，1

function makeRotate() {
    var canvas = document.getElementById('c');
    var oldW = canvas.width;
    var oldH = canvas.height;
    canvas.width = oldH;
    canvas.height = oldW;
    var ctx = canvas.getContext('2d');
    ctx.translate(canvas.width, 0);
    ctx.rotate(Math.PI / 2);
}

function makeScale() {
    var canvas = document.getElementById('c');
    var ctx = canvas.getContext('2d');
    ctx.scale(1.5, 1.5);
}