ch05.html
7.02 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Chapter 5. Fundamentals of dynamic graph generation</title><link rel="stylesheet" type="text/css" href="manual.css"><meta name="generator" content="DocBook XSL Stylesheets V1.76.0"><link rel="home" href="index.html" title="JpGraph Manual"><link rel="up" href="pt02.html" title="Part II. Basic graph creation"></head><body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF"><div class="navheader"><table width="100%" summary="Navigation header"><tr><th colspan="3" align="center">Chapter 5. Fundamentals of dynamic graph generation</th></tr><tr><td width="20%" align="left"> </td><th width="60%" align="center">Part II. Basic graph creation</th><td width="20%" align="right"> </td></tr></table><hr></div><div class="chapter" title="Chapter 5. Fundamentals of dynamic graph generation"><div class="titlepage"><div><div><h2 class="title"><a name="chap.fund-dynamic-graph"></a>Chapter 5. Fundamentals of dynamic graph generation</h2></div></div></div><div class="toc"><p><b>Table of Contents</b></p><dl><dt><span class="sect1"><a href="ch05.html#sec1.making-sense-of-HTTP-streams">5.1. Making sense of HTTP streams and MIME types</a></span></dt><dt><span class="sect1"><a href="ch05s02.html">5.2. What is an image?</a></span></dt><dt><span class="sect1"><a href="ch05s03.html">5.3. Static vs dynamic images</a></span></dt><dt><span class="sect1"><a href="ch05s04.html">5.4. Dynamic images on the command line</a></span></dt><dt><span class="sect1"><a href="ch05s05.html">5.5. How to generate images with JpGraph library</a></span></dt><dd><dl><dt><span class="sect2"><a href="ch05s05.html#id2494467">5.5.1. The standard steps of setting up a graph</a></span></dt><dt><span class="sect2"><a href="ch05s05.html#id2494641">5.5.2. Choosing the image compression format for JpGraph</a></span></dt><dt><span class="sect2"><a href="ch05s05.html#id2494706">5.5.3. Sending back the image to the browser</a></span></dt><dt><span class="sect2"><a href="ch05s05.html#sec2.writing-miage-to-file">5.5.4. Writing the image directly to a file</a></span></dt><dt><span class="sect2"><a href="ch05s05.html#id2494959">5.5.5. Alternatives to streaming or storing the image</a></span></dt><dt><span class="sect2"><a href="ch05s05.html#sec2.forcing-browser-update">5.5.6. Forcing the browser to update your graph</a></span></dt><dt><span class="sect2"><a href="ch05s05.html#id2495089">5.5.7. Printing the generated image</a></span></dt></dl></dd><dt><span class="sect1"><a href="ch05s06.html">5.6. Efficient graph generation using the built-in cache subsystem</a></span></dt></dl></div>
<p title="What you will learn in this chapter">
<b>What you will learn in this chapter. </b>
The purpose of this chapter is to put dynamic image generation in perspective and
illustrate how HTML tags is used to call image generating scripts. Even if You are
familiar with PHP it is strongly recommended to quickly browse through this chapter
to make sure all concepts are known. If You fully understand and can explain the
concept of MIME types, HTTP streams and why the "<span class="italic">Headers already sent error</span>" error is a very common
error when generating dynamic images with PHP it is probably safe to skip this
chapter. Otherwise it might be wise to read through this chapter at least
once.
</p>
<div class="sect1" title="Making sense of HTTP streams and MIME types"><div class="titlepage"><div><div><h2 class="title" style="clear: both"><a name="sec1.making-sense-of-HTTP-streams"></a>Making sense of HTTP streams and MIME types</h2></div></div></div>
<p>The following explanation is slightly simplified since a full description of the
HTTP protocol would bring us a bit too far in this manual </p><div class="orderedlist"><ol class="orderedlist" type="1"><li class="listitem">
<p>A client (e.g. browser) requests data from the server by issuing a GET
(or possible a POST) command to the server. This is what happens when
you enter a URI in the address bar in the browser.</p>
</li><li class="listitem">
<p>The server replies with a data stream (or an error if the requested
data wasn't available). This data stream is prepended with header (MIME
header) that tells the client (e.g. the browser) how to interpret the
data that follows. The most common type (and the default type if no
header is sent by a faulty server) is "<span class="bold"><strong>text/html</strong></span>" . This tells the client to
interpret the data as plain text with embedded HTML encoding. </p>
<p>When the data is to be interpreted as an image the header will instead
be one of the image headers, for example "<span class="bold"><strong>image/png</strong></span>" or "<span class="bold"><strong>image/jpeg</strong></span>". When the client receives this
header it will interpret all the following data as an image encoded in
the indicated format. </p>
<p>The important thing to keep in mind here is that each server reply
(initiated by a call from the client) can only have one and only one
MIME type. This is the key to further understanding the specific issues
with dynamic image generation. This explains why if a PHP script running
on the server sends a header first indicating that the following data it
sends should be interpreted by the client as an image it cannot also
include text since only one header can be used for one HTTP stream.
</p>
</li></ol></div>
<p>What happens on a WEB-page with, for example, multiple <span class="markup"><img></span>
tags is that the browser issues a separate GET command for each of these images. So
even though it can look like a fetching a single WEB-page can have different content
each individual request to the server only have one single MIME type.</p>
</div>
</div><div class="navfooter"><hr><table width="100%" summary="Navigation footer"><tr><td width="40%" align="left"> </td><td width="20%" align="center"><a accesskey="u" href="pt02.html">Up</a></td><td width="40%" align="right"> </td></tr><tr><td width="40%" align="left" valign="top"> </td><td width="20%" align="center"><a accesskey="h" href="index.html">Home</a></td><td width="40%" align="right" valign="top"> </td></tr></table></div></body></html>