Multiple Line Breaks & Detecting Rollover

[FireController1847]

When creating a Jimp and adding text, I want to add multiple lines like so:

async function modifyImage() {
  const img = await global.jimp.read("red_black_bg.png");
  const font = await global.jimp.loadFont("font.fnt");
  img.print(font, 10, 380, 'I Know What You Did Last Summer', 1920); // text 1
  img.print(font, 10, 500, 'Shawn Mendes & Camila Cabello', 1920); // text 2
  img.getBuffer(global.jimp.MIME_PNG, function(err, buffer) {
    if (err) throw new Error(error);
    else m.channel.send({files: [buffer]});
  });
}

The issue is, when text 1 wraps, it overlaps with text 2. Is it possible to detect this at all? I've tried inserting line-breaks into the first text but that doesn't seem to work.

Here's an example:

async function modifyImage() {
  const img = await global.jimp.read("red_black_bg.png");
  const font = await global.jimp.loadFont("font.fnt");
  img.print(font, 10, 380, 'I Know What You Did Last Summer ABCDEFGHIJKLMNOP', 1920); // text 1
  img.print(font, 10, 500, 'Shawn Mendes & Camila Cabello', 1920); // text 2
  img.getBuffer(global.jimp.MIME_PNG, function(err, buffer) {
    if (err) throw new Error(error);
    else m.channel.send({files: [buffer]});
  });
}

In the example above, the "ABCDEFGHIJKLMNOP" overlaps the text 2 as seen in the result:

I've pulled this off using Node.js v9.2.0 using npm 5.5.1. I don't know any other languages so.. that's all I can give you.

[ghost]

It seems Jimp is very common with people using Discord.js.

To address the issue here you're placing the test in an absolute location. It doesn't know there is text already there as it is now literally pixels.

[FireController1847]

That makes sense, but would it be possible to have something that, say, detected how long the text would be (in pixels), and then rollover if a word/letter goes past the specified size?

[ghost]

IT does do that, hence the rollover in the first place. You're defining the position of the second text with an X value, and if it decided arbitrarily to put something NOT where you said to put it, it's unreliable.

[ghost]

(close this please)

[FireController1847]

When I was using the module, and I put a single line of text, it did not roll over and instead went off the side of the image.

[hipstersmoothie]

@FireController1847 can you provide an example of putting all the text in one line and it going off the screen? Line wrapping seems to be working in your above example.

[hipstersmoothie]

Closing:

• You are expicitely telling jimp where to put this. Expose y position in print callback #506 asks for a way to know how many lines a block of text will be
• text wrapping is working. if @FireController1847 can provide an example please file a new issue

[FireController1847]

apologies for not responding, honestly it's been so long I forgot about the issue and I'm not even attempting this anymore lol

[johnxy84]

I have an issue with the text wrapping not still working with latest jimp version. I have an open issue here,
#710 but no feedback on it yet