【发布时间】：2019-03-09 22:58:39
【问题描述】：
有一个 PSDfile 可以用一个基本图像（https://www.dropbox.com/s/8nlpnwx4771uwoe/Lanyard_Mockup_1.psd?dl=0）制作挂绳。我想用 psd.js 工具编辑基础图像。如果我们在 Photoshop 中打开 PSD 文档并编辑智能对象，那么整个挂绳设计就会发生变化。谁能帮我解决一下
导出 psd 对象后我得到以下 JSON。
{
"children": [
{
"type": "layer",
"visible": true,
"opacity": 0,
"blendingMode": "normal",
"name": "Lanyard project",
"left": -1054,
"right": 0,
"top": -153,
"bottom": 45,
"height": 198,
"width": 1054,
"mask": {},
"image": {}
},
{
"type": "group",
"visible": true,
"opacity": 1,
"blendingMode": "normal",
"name": "Mockup",
"left": -441,
"right": 2637,
"top": 0,
"bottom": 1000,
"height": 1000,
"width": 3078,
"children": [
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "normal",
"name": "Highlights",
"left": 0,
"right": 2500,
"top": 0,
"bottom": 1000,
"height": 1000,
"width": 2500,
"mask": {
"top": 396,
"left": 270,
"bottom": 664,
"right": 2448,
"width": 2178,
"height": 268,
"defaultColor": 0,
"relative": false,
"disabled": false,
"invert": false
},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "linear_burn",
"name": "LANYARD MOCKUP copy 5",
"left": 1412,
"right": 2395,
"top": 382,
"bottom": 571,
"height": 189,
"width": 983,
"mask": {
"top": 454,
"left": 1324,
"bottom": 726,
"right": 2393,
"width": 1069,
"height": 272,
"defaultColor": 255,
"relative": false,
"disabled": false,
"invert": false
},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "linear_burn",
"name": "LANYARD MOCKUP copy 9",
"left": -441,
"right": 382,
"top": 461,
"bottom": 648,
"height": 187,
"width": 823,
"mask": {
"top": 455,
"left": 269,
"bottom": 625,
"right": 389,
"width": 120,
"height": 170,
"defaultColor": 0,
"relative": false,
"disabled": false,
"invert": false
},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "linear_burn",
"name": "LANYARD MOCKUP copy 4",
"left": 364,
"right": 1418,
"top": 417,
"bottom": 612,
"height": 195,
"width": 1054,
"mask": {},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "linear_burn",
"name": "LANYARD MOCKUP copy 8",
"left": 2035,
"right": 2448,
"top": 186,
"bottom": 852,
"height": 666,
"width": 413,
"mask": {
"top": 451,
"left": 2307,
"bottom": 599,
"right": 2465,
"width": 158,
"height": 148,
"defaultColor": 0,
"relative": false,
"disabled": false,
"invert": false
},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "linear_burn",
"name": "LANYARD MOCKUP copy 7",
"left": 1633,
"right": 2637,
"top": 519,
"bottom": 666,
"height": 147,
"width": 1004,
"mask": {
"top": 511,
"left": 1630,
"bottom": 725,
"right": 2500,
"width": 870,
"height": 214,
"defaultColor": 0,
"relative": false,
"disabled": false,
"invert": false
},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "linear_burn",
"name": "LANYARD MOCKUP copy 6",
"left": 487,
"right": 1645,
"top": 464,
"bottom": 650,
"height": 186,
"width": 1158,
"mask": {
"top": 461,
"left": 484,
"bottom": 653,
"right": 1646,
"width": 1162,
"height": 192,
"defaultColor": 0,
"relative": false,
"disabled": false,
"invert": false
},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "normal",
"name": "Levels 1",
"left": 56,
"right": 2449,
"top": 395,
"bottom": 666,
"height": 271,
"width": 2393,
"mask": {},
"image": {}
}
]
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "linear_burn",
"name": "Shadow",
"left": 0,
"right": 2500,
"top": 0,
"bottom": 1000,
"height": 1000,
"width": 2500,
"mask": {
"top": 0,
"left": 0,
"bottom": 1000,
"right": 2500,
"width": 2500,
"height": 1000,
"defaultColor": 255,
"relative": false,
"disabled": false,
"invert": false
},
"image": {}
},
{
"type": "layer",
"visible": true,
"opacity": 1,
"blendingMode": "normal",
"name": "Background color",
"left": 0,
"right": 2500,
"top": 0,
"bottom": 1000,
"height": 1000,
"width": 2500,
"mask": {
"top": 0,
"left": 0,
"bottom": 0,
"right": 0,
"width": 0,
"height": 0,
"defaultColor": 255,
"relative": false,
"disabled": false,
"invert": false
},
"image": {}
}
],
"document": {
"width": 2500,
"height": 1000,
"resources": {
"layerComps": [],
"guides": [],
"slices": []
}
}
【问题讨论】：
-
PSD.js 是一个文件解析器，你想用它编辑你的图像是什么意思？你到底想做什么？预期的结果是什么？不清楚你想要什么
-
谢尔盖 kritskiy 感谢您的回复。如果您在 Photoshop 中打开 psd 文档并编辑第 1 层图像，您可以看到整个挂绳已更改。我正在制作一个应用程序，用户可以在其中上传 psd 模型和基本图像。该应用程序将通过组合基本图像和模型返回挂绳图像。对不起我的英语不好
-
对不起，我还是不明白是什么问题。在视频中，一切正常：有一个隐藏的智能对象，您对其进行编辑，然后更新其所有转换后的副本。如果您的问题是如何在网络应用程序中实现相同的功能，那么我不知道，抱歉，也许更有经验的人可以提供帮助：这就像一项非常复杂的任务
-
@SergeyKritskiy 感谢您的回复 是的，我想将此功能实现为 Web 应用程序。用户可以上传基础图像（视频中正在编辑的智能对象）并获得挂绳的完成图像。在 PSD.js 中能够提取挂绳的各个组件，但停留在编辑部分。反正会等别人来指导我。再次感谢:)
标签： javascript photoshop psd