尝试调整裁剪坐标以适应新的纵横比
我正在使用 .NET 的 www.imageresizing.net 工具来动态创建图库和缩略图。该组件的真正优点是您只需更改 URL 即可重新裁剪图像并调整图像大小。
现在，我所拥有的是按照我所需的宽高比 (9:5) 正确渲染的图库图像，如下所示：
upload/289.jpg?crop=22,30,562,330&width=540&height=300
您会注意到上面定义的裁剪坐标 22,30,562,330 (X1,Y1,X2,Y2) 这会选择一个 22 像素长、向下 30 像素、宽 562 像素、距底部 330 像素的区域。所以基本上是在较大图像（640x427，但这与问题无关）中心的 540x300px 粗略裁剪区域。
正如所说，这显示得很好并且具有正确的宽高比。然后，我可以使用以下方法将 URL 更改为缩略图版本：
upload/289.jpg?crop=22,30,562,330&width=120&height=67
我之前计算出 120x67（准确地说是 120.6x67 像素） 是保持纵横比的正确宽度和高度，并且我的裁剪坐标可以显然保持不变，因为我只是缩放图像。现在当我再次看到这个时，事情看起来很棒。
（我将其放在灰色背景上，以便您可以看到图像边界）
<然而我的问题是，当我想将两侧各减少 10 个像素并将宽度设置为 100 时，物体会变成梨形。我想这样做是因为在我正在使用的图像库中，我需要能够容纳四张图像。
现在，如果我指定这个，我的图像将显示，但在一个白色的信箱中，顶部和底部有两个小条，我很欣赏这一点，因为我没有在左侧的裁剪中添加 10 个像素，也没有从左侧的裁剪中减去 10 个像素右边：
upload/289.jpg?crop=22,30,562,330&width=100&height=67
所以显然我需要调整我的裁剪 X1 (22) 和裁剪 <代码>X2 (562) 一点。然而，这似乎并不那么容易，因为如果我分别设置为 32 和 552 ，这仍然保留信箱，我认为我需要补偿宽度从 120 下降到 100。
我认为需要在缩放或其他操作之前应用两侧所需的 10 个像素（？），但我不知道如何处理这个算法，我真的迷失了这里!!
有道理吗？任何图像处理/数学向导可以帮助我吗？
I am using the www.imageresizing.net tool for .NET to create a gallery and thumbnail image on the fly. What's really neat about this component is you can re-crop and resize images simply by altering a URL.
Now, what I have is a gallery image in my required aspect ratio (9:5) rendering correctly with the below:
upload/289.jpg?crop=22,30,562,330&width=540&height=300
You will notice the defined crop coordinates above 22,30,562,330 (X1,Y1,X2,Y2) this selects an area 22 pixels in, 30 pixels down, 562 pixels across, 330 pixels in from the bottom. So basically a 540x300px rough crop area in the centre of a larger image (640x427 but this is irrelevant to the question).
Now as said, this displays well and in the correct aspect ratio. I can then alter the URL to a thumbnail version using:
upload/289.jpg?crop=22,30,562,330&width=120&height=67
I previously worked out that 120x67 (120.6x67 pixels to be exact) is the correct width and height to maintain my aspect ratio, and my crop coords can obviously stay the same as I am just scaling the image. Now again when I view this, things look great.
(I have placed it on a grey background so you can see the image boundaries)
However my issue is when I want to knock 10 pixels off either side and setting a width of 100 things go pear shaped. I want to do this because on an image gallery I am using I need to be able to fit in four images across.
Now if I specify this, my image will display, but in a white letterbox with two small bars top and bottom, which I do appreciate because I have not added 10 pixels to my crop on the left or yet subtracted 10 pixels from my crop on the right:
upload/289.jpg?crop=22,30,562,330&width=100&height=67
So obviously I need to adjust my crop X1 (22) and crop X2 (562) a bit. However, it doesn't seem to be as easy as that, as this still retains the letterbox if I set to 32 and 552 respectively which I would think I need to compensate for the width dropping from 120 to 100.
I think the required 10 pixels from both sides need to be applied prior to the scaling or something (?), but I have no idea on how to tackle this algorithm and I'm really lost here!!
Make sense? Could any image manipulation/math wizards help me here?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
只需添加
&mode=crop即可让模块为您进行数学计算（并确保您使用的是 V3.1+）。我相信您的困惑源于这样一个事实：裁剪坐标（默认情况下）是相对于原始图像的，而宽度/高度值是图像的缩放尺寸。即，宽度设置偏离 10 个像素相当于该特定图像的裁剪矩形上的 50 个像素左右。使用
cropxscale和cropyscale您可以更改这些裁剪值的解释方式。&cropxscale=100&cropyscale=100使它们成为百分比，而&cropxscale=120&cropyscale=67让您指定相对于缩放尺寸的裁剪坐标图像。此外，V3.1 及更高版本还允许您手动裁剪和自动裁剪：例如
。
?crop=22,30,562,330&width=100&height=67&mode=crop。该模块将首先应用您的裁剪设置，然后再次进行裁剪，以确保您获得与您的身高规格完全匹配的结果。如果不需要精确的宽度和高度，可以使用 &mode=max 代替。
此外，您还可以使用锚点设置调整自动裁剪的应用方式。
我不完全确定您的裁剪坐标来自哪里或其余情况是什么，但一如既往，可以通过 [电子邮件受保护]。
您还可以查看 imageresizing.net/docs/reference 上的命令参考。
我想我可以添加一页关于一起使用裁剪命令的示例，因为该理论可能是数学密集型的。我很抱歉花了这么长时间才找到这篇文章；我希望您能通过电子邮件发送
[电子邮件受保护]，我可以立即回答您的问题。一如既往，如果有什么我可以帮忙的，请给我发一封电子邮件，或者在 SO 上发帖，然后通过电子邮件给我发送一个链接:) 我更新了 http://imageresizing.net 文档平均每周 5-20 次，以使事情变得更清晰或更详细，所以每当有人感到困惑时我总是很感兴趣，因为这通常意味着文档需要工作，或者需要链接到更多地方。
Just add
&mode=cropto let the module do the math for you (and make sure you're using V3.1+).I believe that your confusion stems from the fact that the crop coordinates (by default) are relative to the original image, and the width/height values are the scaled size of the image. I.e, 10 pixels off the width setting equates to 50 pixels or so on the cropping rectangle with that particular image. With
cropxscaleandcropyscaleyou can change how those crop values are interpreted.&cropxscale=100&cropyscale=100makes them percentages, while&cropxscale=120&cropyscale=67would let you specify crop coordinates relative to the size of the scaled image.In addition, V3.1 and higher lets you both manually crop and auto-crop, as well:
Ex.
?crop=22,30,562,330&width=100&height=67&mode=crop.The module will first apply your crop settings, then proceed to crop again to make sure you get an exact match for your with and height specifications. If you don't need an exact width and height, you can use &mode=max instead.
Also, you can adjust how automatic cropping is applied with the anchor setting.
I'm not completely sure where your cropping coordinates are coming from or what the rest of the situation is, but as always, I can be reached at [email protected].
You can also check out the command reference at imageresizing.net/docs/reference.
I think I may add a page of examples on using the crop commands together, as the theory can be math-intensive. My apologies for taking so long to find this post; I wish you'd have e-mailed
[email protected], I could have answered your question immediately.As always, if there is anything I can help with, please shoot me an e-mail, or post on SO, and e-mail me a link :) I update the http://imageresizing.net documentation 5-20 times per week on average to make things clearer or more detailed, so I'm always interested whenever someone's confused about, since that typically means the documentation needs work, or needs to be linked to from more places.