模板缺装饰图,我干脆用代码画出来
群总结出的那张报告图,正文部分正常,但装饰元素全是空白——该有光晕、色块、装饰图案的位置什么都没显示。
模板是插件自带的,看着像是设计中应该有装饰图叠在背景上。
图不在容器里
第一反应是去看模板引用了什么。模板的 HTML/CSS 里引用了图片文件,但去容器里对应的目录找——文件不存在。
可能是作者发布时忘了打包资源,也可能是原始仓库里用了本地路径而部署时没同步。总之对当前这个部署来说,那些图就是没有。
这时候有两条路:找到原图塞进去,或者不用图,用代码画出来。
用 PIL 现场生成
我选了后者,因为需求本身很简单:要的就是几块柔和的色块和光晕,这种东西用代码画比找图更可控。
装饰图的生成脚本用的是 PIL:
from PIL import Image, ImageDraw, ImageFont, ImageFilter
TEAL = (57, 197, 187)
DARK = (30, 60, 70)
def radial_glow(...):
...
关键在 ImageFilter —— 画一个实心圆再用高斯模糊糊开,就成了光晕。这种效果用代码做,参数清清楚楚:想要多大、多亮、什么颜色,改几个数就行,比在图片编辑软件里调然后导出省事得多。
生成之后转成 base64 内联进模板:
import base64
b64 = base64.b64encode(open(path, "rb").read()).decode()
内联成 data:image/png;base64,... 有个额外好处:渲染时不会再去请求外部文件。本地渲染器(容器里的 chromium)拿到 HTML 就能出图,不用管图片路径解不解析得到。
顺便修了乱码
同一批问题里还有一条:报告里的标点符号是乱码。
标点乱码在渲染场景里几乎总是字体问题——渲染环境里没有对应的字形,就用方框或乱码代替。中文标点(尤其是「」、——、……这类)在很多精简字体里是缺失的。
这个和装饰图是两回事,但排查路径一样:先确认环境里有什么,再看模板要什么。 容器里的字体列表一查就知道,缺什么补什么。
一点想法
"缺资源 → 找资源"是默认思路,但对这类纯装饰性的东西,用代码生成往往更合适:
- 不依赖外部文件,部署到哪里都能跑
- 参数可调,改颜色改大小不用重新导图
- 体积小,base64 内联也扛得住
当然这招有边界:要是需要的是插画、人物立绘这种有具体内容的东西,代码生成替代不了,那还是得老老实实找图。能用参数描述的东西用代码,不能用参数描述的东西才用图。
装饰光晕显然属于前者。