I was searching a lot for properties like maxLines
, noWrap
, splitByWhitespace
, etc. in Fabric.js documentation, but they don't exist. Do you know a working solution to disable text wrapping inside fabric.Textbox
?
my code:
const text = new window.fabric.Textbox('expected single line', {
fontFamily: 'Nunito Sans',
fontWeight: 400,
fontSize: 15,
originX: 'center',
originY: 'center',
});
const border = new window.fabric.Rect({
rx: 10,
ry: 10,
fill: '#999999',
height: text.height + 10,
width: text.width + 100,
originX: 'center',
originY: 'center',
});
const group = new window.fabric.Group([border, text], {
originX: 'left',
originY: 'top',
hasRotatingPoint: false,
height: 42,
width: 200,
top: 167,
left: 50,
});
canvas.add(group);
actual result demo:
as you can see there are line breaks on every whitespace, but I want to have a single-line text with spaces. interestingly, if I replace whitespaces with underscore _
, I get one-line text.
demo:
from Fabric.js - how to create TextBox without line breaks?
No comments:
Post a Comment