javascript - 相当于fabric.js中的ctx.translate

Question

我是 Fabric.js 新手 使用 Canvas 时，我有以下几行代码:

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.translate(100, 100);

ctx.translate(100, 100); 用于将坐标向左和底部移动 100px。我想知道 Fabric.js 中是否有等效的 请帮帮我，谢谢!

Answer 1

没有直接的等价物。 Fabricjs 使用 ctx.translate 将对象定位在其 top 和 left 属性处。

如果你需要在 [200, 200] 处放置一个圆圈，而不是这样做

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.translate(200, 200);
/* circle drawing here */

你会的

var canvas = new fabric.Canvas("canvas");
var circle = new fabric.Circle({radius: 50});
circle.top = 200;
circle.left = 200;
canvas.add(circle);