如何处理/操作分割图像？

Question

我们有一个需要展示短/大尺寸图片的要求。（例如，我可以将公交车的前部、后部和中间部分作为单独的图片展示。）

为了演示上述内容，我可以尝试：

front,middle,middle,back (to construct shorter image)
front,middle,middle,middle,middle,back (to construct bigger image)

有哪些网站可以让您下载这样的图像（即它们已经被分割），或者从已有的图像中实现这一目标的更简单方法是什么？

- user339108

Answer 1

你可以使用ImageMagick。请查看以下示例链接：http://shortrecipes.blogspot.com/2010/02/imagemagick-split-one-image-to-smaller.html。

如果你想将图像水平分割成200像素的小块，请参考以下步骤：

convert -crop 200 +repage verybig.jpg slice%02d.jpg

- vbence

---

我不想从外部网站复制外部文件，但是否有使用图像处理工具拆分任何图像（例如我们提供的图像）的方法。 - user339108

我根据你的评论修改了我的答案。 - vbence

Answer 2

您可以使用HTML/CSS对现有图像进行切割和分割，方法是设置几个相邻的元素，将同一图像作为背景，并通过调整宽度和背景位置来达到所需效果。

以下是一个示例：http://jsfiddle.net/gjJcM/ 要使这个过程无缝，您需要了解正在处理的图像内容 - 我需要更多上下文才能深入思考。

希望这能有所帮助。

- peteorpeter

---

我不建议使用Peter的解决方案，因为它并不是最优的。他的想法需要为每个CSS div/span等加载整个图像，这会显著增加加载时间，而不是加载较小的“大小”图像。这与使用CSS将1000x1000图像调整为10x10并称其为缩略图相同，即使它具有小的显示，用户仍然必须下载整个全尺寸文件。 - SQueryL

Peter的回答是一个有效的解决方案。它与在HTML5中使用CSS精灵相同。服务器仅被大文件命中一次，然后文件在浏览器中被操作。 - Andrew HunzekerHesed

成本/效益将取决于基本图像大小的细节以及在使用它作为背景的各种HTML元素中显示了多少（问题中没有足够的细节来确定）。 - peteorpeter

Answer 3

切割和拼接也可以使用Gimp来完成。

进入Gimp的Filters->Map->Make-Seamless。它用于使瓷砖在水平和垂直方向上无缝拼接。您可以使用它来制作水平可重复的瓷砖，方法是在上下添加额外的背景，然后在使用后裁剪掉多余的部分。

更复杂的制作无缝拼接工具是panotools。

最后合并这些部分时，最容易的方法是将公共部分的一半与后面拼接，一半与前面拼接。虽然得不到没有中间部分的汽车，但从问题中看，这似乎不是您需要的。

- James Crook