Question

当我们将音频波形上传到服务器时，我会直接从MP3中呈现音频波形。我的上传脚本目前保存原始mp3并将波形呈现为png。

目前我首先将背景渲染为矩形。此代码生成透明或彩色背景，具体取决于$ background：

的值

我正在尝试在PHP中创建透明的png叠加层。

if (!$img) {
        // create original image width based on amount of detail
                // each waveform to be processed with be $height high, but will be condensed
                // and resized later (if specified)
        $img = imagecreatetruecolor($data_size / DETAIL, $height * sizeof($wavs_to_process));

        // fill background of image
        if ($background == "") {
          // transparent background specified
          imagesavealpha($img, true);
          $transparentColor = imagecolorallocatealpha($img, 0, 0, 0, 127);
          imagefill($img, 0, 0, $transparentColor);
        } else {
          list($br, $bg, $bb) = html2rgb($background);
          imagefilledrectangle($img, 0, 0, (int) ($data_size / DETAIL), $height * sizeof($wavs_to_process), imagecolorallocate($img, $br, $bg, $bb));
        }
      }

然后我遍历动态重采样MP3的数据点，对于每个点，我在这个背景上绘制一条线来渲染波形图像。

我使用此代码生成波形图像：

 // don't print flat values on the canvas if not necessary
          if (!($v / $height == 0.5 && !$draw_flat))
            // draw the line on the image using the $v value and centering it vertically on the canvas
            imageline(
              $img,
              // x1
              (int) ($data_point / DETAIL),
              // y1: height of the image minus $v as a percentage of the height for the wave amplitude
              $height * $wav - $v,
              // x2
              (int) ($data_point / DETAIL),
              // y2: same as y1, but from the bottom of the image
              $height * $wav - ($height - $v),
              imagecolorallocate($img, $r, $g, $b)
            );      

        } else {
          // skip this one due to lack of detail
          fseek($handle, $ratio + $byte, SEEK_CUR);
        }
      }

这非常有效，但是我需要将波形创建为透明叠加，以便将其放在带有CSS渐变的div上。因此，我需要将背景渲染为#ffffff，实际波形本身需要透明。本质上，我需要在生成的png上反转透明度。

我尝试过使用：

imagecolorallocatealpha($img, 0, 0, 0, 127)

在波形渲染部分，但似乎总是看到一个没有可见波形的彩色矩形，我不知道我哪里出错了。

非常感谢任何帮助。

Answer 1

请尝试以下方法。 Disable blending mode^Docs图片：

imagealphablending($img, FALSE);

这样可以直接设置带有alpha信息的像素。为此，您需要将allocate the color with the alpha^Docs设置为100％透明：

imagecolorallocatealpha($img ,$r, $g, $b, $alpha = 127);

顺便说一句，您可以分配一次颜色，然后重复使用它，这样您就不需要经常调用imagecolorallocatealpha函数。

让我知道这是否有效。

渲染彩色背景与透明前景在PHP中

1 个答案: