gm文字加背景图生成图片

gm文字加背景图生成图片

月光魔力鸭

2021-04-20 13:21 阅读 949 喜欢 0 gm imagemagic font

有一个需求,需要公司的LOGO信息,但是没有,只有公司的名字,想着先生成个默认的(本来是可以通过前端判断然后合成的..但是不想改小程序了),于是开始准备处理。

一般来说图片处理的话 gm 还是用的比较多的,可是碰到了很奇怪的问题。

const gm = require('gm');
gm(200, 100, "#4499ee")
.font('./font.ttf')
.drawText(10, 50, "中文")
.write("./coll/test.png", function (err) {
  console.log(err);
});
中文乱码

我开始还以为是我字体的问题,开始使用 ttc otf ,最后换成ttf 都没解决,顺便说一句,网上在线ttc转ttf 或 otf 转ttf 的随便找了几个都不能用,最后还是安装了FontCreator 来另存的(这又是一段伤心的故事,我找字体都找了好久,最后还是跟设计MM要的..心塞)

说回乱码的问题,这并不是字体的问题,是gm,不支持中文,可以通过使用imagemagic 来做中文处理,改成如下:

const gm = require('gm');
var imageMagick = gm.subClass({ imageMagick: true });
imageMagick(200, 100, "#4499ee")
.font('./font.ttf')
.drawText(10, 50, "中文")
.write("./coll/test.png", function (err) {
  console.log(err);
});

我之前是安装的gm ,上个电脑装的imageMagic ,刚好踩过这个坑。 坑的名字叫: ImageMagic command failed ... 出坑地址在这里:https://chrunlee.cn/article/nodejs-imagemagick-command.html

现在就可以无忧无虑的生成啦...

转载请注明出处: https://chrunlee.cn/article/gm-create-pic-with-font.html


感谢支持!

赞赏支持
提交评论
评论信息 (请文明评论)
暂无评论,快来快来写想法...
推荐
为什么要读取图片呢?需求来源于这里。我有一大堆的ppt文件,里面全是图片,想将这些图片全部拿到,然后存储在数据库中,在线上预览,一张张的保存我自然是不乐意的。
开始入手webpack ,直接看的官方文档和demo,对于自动刷新这部分还是希望通过express 加载插件来控制,但是文档没有提供,经过参考github上其他高玩的套路,最终整理了一个基础的配置版本。
产品版本更新的时候经常会有一些数据库的差异,如果版本管理好的话,一步一步升级即可.. 但是如果好久没更新的话,还是有很多不确定的,只能挨着比对表和字段。比对了一次就烦了,写了这么一个工具,查询差异表和字段并给出sql语句。
前几天给朋友帮忙,想要一个一模一样的网站...自告奋勇去帮忙.. 结果发现之前一直没处理过类似的情况,虽然也写过爬虫,不过看了下网站,也不算麻烦。于是简单实现了这个自动抓站的功能,最终整理成为一个自动抓站的工具,能省很多的事情。
之前在知乎上有看到,基本上都是一致的,这里提供一个nodejs版本的针对微信内dat文件进行处理恢复为图片的方法。
最近家里正在装修,实在是不知道怎么做,之前看好好住APP上有不少设计的图,部分还挺好看。。就去看了下有没有WEB端,结果还真有,就有了下文,我抓了几万张图片,然后根据关键字进行分类,从里面找心仪的设计。
在平时nodejs练习过程中,可能会安装多个不同版本的nodejs,那么我们如何来轻松的管理和切换呢?推荐你一个nvm来试试水