javascript - fabric.js - 文本下划线和 lineHeight

Question

我在 fabric.js 中的文本中添加了下划线，它的工作原理如下图。但是下划线离文字有点远，我改变了lineHeight属性，下划线可以更接近文字，但问题是选择控件的高度也改变了。请参阅下面的图片。

第一个，我更改了lineHeight = 0.2，并添加了下划线，很好，但是选择控件变得很奇怪。第二个，我使用 default lineHeight，但下划线与文本有点远。那么如何在没有选择问题的情况下紧密地为文本添加下划线？

我测试了，发现这个问题是因为originX = 'left', 和originY = 'top'，如果没originX = 'center'问题。

Answer 1

试试这个代码，希望它能更好地为你工作。

<input type="button" id="undrline" value="Underline" class="underline"  >

$("#undrline").click(function() {
alert("underline");
var obj = canvas.getActiveObject();
if (!obj) return;
obj.setTextDecoration('underline');
canvas.renderAll();
});