javascript - 在 Canvas 中使用 ctx.scale() 方法时，调整大小和旋转在 fabricjs 中不起作用？

Question

我正在尝试使用 canvas.clipTo 函数中的 ctx.scale() 方法将 Canvas 形状设置为椭圆形，同时我的调整大小和拖动属性在 fabric.js 中无法正常工作。任何人都知道如何解决这个问题？这是我的代码//html

<canvas id="c" width="400" height="200"></canvas>

//脚本

var w=canvas.width / 4;
var h=canvas.height / 2;
canvas.clipTo = function(ctx) {

 ctx.scale(2, 1);
 ctx.arc(w, h, 90, 0, 2 * Math.PI, true);

};
 canvas.renderAll();

这是我的 Fiddle Demo

Answer 1

在 clipTo 函数中保存和恢复它 -

ctx.save();
ctx.scale(2, 1);
ctx.arc(w, h, 90, 0, 2 * Math.PI, true);
ctx.restore();