显示php图像

时间：2016-01-17 23:24:28

标签： php image

我正在尝试将形状显示到html网站。形状代表条形图。我正在尝试显示图像，但每次运行网站时都显示图像链接已损坏。

这是整个文件

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>psdtoweb120715EmailSummary1195.psd</title>
    <link type="text/css">
</head>
<style >
 {
body, table, tr, td, p {
margin: 0;
padding: 0;
}



</style>
<body margin = "0" padding = "0">
    <table width = "100%" height = "826"margin = "0" padding = "0"> 
        <tr margin = "0" padding = "0">
            <td width = "25%" margin = "0" padding = "0"> </td>
            <td margin = "0" padding = "0">  
                    <table  margin = "0" padding = "0" width = "612" height = "826" background= "http://piqdev.myperformanceiq.com/brian/images/bckgrnd1.png" style="background-repeat:no-repeat;>
                            <tr margin = "0" padding = "0"> 
                                <td valign = "top"> <p style= "margin:0; padding-left: 20px; text-transform: uppercase;font-size: 30pt; color: #ffffff;font-family: Calibri, Georgia, Serif; font-weight: bold;" >Steve.b</p></td>
                                <td colspan = "2" valign = "top" align = "right" style = "padding-left:100px; padding-right: 10px"><p style= " display: relative;margin:0; padding-top: 5px;font-size: 12pt; color: #ffffff;font-family: Calibri, Georgia, Serif; font-weight: bold;"> Result summary for: <span style= "margin:0; font-size: 15pt; color: #ffffff;font-family: Calibri, Georgia, Serif; font-weight: bold;"> 8/20/15</span><br/>55 Minutes (6:00 am - 6:55am)  </p></td>                                   
                            </tr>
                            <tr margin = "0" padding = "0" height = "10%" display = "relative"> 
                                <td valign = "top" margin = "0" padding = "0" style= "margin:0; padding-bottom: 60px;font-size: 70pt; color: #ffffff;font-family: Calibri, Georgia, Serif; font-weight: bold;"><p style = "padding-left: 100px; padding-bottom: 390px; " >500  </p></td>
                                <td valign = "top" margin = "0" padding = "0" style= "margin:0; font-size: 40pt; color: #ffffff;font-family: Calibri, Georgia, Serif; font-weight: bold;"><p style = "padding-left: 50px; padding-top: 20px;padding-bottom: 10px;">300  <br/><div style = "padding-left: 55px;padding-top:0px; ">600  </div></td>
                                <td valign = "top" margin = "0" padding = "0" style= "margin:0; font-size: 40pt; color: #ffffff;font-family: Calibri, Georgia, Serif; font-weight: bold;"><p style = "padding-top: 20px; padding-left: 20px; padding-right: 42px; ">200 <br/> <div style = "padding-left: 15px; padding-top:13px; font-size:35pt;"  >3/12 </div></td>
                            </tr>

                            <tr>
                                <td>
                                    <?php
                                        // Create a 200 x 200 image
                                        $canvas = imagecreatetruecolor(200, 200);

                                        // Allocate colors
                                        $red = imagecolorallocate($canvas, 255, 0, 0);
                                        $blue = imagecolorallocate($canvas, 55, 149, 255);
                                        $green = imagecolorallocate($canvas, 5, 186, 78);
                                        $yellow = imagecolorallocate($canvas, 219, 255, 70);
                                        $orange= imagecolorallocate($canvas, 255, 212, 36);



                                        // Draw three rectangles each with its own color
                                        imageFilledRectangle($canvas, 0, 120, 40, 200, $blue);
                                        imageFilledRectangle($canvas, 80, 200, 40, 100, $green);
                                        imageFilledRectangle($canvas, 115, 200,81, 120, $yellow);
                                        imageFilledRectangle($canvas, 115, 150, 155, 200, $orange);
                                        imageFilledRectangle($canvas, 155, 160, 200, 200, $red);


                                        // Output and free from memory
                                        header('Content-Type: image/jpeg');

                                        imagejpeg($canvas);
                                        imagedestroy($canvas);
                                        ?>
                                        <img src= "<?php echo $canvas; ?>"/>
                                </td>

                            </tr>





                    </table>

            </td>
            <td width = "25%"> </td>
        </tr>
    </table>

 

2 个答案:

答案 0 :(得分：3)

将此代码块放在另一个文件中，调用它＆＃34; showimage.php＆＃34;。

<?php
    // Create a 200 x 200 image
    $canvas = imagecreatetruecolor(200, 200);

    // Allocate colors
    $red = imagecolorallocate($canvas, 255, 0, 0);
    $blue = imagecolorallocate($canvas, 55, 149, 255);
    $green = imagecolorallocate($canvas, 5, 186, 78);
    $yellow = imagecolorallocate($canvas, 219, 255, 70);
    $orange= imagecolorallocate($canvas, 255, 212, 36);



    // Draw three rectangles each with its own color
    imageFilledRectangle($canvas, 0, 120, 40, 200, $blue);
    imageFilledRectangle($canvas, 80, 200, 40, 100, $green);
    imageFilledRectangle($canvas, 115, 200,81, 120, $yellow);
    imageFilledRectangle($canvas, 115, 150, 155, 200, $orange);
    imageFilledRectangle($canvas, 155, 160, 200, 200, $red);


    // Output and free from memory
    header('Content-Type: image/jpeg');

    imagejpeg($canvas);
    imagedestroy($canvas);
    ?>

然后替换整个块：

<tr>
    <td>
        <?php
            // Create a 200 x 200 image
            $canvas = imagecreatetruecolor(200, 200);

            // Allocate colors
            $red = imagecolorallocate($canvas, 255, 0, 0);
            $blue = imagecolorallocate($canvas, 55, 149, 255);
            $green = imagecolorallocate($canvas, 5, 186, 78);
            $yellow = imagecolorallocate($canvas, 219, 255, 70);
            $orange= imagecolorallocate($canvas, 255, 212, 36);



            // Draw three rectangles each with its own color
            imageFilledRectangle($canvas, 0, 120, 40, 200, $blue);
            imageFilledRectangle($canvas, 80, 200, 40, 100, $green);
            imageFilledRectangle($canvas, 115, 200,81, 120, $yellow);
            imageFilledRectangle($canvas, 115, 150, 155, 200, $orange);
            imageFilledRectangle($canvas, 155, 160, 200, 200, $red);


            // Output and free from memory
            header('Content-Type: image/jpeg');

            imagejpeg($canvas);
            imagedestroy($canvas);
            ?>
            <img src= "<?php echo $canvas; ?>"/>
    </td>
</tr>

使用:(并且该文件必须为.php扩展名）

<tr>
    <td>
        <img src= "showimage.php" />
    </td>
</tr>

图像源需要是文件指针，而不是图像生成器代码的回声。

答案 1 :(得分：1)

虽然我更喜欢@ Fred的方法，但实际上你可以采用不同的方式。

<tr>
    <td>
        <?php
            // Create a 200 x 200 image
            $canvas = imagecreatetruecolor(200, 200);

            // Allocate colors
            $red = imagecolorallocate($canvas, 255, 0, 0);
            $blue = imagecolorallocate($canvas, 55, 149, 255);
            $green = imagecolorallocate($canvas, 5, 186, 78);
            $yellow = imagecolorallocate($canvas, 219, 255, 70);
            $orange= imagecolorallocate($canvas, 255, 212, 36);



            // Draw three rectangles each with its own color
            imageFilledRectangle($canvas, 0, 120, 40, 200, $blue);
            imageFilledRectangle($canvas, 80, 200, 40, 100, $green);
            imageFilledRectangle($canvas, 115, 200,81, 120, $yellow);
            imageFilledRectangle($canvas, 115, 150, 155, 200, $orange);
            imageFilledRectangle($canvas, 155, 160, 200, 200, $red);

            ob_start();
            imagejpeg($canvas);
            $buffer = ob_get_clean();

            imagedestroy($canvas);
            ?>

            <img src= "<?php echo "data:image/jpeg;base64," . base64_encode($buffer); ?>"/>
    </td>
</tr>

您最初的问题是您只是想将原始二进制图像数据放入<img src=...>标记中，而您无法做到这一点。它需要是外部文件或正确编码的数据。

这实际上会将图像作为base64嵌入到页面中，从而阻止第二个HTTP请求。请注意，这会使页面下载量大得多，并且会阻止图像的缓存，因此不建议在大多数情况下使用。

正如@Dagon在评论中指出的那样，一些旧的浏览器不会支持这一点，但大多数现代浏览器都支持这种做法。

相关问题
最新问题