Displaying PNG file from PHP

Question

I'm using a PHP library to display a small png image. It works fine placed into its own PHP file, right here: https://www.sidesay.co/test_draw.php

The code is quite simple.

<?php

    require './libraries/Sparkline-master/autoload.php';
    
    $sparkline = new Davaxi\Sparkline();
    $sparkline->setData(array(2,4,5,6,10,7,8,5,7,7,11,8,6,9,11,9,13,14,12,16));
    $sparkline->display();
    
?>

But when I include the above code into my larger php file for displaying with the rest of the webpage, I get junk data where the image should be, that looks like this:

�PNG IHDRPغ� pHYs��+�IDATX��OLZw�?��4H�@\’j�DOzX�d��SM��,f.��%��Poۚ�^l�fa�lz/�^�ɥä�9�AuB��C�{(�oP�):u��}�߇��C�(��e18��q��Rĥ̡� �D�n1A�9��R�2�C)��I��ID9�A_��L_�A�//

etc.

Any ideas?

EDIT: I've created a quick PHP file to show the problem. Including a Header does not resolve the problem. It only works without HTML or if I place the PHP at the top it works but my HTML will not display at all.

<html>
<head>
    <title>TEST</title>
</head>

<?php

    header('Content-type: image/png');
    require './libraries/Sparkline-master/autoload.php';
    
    $sparkline = new Davaxi\Sparkline();
    $sparkline->setData(array(2,4,5,6,10,7,8,5,7,7,11,8,6,9,11,9,13,14,12,16));
    $sparkline->display();

?>


<body>
    <br>
    <p>Not displaying</p>
</body>
</html>

The output to this can be seen here:

https://www.sidesay.co/error_draw.php

I have also tried using the imagepng function but the junk data persists.

imagepng($sparkline->display());

[Hope it will help](https://stackoverflow.com/questions/12294070/image-showing-as-junk-characters-in-the-browser) — Alive to die - Anant, Feb 08 '21 at 05:08
yes. You can't generate the image and create the html in the same file can you? That's what I'm starting to conclude. — Joel, Feb 08 '21 at 16:43

score 0 · Accepted Answer · edited Feb 09 '21 at 10:53

0

You cannot display any html in this file.

But, to display the PNG, you have to add this:

<?php
    header('Content-Type: image/png');
?>

Adding this will make the browser display only an image:

edited Feb 09 '21 at 10:53

MaxiGui

6,190
4
16
33

answered Feb 08 '21 at 06:14

AD-1

306
1
17

So the answer is that a generated image can't be created as part of a html file? How do I call it into a webpage? I somehow save it, then call it separately, then destroy it? – Joel Feb 08 '21 at 06:16
I am unable to understand you. – AD-1 Feb 08 '21 at 06:23
I would like to include the image into my html. I can create the image using the function sparkline() but how do I output that image with additional HTML around it in real time? – Joel Feb 08 '21 at 06:29
I'm sorry but you can't add both the image and html in the same file. The most ideal solution is to create the image, save it to a file and then display it using the tag in html. – AD-1 Feb 08 '21 at 06:34
If I could help you, could you upvote my answer? Actually I am new to this community. :) – AD-1 Feb 08 '21 at 06:35

score 0 · Answer 2 · answered Oct 14 '22 at 09:53

Import all the image related code into an my_image.php file and write that file in the src="" attribute of the tag.

<?php
    /*this is my_image.php*/
    header('Content-Type: image/png');
    require './libraries/Sparkline-master/autoload.php';
    
    $sparkline = new Davaxi\Sparkline();
    $sparkline->setData(array(2,4,5,6,10,7,8,5,7,7,11,8,6,9,11,9,13,14,12,16));
    $sparkline->display();
?>

now use this like a image file

/*this is index.html*/
<html>
<head>
    <title>TEST</title>
</head>
<body>

     <img src="your_path/my_image.php"/>
    <br>
    <p>Not displaying</p>
</body>
</html>

Displaying PNG file from PHP

2 Answers2