Fabric.js文本宽度被忽略

 steveukuk 发布于 2022-12-30 02:14

我试图从表单输入添加文本到画布.有没有办法自动包装fabricjs文本,以适应画布内?

我试图克服3个问题:1.如果字符串长于给定空间,则文本不尊重'text.left'位置.2.我无法逃避换行符,因此\n与文本内联写入.3.在更新文本之前,完全忽略中心对齐.

这是我的面料文字:

var text = new fabric.Text($('#myInput').text(), {
    left: 10,
    top: 12,
    width: 230,
    textAlign: 'center',
    fontSize: 28,
    fontFamily: 'Helvetica Nue, Helvetica, Sans-Serif, Arial, Trebuchet MS'
});

显示问题的小提琴.

如何插入换行符?如何在给定的文本块中居中对齐文本?如何在不需要编辑的情况下将文本块放在画布上?

编辑:

我发现我的部分问题来自于使用文本输入.我将其更改为textarea元素,现在可以轻松插入换行符.奇怪的是,当我这样做时,居中也会起作用.

我想唯一的问题是当文本宽于给定的文本块宽度时,文本不会自动换行.因此,它不仅包装和添加线条,而是延伸到画布之外.

有没有办法做wordwrap类型样式或我必须计算字符和插入换行符?

撰写答案
今天,你开发时遇到什么问题呢?
立即提问
热门标签
PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有