5

这比听起来更棘手，所以让我尽力解释一下。

我专门处理来自 HM 和 Net-a-porter 等网站的服装图片。我想将这些图像添加到我的网站，将它们垂直堆叠，以便它们创建一套服装。

我需要重新调整衬衫的尺寸，使其按比例放置在牛仔裤的顶部。牛仔裤的尺寸固定为 100 像素宽 x 250 像素长。当我将衬衫的大小调整为相同的宽度（100 像素）时，它有时会匹配。使用不同的衬衫（可能是长袖、无袖等）会导致混合结果，并且与牛仔裤的 100 像素宽度的腰围不匹配。

保存时，这些图片在 jpeg 中包含一定数量的空白区域，这些空白区域因图像而异。我尝试在有和没有空白的情况下调整大小（通过将其裁剪到项目的边缘），但这也无济于事。

这一切都应该是一个自动化的过程（比如在 Polyvore 的 Pinterest 上使用剪辑工具），因此以上任何一项都不能通过 Photoshop 或手工完成，这使得它变得更加困难。

我的问题的截图可以在这里找到：

在此处输入图像描述

我还研究了像素计数器脚本，想知道是否可以通过计算服装项目腰线的像素宽度来调整大小（不包括所有白色像素数据）？

我觉得我正在深入到“无法完成，变量太多”的特定领域，并且希望有人至少能指出我正确的方向。非常感谢！

4

3 回答 3

2

使用 CSSmax-width并max-height设置比例。这将适当地扩展一切。

例如：

img { max-width: 100px; }

这是一个 JS 小提琴：http: //jsfiddle.net/KSzhS/

做起来并不难。

这是我为“基本上”做同样的事情而编写的一个函数，但它不是分析衣服，而是分析字母。它是用 PHP 编写的，但如果您可以使用 HTML5，您也可以在客户端执行此操作。

/**
* Function: Returns the space between letters, and the width of letters.
*           The first index is set to 0, as that is where it starts
*           Since spaces don't register (no pixels), strlen may not work.
* $image image cursor (from imagecreatetruecolor)
*/
function get_letter_dimensions($image)
{
   $bg           = imagecolorallocatealpha($image, 0, 0, 0, 127);
   $height       = imagesy($image) - 1; // was causing issues without
   $width        = imagesx($image);
   $bottom       = 0;
   $right        = 0;
   $letter_space = array(0=>0); // This holds the pixels between the letters
   $letter_width = array(0=>0); // This holds the width of the letters
   $y            = $height;
   $spacing      = 0;
   $lettering    = 0;
   $data         = array();

   for ($x = 0 ; $x < $width ; $x++) 
   {
      while((imagecolorat($image, $x, $y) == $bg) && ($y >= 1 )) $y--;

      if($y == 0) 
      {
         if($lettering) $letter_width[] = $lettering;
         $lettering = 0;
         $spacing++;
      }
      else
      {
         if($spacing) $letter_space[] = $spacing;
         $spacing = 0;
         $lettering++;
      }
      $y = $height;
   }

   foreach($letter_space as $k=>$val) $data[$k] = $val + $letter_width[$k];

   return $data;      
}

不过，您需要对其进行修改，以便它不会插入字母，但是您将从头开始，当您遇到不清晰或白色的像素时，您会对其进行标记，并且从最后开始。然后你就会有你的参考点。

这只是一些简单的数学和服装分析。如果您对“腰线”匹配感兴趣，您可能希望从底部开始，然后向上，以获得衬衫的图像。然后你可以看到像素的“线”在哪里，这将代表腰部的位置。并以此为基础进行计算。

因此，如果您想帮助自己，echo请从提供的函数开始获取结果，以便您可以看到它的样子

例子

------------------------------
------------------------------
------------------------------
------------------------------
-------**-------------**------
------*--*-----------*--*-----
-----*-------------------*----
------------------------------
----------***********---------
--***---------------------***-
------------------------------

那就是如果你从下往上走，你可以“看到”，腰线在哪里。然后计算像素，并从中调整大小。您可以修改此功能以创建另一个自动裁剪功能。此外，如果您愿意，可以修改此功能，以便您可以从顶部开始，或者横向并从任一侧开始。您甚至可以发疯并允许使用偏移量。

一旦你设置了这种类型的信息，你就可以真正开始找出你正在使用什么。如果您正在处理永远不会使用 0,0 像素的图像，您可以尝试将其用作背景颜色。这将有助于自动裁剪功能。

您进行的测量点越多，您的分析就越智能。而且，如果您可以访问有关您正在查看的内容的信息，例如，您拥有与其他数据相关联的图像，那么您可以采取一些捷径（因此您不必进行大量分析即可知道如果您正在使用“裤子”、“裙子”、“衬衫”和“连衣裙”）。

编辑：其他想法

只是想了想……这实际上是您正在做的一件非常整洁的小事，我正在考虑编写自己的版本来取乐。这是我一直在考虑的一些事情。实施如何拉入这些图像很重要。

  • 您是否从目录中提取所有数据？
  • 您是否已经将图像设置为不同的，以便您知道自己在拉什么？
  • 你知道什么是衬衫，什么是裤子吗？

您还可以设置“审查过程”，将偏移存储在缩放的原始图像上。这将允许您绕过计算，而只是查找存储的数据。无论如何，“审查过程”将允许您仔细检查计算是否已设置，然后存储它们。

我不知道。如果我做这样的事情，我会告诉你的。

于 2012-10-25T06:11:02.813 回答
0

使用没有高度的图像的宽度属性..它调整图像的大小保持纵横比。例子：

<img src="yourpic.jpg" width="100px">

不包括 height 属性，因为它会改变它在纵横比之外的高度。只需更改该宽度值，直到它与您想要的尺寸相匹配。希望有帮助。

于 2012-10-23T15:31:11.123 回答
0

调整图像大小无助于减小图像的大小，是的，当图像减小到原始大小时，可以看到一些模糊效果。

首先明确您的要求 1）为什么要调整图像大小？根据您的要求，解决方案会有所不同。2）如果你想调整图像的比例，那么你需要Photoshop工具到你需要的大小，这将减小图像大小并保持清晰度。3）如果您只想通过保持原始比例来调整图像大小，请阅读我的第一条声明。

希望这将清除图像的使用。

于 2012-10-25T05:25:40.950 回答