如何在fabric.js中的某個指定點旋轉？

Question

任何人都可以知道如何在fabric.js中的某個指定點處旋轉？例如，

var line1 = new fabric.Line([70, 20, 70, 100], { 
    stroke: "#000000", 
    strokeWidth: 6 
}); 

我想旋轉它的基礎上它的終點（70,100），但不是它的中心。

Answer 1

目前沒有辦法繞着任意點旋轉。轉換的起源 - 用於縮放&旋轉 - 當前處於對象的中心。我們計劃在不久的將來增加對任意轉換起源的支持。

Answer 2

您可以使用fabric.util.rotatePoint實現關於任意點的旋轉。這將允許您將由原點（由origin_x和origin_y定義）的線（由x1,y1,x2和y2定義）旋轉一個角度（以度爲單位）（由angle定義）。

請注意，fabric.util.rotatePoint需要弧度旋轉，即使angle s通常在使用fabric.js時以度爲單位指定。

var rotation_origin = new fabric.Point(origin_x, origin_y); 
var angle_radians = fabric.util.degreesToRadians(angle); 
var start = fabric.util.rotatePoint(new fabric.Point(x1,y1), rotation_origin, angle_radians); 
var end = fabric.util.rotatePoint(new fabric.Point(x2,y2), rotation_origin, angle_radians); 
var line1 = new fabric.Line([start.x, start.y, end.x, end.y], { 
    stroke: '#000000', 
    strokeWidth: 6 
}); 

你可以與其他對象相同，但您可能需要提供angle屬性適當地旋轉對象。