如何在PHP中绘制渐变矩形？

Question

我想在PHP中绘制一个像这样的双重渐变，如（使用不同的颜色）。

编辑：结束修改其中一个提供的梯度函数的答案，以简单地绘制双梯度。

Answer 1

创建使用正常的GD图像功能在PHP梯度。该函数使用HTML十六进制代码作为颜色值，然后将它们转换为具有RGB值的数组。

function image_gradientrect($img,$x,$y,$x1,$y1,$start,$end) { 
    if($x > $x1 || $y > $y1) { 
     return false; 
    } 
    $s = array(
     hexdec(substr($start,0,2)), 
     hexdec(substr($start,2,2)), 
     hexdec(substr($start,4,2)) 
    ); 
    $e = array(
     hexdec(substr($end,0,2)), 
     hexdec(substr($end,2,2)), 
     hexdec(substr($end,4,2)) 
    ); 
    $steps = $y1 - $y; 
    for($i = 0; $i < $steps; $i++) { 
     $r = $s[0] - ((($s[0]-$e[0])/$steps)*$i); 
     $g = $s[1] - ((($s[1]-$e[1])/$steps)*$i); 
     $b = $s[2] - ((($s[2]-$e[2])/$steps)*$i); 
     $color = imagecolorallocate($img,$r,$g,$b); 
     imagefilledrectangle($img,$x,$y+$i,$x1,$y+$i+1,$color); 
    } 
    return true; 
} 


$imgWidth = 300; 
$imgHeight = 150; 
$img = imagecreatetruecolor($imgWidth,$imgHeight); 

image_gradientrect($img,0,0,$imgWidth,$imgHeight,'ff0000','0000ff'); 
/* Show In Browser as Image */ 
header('Content-Type: image/png'); 
imagepng($img); 

/* Save as a File */ 
imagepng($img,'save.png'); 

/* Some Cleanup */ 
imagedestroy($img); 

只要改变高度& widht和颜色在上面的代码中，它会产生矩形图像。

Answer 2

bool imagefilledrectangle (resource $image , int $x1 , int $y1 , int $x2 , int $y2 , int $color) 

Answer 3

此源码ref。到Christoper Kramer的PHP文档页面。 试试吧。 PHP中没有“内置”函数来绘制它。

function gradient($w=100, $h=100, $c=array('#FFFFFF','#FF0000','#00FF00','#0000FF'), $hex=true) { 

    /* 
    Generates a gradient image 

    Author: Christopher Kramer 

    Parameters: 
    w: width in px 
    h: height in px 
    c: color-array with 4 elements: 
     $c[0]: top left color 
     $c[1]: top right color 
     $c[2]: bottom left color 
     $c[3]: bottom right color 

    if $hex is true (default), colors are hex-strings like '#FFFFFF' (NOT '#FFF') 
    if $hex is false, a color is an array of 3 elements which are the rgb-values, e.g.: 
    $c[0]=array(0,255,255); 

    */ 

    $im=imagecreatetruecolor($w,$h); 

    if($hex) { // convert hex-values to rgb 
     for($i=0;$i<=3;$i++) { 
      $c[$i]=hex2rgb($c[$i]); 
     } 
    } 

    $rgb=$c[0]; // start with top left color 
    for($x=0;$x<=$w;$x++) { // loop columns 
     for($y=0;$y<=$h;$y++) { // loop rows 
      // set pixel color 
      $col=imagecolorallocate($im,$rgb[0],$rgb[1],$rgb[2]); 
      imagesetpixel($im,$x-1,$y-1,$col); 
      // calculate new color 
      for($i=0;$i<=2;$i++) { 
       $rgb[$i]= 
        $c[0][$i]*(($w-$x)*($h-$y)/($w*$h)) + 
        $c[1][$i]*($x  *($h-$y)/($w*$h)) + 
        $c[2][$i]*(($w-$x)*$y  /($w*$h)) + 
        $c[3][$i]*($x  *$y  /($w*$h)); 
      } 
     } 
    } 
    return $im; 
} 

function hex2rgb($hex) 
{ 
    $rgb[0]=hexdec(substr($hex,1,2)); 
    $rgb[1]=hexdec(substr($hex,3,2)); 
    $rgb[2]=hexdec(substr($hex,5,2)); 
    return($rgb); 
} 

// usage example 

$image=gradient(300, 300, array('#000000', '#FFFFFF', '#FF0000', '#0000FF')); 

header('Content-type: image/png'); 
imagepng($image); 
imagedestroy($image); 

Answer 4

如果我理解正确，您想在网页上绘制渐变。 PHP是一个服务器端脚本，与Presetation无关。所以HTML和JS可以帮助你。创建一个画布，然后

HTML

<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;"> 
Your browser does not support the HTML5 canvas tag.</canvas> 

的Javascript

var c=document.getElementById("myCanvas"); 
var ctx=c.getContext("2d"); 

var grd=ctx.createLinearGradient(0,0,170,0); 
grd.addColorStop(0,"black"); 
grd.addColorStop(1,"white"); 

ctx.fillStyle=grd; 
ctx.fillRect(20,20,150,100);