使用Node.js(以及NPM软件包“psd”)解析Adobe PSD文件,可编程替换图像层,然后保存/渲染为PNG。

11
为了一个项目,我需要编程解析一个 Adobe Photoshop PSD 文件,找到并替换其中的图像层,然后将其保存回 PSD 文件和/或导出为 PNG(或 JPEG)。虽然我没有太多使用 Adobe Photoshop 的经验,但我认为这些类型的层被称为“智能层”。
应用场景:
渲染模型预览图像
用户上传图像到 Node HTTP 服务器
用上传的图像替换 PSD 中的层(图像填充层)
以 PNG/JPEG 格式呈现并写入 HTTP 响应
替换层是3D倾斜的模板。我已经包括了一张图片来说明这意味着什么。未来将创建更多的模型模板,这就是我认为用常量值标记替换层的方法实现此目的的原因。
模板文件: template file 上传的图像: uploaded image 最终呈现的图像: output image 我不需要关于 HTTP 服务器/身份验证等方面的帮助,那部分很简单。我需要一种替换图像层的方法。

PSD文件是/将会根据这个特定项目进行定制。根据图层名称(标签)识别要替换的正确图层是可接受的实现方式。

我查看了几个NPM包来完成这项工作,但没有能够获得一个功能齐全的原型。这个包似乎是最有前途的。

https://www.npmjs.com/package/psd

我目前有以下代码:

/* mockup.js */
var PSD = require('psd')
var psd = PSD.fromFile("mockup.psd")
var fs = require('fs')

psd.parse()

/* For easier reference */
var replacementLayer, file, fileBuffer

let tree = psd.tree()

let layers = tree.layer.node._children

for(let layer of layers) {
    /* i named the layer 'replacementLayer' */
    if(layer.name == 'replacementLayer') { 
        replacementLayer = layer 
        file = replacementLayer.layer.file
        fileBuffer = replacementLayer.layer.file.data
    }
}

/* replacementLayer = instanceof Layer
   file = instanceof File with a property 'data' (data is a buffer)
   fileBuffer = instanceof Buffer */   

我尝试了多种打开图像文件并替换 PSD 中的 replacementLayer 的方法,但是无法使其工作。仅用新的 Buffer 对象覆盖该属性是不够的。
将图像保存为 PNG 就像这样简单:
psd.image.saveAsPng('./output.png')

理想情况下,用于替换 replacementLayer 的图像应该填充到层的宽度和高度。有什么想法吗?

你有扭曲图像的算法吗?因为简单的“替换”图层在这种情况下行不通。 - duck
你有在Node中弄清楚这个问题吗? - HMilbradt
@HMilbradt 不,我没有。 - Jochem Stoel
@JochemStoel,你有没有解决这个问题的机会?我正在寻找类似的东西。谢谢。 - spamserv
1个回答

0

ag-psd 可以处理这个问题,但是保存的 PSD 文件无法渲染最外层。


请在您的回答中提供更多细节。目前的写法让人难以理解您的解决方案。 - Community
这并没有回答问题。一旦您拥有足够的声望,您将能够评论任何帖子;相反,提供不需要询问者澄清的答案 - Dmytro

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接