ImageMagick固定文本宽度及图片合成问题求助

需求与现有代码 #

想要生成如下样式的图片：

目前使用gm模块，通过out命令实现固定文本宽度，代码如下：

const gm = require("gm").subClass({ imageMagick: true });
gm(1800, 2400, "transparent")
  .fill("#ffffff")
  .drawRectangle(400, 400, 1400, 1400)
  .font("ananda.ttf", 90)
  .background("transparent")
  .out("-size","1600","-gravity","center","caption: very very very long text very very very long text long long","-geometry","+0+400","-composite")
  .write("drawing.png", function (err) {
    if (err) return console.dir(arguments);
    console.log(this.outname + " created  :: " + arguments[3]);
  });

尝试添加.composite(foregroundImagePath)时报错：

'0': Error: Command failed: composite: unrecognized option '-fill' @ error/composite.c/CompositeImageCommand/1021.

1. 替代out命令实现固定文本宽度的方式 #

直接使用gm原生的caption方法即可，无需通过out拼接原生命令，这种方式更贴合gm的链式调用规范，可读性和维护性更强：

const gm = require("gm").subClass({ imageMagick: true });
gm(1800, 2400, "transparent")
  .fill("#ffffff")
  .drawRectangle(400, 400, 1400, 1400)
  .font("ananda.ttf", 90)
  .background("transparent")
  // 第二个参数即为文本固定宽度，自动换行适配
  .caption("very very very long text very very very long text long long", 1600)
  .gravity("center")
  .geometry("+0+400")
  .write("drawing.png", function (err) {
    if (err) return console.dir(arguments);
    console.log(this.outname + " created  :: " + arguments[3]);
  });

2. 正确添加前景图片的方法 #

报错原因是composite命令不识别-fill这类属于convert命令的参数，你混用了out("-composite")和.composite()方法，导致触发了两次composite工具调用，参数冲突。

推荐统一使用gm的composite方法，将前景图合成步骤嵌入链式流程：

const gm = require("gm").subClass({ imageMagick: true });
const foregroundImagePath = "./your-foreground-image.png"; // 替换为你的前景图路径

gm(1800, 2400, "transparent")
  .fill("#ffffff")
  .drawRectangle(400, 400, 1400, 1400)
  .font("ananda.ttf", 90)
  .background("transparent")
  // 先添加文本
  .caption("very very very long text very very very long text long long", 1600)
  .gravity("center")
  .geometry("+0+400")
  // 合成前景图，可通过gravity和geometry调整位置
  .composite(foregroundImagePath)
  .gravity("center")
  .geometry("+0+0")
  .write("drawing.png", function (err) {
    if (err) return console.dir(arguments);
    console.log(this.outname + " created  :: " + arguments[3]);
  });

如果一定要用原生命令方式，需确保-composite仅出现一次，且放在所有convert类参数之后，同时不要调用.composite()方法，避免工具切换导致的参数不兼容。

内容的提问来源于stack exchange，提问作者Lasharela