2012-01-12 12 views
7

क्या कोई जानता है कि fabric.js में एक निर्दिष्ट बिंदु को कैसे घूमना है? उदाहरण के लिए,fabric.js में एक निर्दिष्ट बिंदु के चारों ओर घुमाने के लिए कैसे?

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

मैं इसे अपने अंतिम बिंदु (70, 100) के आधार पर घूमना चाहता हूं लेकिन इसका केंद्र नहीं।

उत्तर

1

इस समय मनमाने ढंग से बिंदु घूमने का कोई तरीका नहीं है। परिवर्तन की उत्पत्ति - & रोटेशन स्केलिंग के लिए - वर्तमान में किसी ऑब्जेक्ट के केंद्र में है। हम निकट भविष्य में परिवर्तन की मनमानी उत्पत्ति के लिए समर्थन जोड़ने की योजना बना रहे हैं।

9

आप fabric.util.rotatePoint का उपयोग कर एक मनमाना बिंदु के बारे में एक रोटेशन प्राप्त कर सकते हैं। इससे आपको डिग्री (angle द्वारा परिभाषित) द्वारा एक उत्पत्ति (origin_x और origin_y द्वारा परिभाषित) के बारे में एक पंक्ति (x1, y1, x2 और y2 द्वारा परिभाषित) को घुमाएगी।

ध्यान दें कि fabric.util.rotatePoint रेडियंस में घूर्णन लेता है, भले ही angle एस को 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 संपत्ति वस्तु उचित रूप से बारी बारी से करने देने की आवश्यकता हो सकती है।

संबंधित मुद्दे