javascript - fabric.js - 如何设置文本宽度?

标签 javascript jquery html fabricjs text-alignment

我发现将 textAlign 设置为 fabric.js Text 对象是无用的,因为文本字段的宽度会自动分配以完全适合文本的宽度。

我在 API 中找不到任何可以让我设置另一个宽度的内容。我尝试了 scaleToWidth,但也没有任何效果。

this.text = new fabric.Text(this.name, 
{
        fontFamily: 'Calibri Light',
        fontSize: 17,
        backgroundColor: 'blue', // using this to confirm that the width is actually just set to the text width
        textAlign: 'center',
        top: 15,
        scaleToWidth: 1.1,
})

我使用了一个非常老套的解决方案使其以所需的方式出现。

引用自 fabric.js 网站:

文本对齐

文本对齐在处理多行文本时非常有用。对于单行文本,边界框的宽度始终与该行的宽度完全匹配,因此无需对齐。 允许的值为“左”、“中心”和“右”。

有谁知道如何解决这个问题?

最佳答案

不确定您是否在第一次提问后的两年内找到了答案,但我遇到了同样的问题并且能够通过将文本对象添加到 Canvas 然后设置它的宽度然后触发 renderAll 找到解决方案() 在 Canvas 上。

var text = new fabric.Text('sample text', {fill: '#fff', textAlign: 'center'});
canvas.add(text);
text.width = 180;
canvas.renderAll();

关于javascript - fabric.js - 如何设置文本宽度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31428606/

相关文章:

javascript - 单击 Bootstrap 链接内的插入符号图标不起作用

html - HR没有出现在适当的位置

javascript - 检查 JavaScript 中方法可用性的最佳方法

javascript - jQuery 命名空间和使用 "this"

javascript - 在 iPad 上捕获 Click on DOM/HTML/BODY 事件

html - 如何使用水平滚动条调整 100vh 高度?

javascript - 使用 Javascript 和 php 上传调整大小的图像并为该图像命名。

javascript - 性能 - 功能组件中的功能

javascript - 调整 Godaddy 信任印章的大小

javascript - 数字比较在 jquery 中不起作用