从字体创建文本预览的方法
我目前正在使用 ImageMagick 的转换命令从 .ttf 字体文件创建文本预览 (.png)。总的来说，尽管有时无法读取一些有效的 .ttf 文件，但它在自动文本定位方面表现更好。速度不是很快但是可以接受。
PIL的ImageFont看起来不擅长文本对齐，经常在画布外打印第一个字符的左下角。
除了上述两个之外，有人知道还有更好的选择吗？我想知道需要什么技术来支持像 myfonts.com 这样流量如此大的网站上的文本预览部分。
编辑
PIL 字体示例未能正确绘制字体。示例中使用的字体是 Hanford script
import Image, ImageDraw, ImageFont
font = ImageFont.truetype('HANFORD_.TTF', 122)
text_width, text_height = font.getsize('Hanford script')
print text_width, text_height
>>> 833 47
img = Image.new('RGBA', (text_width, text_height))
draw = ImageDraw.Draw(img)
draw.text((0, 0), 'Hanford script', font=font, fill=(0, 0, 0))
img.save('output.png')
输出图像仅包含上半部分“汉福德剧本”。
我尝试使用 imagemagick 的转换命令：
convert -font "HANFORD_.TTF" -background transparent -gravity center -size 830x80 label:'Hanford script' output.png
输出图像与我通过 PIL 得到的图像相同。
它并不是 PIL 或 imagemagick 无法获得正确文本大小的唯一字体。对于其他一些字体，例如 Ginga，它们只是放大文本高度，从而导致上半部分的输出图像为空白。有人知道原因吗？
I'm currently using ImageMagick's convert command to create text preview (.png) from .ttf font file. Overall, it's better in auto text positioning despite it failed to read some valid .ttf file sometimes. The speed is not great but acceptable.
PIL's ImageFont looks like is not good at text aligning, often prints bottom-left corner of first character outside canvas.
Does anyone know any better choices beside the above two? I wonder what tech is needed to power the text preview part on sites like myfonts.com with so heavy traffic.
EDIT
Example of PIL Font failed to draw fonts correctly. Font used in the example is Hanford script
import Image, ImageDraw, ImageFont
font = ImageFont.truetype('HANFORD_.TTF', 122)
text_width, text_height = font.getsize('Hanford script')
print text_width, text_height
>>> 833 47
img = Image.new('RGBA', (text_width, text_height))
draw = ImageDraw.Draw(img)
draw.text((0, 0), 'Hanford script', font=font, fill=(0, 0, 0))
img.save('output.png')
The output image only contains upper half of "Hanford script".
I tried with imagemagick's convert command:
convert -font "HANFORD_.TTF" -background transparent -gravity center -size 830x80 label:'Hanford script' output.png
The output image was same as what I got by PIL.
It's not the only font that PIL or imagemagick cannot get correct text size. With some other fonts, like Ginga, they just amplify text height which result in upper half of output images are blank. Anyone knows the reason?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
我想这些网站是由一些自定义代码驱动的，使用诸如 Pango 之类的东西，或者只是简单的 < a href="http://www.freetype.org/" rel="nofollow noreferrer">Freetype 在后端渲染到图像文件。
尽管我确信图像会在适当的地方进行缓存，但这些图像很可能永远不会写入光盘。
I imagine that such sites are driven by a little custom code using something like Pango, or just bare-bones Freetype at the back end to render to image files.
The images may well never even hit the disc, although I'm sure things are cached where appropriate.
这有点奇怪，但是您看过sIFR（可扩展 Inman 闪存替换）？它用于允许网页设计者插入短文本块（标题等），并以他们选择使用的任何字体呈现文本，即使用户没有在本地安装它。
如果您要使用 sIFR 创建一个简单的网页，并在本地将其提供给您自己，那么它可能适合您的目的。
就像我说的，这是一个奇怪的解决方案，但是......:-)
This is sort of off-the-wall, but have you looked at sIFR (Scalable Inman Flash Replacement)? It is used to allow web designers to insert short text chunks (headings and such) with text rendered in any font they choose to use, even though the user does not have it installed locally.
If you were to create a simple web page using sIFR and the served it locally to yourself it might suit your purposes.
Like I said, it's kind of a screwy solution, but ... :-)
我也有同样的问题。几天前，我发现了这个图书馆。我尝试了一下，看起来确实很有用。我分享链接，因为我也遇到了同样的问题。
https://github.com/MatteoGuadrini/fontpreview
字体预览示例：
I also had the same problem. A few days ago, I discovered this library. I tried it and it seemed really useful. I share the link as I also had the same problem.
https://github.com/MatteoGuadrini/fontpreview
Example of font preview: