Fabric Js i-使用自定义字体时，文本被截断/剪切文本的最后一个单词
Fabric.js是一个强大的HTML5 canvas库，用于创建交互式的图形应用程序。它提供了丰富的功能，包括绘制图形、图像处理、文本操作等。
当使用自定义字体时，Fabric.js可能会出现文本被截断或剪切文本的最后一个单词的问题。这是由于字体加载的延迟导致的，Fabric.js在字体加载完成之前无法正确计算文本的宽度。
为了解决这个问题，可以采取以下步骤：
- 确保字体文件已正确加载：在使用自定义字体之前，确保字体文件已正确加载到页面中。可以使用CSS的@font-face规则来加载字体文件。
- 使用font-family属性指定字体：在Fabric.js中，可以使用对象的set()方法来设置文本对象的字体属性。确保在设置字体时使用正确的font-family属性值，以匹配加载的字体文件。
- 等待字体加载完成后再绘制文本：在使用自定义字体绘制文本之前，可以使用FontFace对象来检查字体是否已加载完成。可以使用FontFace对象的load()方法来加载字体，并使用FontFaceSet对象的ready属性来检查字体是否已加载完成。只有在字体加载完成后，才绘制文本。
- 动态调整文本对象的宽度：如果文本仍然被截断或剪切最后一个单词，可以尝试动态调整文本对象的宽度。可以使用文本对象的getWidthOfChar()方法来获取每个字符的宽度，然后根据文本的长度和字符宽度来调整文本对象的宽度。
腾讯云相关产品推荐：
- 腾讯云云服务器（CVM）：提供可扩展的云计算能力，用于部署和运行应用程序。
- 腾讯云对象存储（COS）：提供安全、可靠、低成本的对象存储服务，用于存储和管理大量的非结构化数据。
- 腾讯云云数据库MySQL版（TencentDB for MySQL）：提供高性能、可扩展的关系型数据库服务，用于存储和管理结构化数据。
更多腾讯云产品信息和介绍，请访问腾讯云官方网站：https://cloud.tencent.com/
相关·内容
1回答
Fabric Js i-使用自定义字体时，文本被截断/剪切文本的最后一个单词
canvas、fabricjs
我正在使用Fabric Js 2.7.0版本，我正在制作一个文本编辑器，用户可以在其中添加/更新新文本，并为该文本选择自定义字体。当用户保存他的更改时，我从canavs生成json并将其存储在DB中，但问题是当我们在画布编辑器中加载相同的json时，文本的最后几个单词被剪切<
浏览 26提问于2019-08-16得票数 0
回答已采纳
1回答
OpenOffice Base 4.0.1打印右对齐域
printing、openoffice-base
我在使用OpenOfice Base 4.0.1创建的表单时遇到问题
在表单中有一些文本字段，多行，右对齐。虽然输入一切正常:它工作正常，但打印不能正确执行:右对齐的字段在文本末尾被剪切(文本的最后一个字符被截断)。这看起来像是一个对齐问题，好像系统不能正确计算文本的起始位置，因此文本
浏览 23提问于2014-01-02得票数 0
1回答
Graphics.DrawString内联字体更改C#
c#、graphics、compact-framework
我正在创建一个应用程序，它将在一个格式良好的段落中显示JSON数据。JSON数据有标题、副标题、正文等内容。正文中可能有链接(我只需要将其显示为蓝色并带下划线)，这就是我遇到麻烦的地方。这个程序是基于JSON的，我只得到了一个图形对象和.net对象(以及一个矩形、字体和颜色)。有没有办法很好地绘制一串文本，并将所有链接更改为不同的颜色/font？我的想法是绘制每个单独的<
浏览 2提问于2010-12-11得票数 0
回答已采纳
2回答
如何阻止UIBarButtonItem文本截断？
ios、objective-c、uibarbuttonitem、truncate
我在导航栏中有一个UIBarButtonItem，其文本标题为"Save“。当我转换到一个全屏UIPopoverController，然后取消它时，我的UIBarButtonItem中的文本会被截断为“S.e”。对于所有其他的海格和观点，我在返回时没有问题。我已经尝试手动更改宽度和设置"possibleTitles“以包含长单词，但我无法停止截断。
我使
浏览 1提问于2016-08-25得票数 4
回答已采纳
2回答
Fabric js字体系列问题
javascript、fonts、fabricjs
我使用的是angular 7的fabric js版本1.7.22，我正在制作文本编辑器。我的问题是，当我使用以下代码将文本添加到具有自定义字体的画布中时。var canvas= new fabric.Canvas('c');
var junction_font = new FontFace('3d.demo'
浏览 0提问于2019-08-10得票数 3
1回答
在与Fabric.js关联的画布外部使用Cufon
javascript、cufon、fabricjs
当我尝试在与Fabric.js关联的画布之外使用Cufon lib时，我遇到了一个问题。我正在尝试在我的应用程序中创建一个文本字体选择器，它将显示可用的字体。选择器将字体名称显示为字体示例(如Photoshop等)。因此，为了构建示例名称，我尝试使用Cufon替换字体样式，但Fabric.<e
浏览 3提问于2012-03-22得票数 2
4回答
让UILabel生成省略号而不是缩小字体
iphone、objective-c、xcode、uilabel
当我动态更改UILabel的文本时，我更希望得到一个省略号(点，点，点)，而不是让文本自动调整大小。如何做到这一点？换句话说，如果我使用字体大小为14的单词Cat进行UILabel，然后我将该单词更改为Hippopotamus，则字体将缩小以适合所有单词。我宁愿这个词被自动截断，后面跟着一个省略号。我假设有一个
浏览 0提问于2011-10-11得票数 34
回答已采纳
1回答
使用自定义字体的Fabric js i文本框大小调整问题
fonts、size、fabricjs
我有一个问题的神话IText盒大小自定义字体。戈德萨
当我选择上述字体之一时，文本框大小比默认文本"Vloz text“更大(文本和框边框的末尾有空格)，但对于某些standart字体，例如"Arial”文本脚到文本框(没有提到空格此外，如果"Goldsaber“文本框的大小越来
浏览 2提问于2017-04-06得票数 0
2回答
如何在iOS上通过setNumberOfLines:1使用NSLineBreakByCharWrapping？
ios、uilabel、word-wrap
例如，如果UILabel的文本是："Questions that may already have your answer"，我希望它打印"Questions that may alr"。我不想剪切最后一个字符，而是在这一点上剪切文本。
我不能使用字符限制，因为大多数字体都不是等宽字体。我不能使用裁剪，因为它可能会在另一个点上剪切</
浏览 16提问于2014-03-24得票数 1
10回答
Crystal Reports在PDF中剪切文本
pdf、text、crystal-reports、crystal-reports-2008、crystal-reports-10
我在上找到了这篇文章，但它并没有解决我的问题。
在此示例中，文本在右侧被截断，但在某些情况下，当文本由许多行组成时，最后一行的<
浏览 17提问于2010-03-06得票数 12
回答已采纳
2回答
句子中的第一个单词具有较大的字体大小:容器元素将其从顶部截断
overflow、font-size、css
我的网站的第一个单词的正文比其他单词的字体要大得多。由于这样或那样的原因，包含文本的容器会将顶部的第一个单词去掉。可能是因为第一个单词的行高与文本的其余部分相同，因此容器无法正确计算自己的高度。Codepen代码片段： (我已经包含了css
浏览 2提问于2012-10-29得票数 0
2回答
如何减少fabric js中文本对象中的选择区域
jquery、html、canvas、fabricjs、spacing
在这里，我们在fabric.js中创建了设计tool.We，减少了fabric js中文本对象中选择区域的填充。画布对象文本被高亮显示/选中，虽然它与原始大小一样大，但选中的框在工作的area.This上并不像处理此issue.How那样友好，以减少画布对象中的选择区域填充大小。我们尝试在"Canvas.set()"函数中添加填充，但它不是工作区域的响
浏览 4提问于2016-11-30得票数 1
回答已采纳
2回答
某些字体的字符宽度计算错误，可能会导致自动缩进
fabricjs
我创建了一个普通的文本框并在里面输入了一些"i"s，我使用的字体是Lobster1.3，正如你所看到的，我只选择了一个字符，但结果不正确
这是选择时的最后一个字符位置。看起来像Lobster1.3这样的可以自动缩进的字体可能会导致某些字符宽度计算错误
浏览 2提问于2016-08-17得票数 3
1回答
当SVG包含具有自定义字体的文本时，FabricJS不正确地呈现SVG？
html5-canvas、fabricjs、fabricjs2、node-canvas
当SVG包含具有自定义字体的文本时，我有一个问题与渲染SVG在构造in。
如何使SVG在Fabricjs中用自定义字体显示正确？这是我的代码：var canvasObject = document.getElementById("editorCanvas");
width: 100
浏览 1提问于2019-06-18得票数 2
回答已采纳
3回答
使用fabric.js在画布上绘制文本
text、canvas、draw、fabricjs
我想在画布上绘制文本，如何做任何示例示例？画布已经包含了一些绘制的形状，我想在画布上的该形状的顶部显示文本，我该怎么做？
浏览 1提问于2011-10-19得票数 6
回答已采纳
1回答
织物js中边框外的文本
canvas、fonts、fabricjs、bounding-box、font-family
我使用fabric js作为注释。我正面临一个问题，同时添加特定字体系列的文本。当我添加文本时，它会超出边框，这就是为什么移除外部文本的原因。如何修复边框内的文本？
浏览 0提问于2021-08-17得票数 0
2回答
复杂正则表达式
regex
我想捕获选择字符数的字符串的子字符串，但如果有任何单词被剪切，则get直到最后一个空格。例如，如果这是文本：12个字符表示"This is a e“。在这种情况下，最后一个单词被删除，因此结果应该是"This is an“。使用正则表达式可以做到这一点吗？
浏览 0提问于2011-01-15得票数 3
回答已采纳
13回答
在android中，为了响应本机，文本被切断了。
android、reactjs、react-native、text
我试着显示文本，但是，它显示在文本的android端.而没有显示完整的文字。这只发生在安卓系统中，在iOS中运行良好。
浏览 0提问于2019-02-18得票数 17
回答已采纳
2回答
将SwiftUI文本包装成两列
ios、swift、swiftui
我正在构建一个小部件，它将保存一些文本，这是一个简短的单词和短语的列表。就像这样：因为它是一个短项的列表，所以如果它可以包装成两列的话，它会工作得最好。下面是当前的简单代码(删除字体和空格)：
var body:Text("Updated in 6 hour
浏览 7提问于2021-05-07得票数 1
回答已采纳
1回答
ocr :解开行尾的单词并保留段落
r、dplyr、stringr
我有一个字符串的向量。向量的每个元素对应于一行角化的文本。每一行的最后一个单词可以被短划线截断(或不截断)，并继续到下一行，即向量的下一个元素。Quisque euismod, ex vel -aliquam- vestibulum",
"Nulla lacinia volutpat ipsum sed condim
浏览 14提问于2021-10-08得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频活动推荐
腾讯云开发者
