yangchunjin/SoonDesign
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化圆形文本

Browse Source
This commit is contained in:
24kycj
2025-05-28 01:11:17 +08:00
parent cbf8b48986
commit 71aa2c3d1f
5 changed files with 245 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
design1.html
+10 -7
View File
@@ -200,12 +200,12 @@
style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
</div>
</div>
<!-- <div class="component-line">
<div class="component-line">
<span class="name" language="m" zh="直径：" ozh="直径：" en="Diameter:"></span>
<div id="circle_text_diameter"
style="display: inline-block;width: 150px;position: relative;top:-3px;left:5px;">
</div>
</div> -->
</div>
<div class="component-line">
<span class="name" language="m" zh="颜色：" ozh="顏色：" en="Color:"></span>
<input type="color" id="circle_text_color" class="input_color">
@@ -586,7 +586,7 @@
</div>
</div>
<script src="./public/js/fabric.min.js"></script>
<script src="./public/js/guideLines.js"></script>
<script src="./public/js/guideLines1.js"></script>
<script src="./public/js/print.min.js"></script>
<script src="./public/js/crypto-js.min.js"></script>
<script src="./public/js/jspdf.umd.min.js"></script>
@@ -613,7 +613,7 @@
(function (fabric) {
fabric.CurvedText = fabric.util.createClass(fabric.Object, {
type: 'curved-text',
diameter: 250,
diameter: 0,
kerning: 0,
text: '',
flipped: false,
@@ -4984,7 +4984,7 @@
lockScalingY: true,
fontFamily: 'Arial',
originX: 'center',
originY: 'center',
// originY: 'center',
angle: angleDeg,
flipped: pointer.y > canvas.height/2 ? true : false
});
@@ -6194,12 +6194,15 @@
if (objs[getIndex(e.target) - 1].type ===11) {
let pointer = {
x: obj.left,
y: obj.top > canvas.height/2 ? obj.top + obj.height/2 : obj.top - obj.height/2
y: obj.top
}
console.log(obj)
// console.log(obj)
let distance = getDisdance(pointer.x, pointer.y, canvas.width/2,canvas.height/2)
let angleDeg = getDeg(pointer)
let flipped = pointer.y > canvas.height/2 ? true : false
// distance = distance + 140
// console.log(pointer.x, pointer.y, canvas.width/2,canvas.height/2, distance*2)
circle_text_diameter.setValue(distance*2-500);
obj.set("diameter", distance*2);
obj.set("angle", angleDeg);
obj.set("flipped", flipped);