标准化图像的正确方法答案

【问题标题】：Proper way of standardizing images标准化图像的正确方法
【发布时间】：2012-07-31 07:42:30
【问题描述】：

我正在构建一个将使用亚马逊产品广告 API 的网络应用程序。问题在于 API 会为每个产品返回不同尺寸和纵横比的图像。如果我将所有图像的大小调整为静态宽度/高度，那么由于比例的变化，其中一些看起来很奇怪。图像将按每行四行排列。我在想我只会使图像的宽度相同，同时保持纵横比相同，然后为高度设置某种最大阈值，以防API返回一些奇怪大小的图像。

但是，我想看看这里的人们是否曾经遇到过这个问题，他们对这个设计问题的想法是什么？

【问题讨论】：

我认为你提出的是一种理智的方式来完成这项任务，你已经强调了最重要的问题，那就是保持比例正确。
@Fluitketel 我不拥有这些图像。 Amazon API 根据搜索动态返回图像 url。我正在执行多个搜索并为每个搜索获取一个单独的图像 url，并且每个图像都有不同的大小和比例。每个页面可以包含多达 12 张图像，并且执行搜索需要足够长的时间，而真正调整位图大小是不可行的。
@sabre 是的，我试图忽略这个问题，只是将所有内容调整为静态宽度-x 和宽度-y，但最终它让我很困扰，在这里问。我正在讨论切换到轮播而不是成行的图像，以淡化大小不匹配的问题。

标签： php api web amazon

【解决方案1】：

真是巧合。我面临着类似的问题，这就是我决定继续前进的方式。这可能不是最好的解决方案，但它对我有用。

首先我得到图像的原始高度和宽度

list($width, $height) = getimagesize("path to image");

然后我找出两者的最大公约数并将宽度和高度比存储在变量中，例如$wr和$hr

然后通过比较$wr > $hr 的水平方向和$hr > $wr 的垂直方向来检查图像方向（水平或垂直）

如果是水平的，我会确保拇指大小不超过某个值，比如 120 像素，并根据纵横比使高度对应于 120 像素。如果方向是垂直的，也会这样做。

【讨论】：

啊太棒了。我什至没有想过要检查水平与垂直。我会很快尝试一下，至少主观上看一下，这样看起来更好。

【解决方案2】：

我在尝试标准化徽标时遇到了同样的问题。起初，我认为我可以选择一个标准区域并将所有图像调整到该区域，但该策略存在两个问题。首先，您必须设置高度和宽度的限制，因此有时您会得到面积较小的图像，因为它们非常宽或高。其次，这可能会使您的布局看起来很难看。就我而言，我在顶部有一个标题，一个图像，然后是下面的文本。我意识到一个非常宽的图像会在标题和文本之间留下很大的差距。因此，我需要一个优先考虑宽度的解决方案。我的意思是，图像可以在宽度上发生很大变化，而高度不会发生很大变化。不同的应用程序可能有不同的要求，但我认为我的解决方案也允许任何情况，例如对高度的偏好：

function width_to_height($width, $slope, $icpt){
    if ($width == 0){
        return FALSE;
    }
    return floor(($icpt + sqrt(pow($icpt, 2) + 4*$slope*pow($width, 2)))/(2*$width));
} 

function ratio_to_height($ratio, $slope, $icpt){
    if ($ratio == 0){
        return FALSE;
    }
    $area = $ratio*$slope + $icpt;
    return floor(sqrt($area/$ratio));
}   

function calc_dims($width, $height, $max_w=168, $max_h=100){
    $slope = 2500;
    $icpt = 6000;
    $ratio = $width/$height;
    $max_ratio = $max_w/$this->width_to_height($max_w, $slope, $icpt);
    if ($ratio > $max_ratio){
        $ht = floor($max_w/$ratio);
        return array('width' => $max_w, 'height' => $ht);
    }
    $ht = $this->ratio_to_height($ratio, $slope, $icpt);
    if ($ht > $max_h){
        $wd = floor($max_h*$ratio);
        return array('width' => $wd, 'height' => $max_h);
    }
    $wd = floor($ht*$ratio);
    return array('width' => $wd, 'height' => $ht);
}

主函数是调用其他两个函数的 calc_dims()。因为我几乎总是使用类，所以这些函数是用“this->”运算符调用的。如果你不使用类，你可以简单地删除操作符。

你可以看到我硬编码了一些变量。（在我的实际应用程序中，这些是从配置文件中调用的。） $max_w 和 $max_h 作为图像的最大高度和宽度是非常不言自明的。但是 $slope 和 $icpt 可能有点难以理解。正如您在 ratio_to_height() 函数中看到的那样，$slope 和 $icpt（截距）是图像的面积和纵横比之间呈线性关系的分量。

您可以使用我提供的值 ($slope = 2500; $icpt = 6000)，也可以自己计算。我想过让这个过程自动化一点，但由于参数非常主观，它似乎不太实用。为了计算它们，有必要为纵横比的两个不同实例定义区域，其中比率为 $width/$height。例如，当比率为 1（$width = $height）时，您可能希望面积为 8000 像素^2，而当比率为 2（$width = 2*$height）时，面积可能为 12000 像素^ 2.有了这些值，我们就有了：

$A1 = 8000;
$A2 = 12000;
$r1 = 1;
$r2 = 2;

您可以按如下方式计算斜率和截距：

$slope = ($A2 - $A1)/($r2 - $r1);
$icpt = $A1 - $slope*$r1;

【讨论】：