[Sommaire] [Imprimer]

   1  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
   2  <HTML>
   3  <HEAD>
   4  <META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=iso-iso-8859-1">
   5  <LINK REL="Start" HREF="index.html">
   6  <LINK REL="Contents" HREF="toc.html">
   7  <LINK REL="Prev" HREF="43UsingPHPdirectly.html">
   8  <LINK REL="Next" HREF="45ChoosingtheimageformatforJpGraph.html">
   9  <STYLE TYPE="text/css"><!--
  10  BODY { font-family: serif }
  11  H1 { font-family: sans-serif }
  12  H2 { font-family: sans-serif }
  13  H3 { font-family: sans-serif }
  14  H4 { font-family: sans-serif }
  15  H5 { font-family: sans-serif }
  16  H6 { font-family: sans-serif }
  17  SUB { font-size: smaller }
  18  SUP { font-size: smaller }
  19  PRE { font-family: monospace }
  20  A { text-decoration: none }
  21  --></STYLE>
  22  </HEAD>
  23  <BODY>
  24  <A HREF="toc.html">Contents</A>
  25  <A HREF="43UsingPHPdirectly.html">Previous</A>
  26  <A HREF="45ChoosingtheimageformatforJpGraph.html">Next</A>
  27  <HR NOSHADE>
  28  <H2><A NAME="4_4">4.4 The basic principle of JpGraph and the creation of
  29   images</A></H2>
  30  <P> The common pattern for creating graphs is</P>
  31  <OL>
  32  <LI> Create a script that constructs the image, type, colors size and so
  33   on.</LI>
  34  <LI> A wrapper script which contains one or more &lt;IMG&gt; tags to position
  35   the graphs on the proper HTML page.</LI>
  36  </OL>
  37  <P> Of course it is of perfectly possible to call the image script
  38   directly in the browser to just display the generated image in the
  39   browser.</P>
  40  <P> You should remember that it is also possible to pass arguments to
  41   the image script via the normal HTTP GET/POST arguments. For example<DIV
  42  class="phpscript"><CODE><FONT color="#000000"> <FONT color="#0000BB">&nbsp;</FONT><FONT
  43  color="#007700">&lt;</FONT><FONT color="#0000BB">img&nbsp;src</FONT><FONT color="#007700">
  44  =</FONT><FONT color="#DD0000">&quot;showgraph.php?a=1&amp;b=2&quot;</FONT><FONT color="#007700">
  45  &gt;</FONT><FONT color="#0000BB"></FONT></FONT></CODE></DIV></P>
  46  <P> This could for example be used to control the appearance of the
  47   image or perhaps send data to the image which will be displayed. Note
  48   that this is probably not the best way to send large amount of data to
  49   plot. Instead the only practical way, for large data sizes, is to get
  50   all the data in the image script, perhaps from a DB. Another
  51   alternative for large amount of data to be sent to the image script is
  52   by creating a POST request to the image script.<DIV class="note"><B>
  53  Note:</B><B> Forcing the browser to update your image</B> Some browser
  54   may not send back a request to the web browser unless the user presses
  55   &quot;Refresh&quot; (F5 - in most browsers). This can lead to problems that the
  56   user is seeing old data. A simple trick is to add a dummy time argument
  57   which is not used in the script. For example
  58  <PRE>
  59  echo '&lt;img src=&quot;myimagescript.php?dummy='.now().'&quot;&gt;';
  60  </PRE>
  61   It is also important to be aware of any internal caching the browser
  62   might do. The general problem with dynamically generated images is that
  63   the image generating script (file) remains the same. This makes the
  64   browser believe that the data hasn't changed and if the browser already
  65   has issues a previous GET request and has the data cached it will not
  66   send a new GET if the timestamp on the file is the same since it then
  67   believes it my use the old cached version.</DIV></P>
  68  <P> When it comes to the structure of your imaging script they will
  69   generally have the structure<DIV class="phpscript"><CODE><FONT color="#000000">
  70   <FONT color="#0000BB">&nbsp;</FONT><FONT color="#FF8000">
  71  //&nbsp;...&nbsp;Include&nbsp;necessary&nbsp;headers
  72  <BR>
  73  <BR></FONT><FONT color="#0000BB">$graph&nbsp;</FONT><FONT color="#007700">
  74  =&nbsp;new&nbsp;</FONT><FONT color="#0000BB">Graph</FONT><FONT color="#007700">(</FONT><FONT
  75  color="#0000BB">$width</FONT><FONT color="#007700">,</FONT><FONT color="#0000BB">
  76  $height</FONT><FONT color="#007700">,&nbsp;...);
  77  <BR>
  78  <BR></FONT><FONT color="#FF8000">
  79  //&nbsp;...&nbsp;code&nbsp;to&nbsp;construct&nbsp;the&nbsp;graph&nbsp;details
  80  <BR>
  81  <BR></FONT><FONT color="#0000BB">$graph</FONT><FONT color="#007700">-&gt;</FONT><FONT
  82  color="#0000BB">Stroke</FONT><FONT color="#007700">();
  83  <BR></FONT><FONT color="#0000BB"></FONT></FONT></CODE></DIV></P>
  84  <P> JpGraph is completely Object oriented so all calls will be action on
  85   specific instances of classes. One of the fundamental classes is the
  86   Graph() class which represents the entire graph.</P>
  87  <P> After the creation of the Graph() object all the code lines to
  88   construct the details of the graph are added.</P>
  89  <P> The final method called in an image script will most likely be the<I>
  90   Graph::Stroke()</I> method. This will send the constructed image back
  91   to the browser. A variation of this is used if the graph are supposed
  92   to have image maps. In that case the final method will be<I>
  93   Graph::StrokeCSIM()</I></P>
  94  <P> In addition to this standard usage pattern you can also choose to</P>
  95  <UL>
  96  <LI> ... send the graph directly to a file</LI>
  97  <LI> ... access the GD image handler for further image processing (also
  98   needed to include the image in an PDF file)</LI>
  99  <LI> ... make use of the builtin cache system to send back a previously
 100   generated image</LI>
 101  </UL>
 102  <P> The cache system, which lessens the burden of the PHP server, works
 103   by avoiding o run all the code that follows the initial Graph() call by
 104   checking if the image has already been created and in that case
 105   directly send back the previously created (and stored in a file) image
 106   to the browser. When using the cache system a filename must be
 107   specified in the initial Graph() call which is used to store the image
 108   in the cache system and possibly also a timeout value to indicate how
 109   long the image in the cache directory should be valid.</P>
 110  <P> In many of the examples in this manual the following pattern will be
 111   used<DIV class="phpscript"><CODE><FONT color="#000000"> <FONT color="#0000BB">
 112  &nbsp;$graph&nbsp;</FONT><FONT color="#007700">=&nbsp;new&nbsp;</FONT><FONT color="#0000BB">
 113  Graph</FONT><FONT color="#007700">(</FONT><FONT color="#0000BB">300</FONT><FONT
 114  color="#007700">,</FONT><FONT color="#0000BB">200</FONT><FONT color="#007700">
 115  ,</FONT><FONT color="#DD0000">&quot;auto&quot;</FONT><FONT color="#007700">);</FONT><FONT
 116  color="#0000BB"></FONT></FONT></CODE></DIV></P>
 117  <P> The two first parameters specify the width and height of the graph
 118   and the third parameter the name of the image file in the cache
 119   directory. The special name<I> 'auto'</I> indicates that the image file
 120   will be given the same name as the image script but with the extension
 121   changed to indicate the graphic format used, i.e '.jpg', '.png' and so
 122   on.</P>
 123  <P> Please note that the cache system by default is disabled and must be
 124   enabled by setting the proper define in the file &quot;jpg-config.inc.php&quot;</P>
 125  <HR NOSHADE>
 126  <A HREF="toc.html">Contents</A>
 127  <A HREF="43UsingPHPdirectly.html">Previous</A>
 128  <A HREF="45ChoosingtheimageformatforJpGraph.html">Next</A>
 129  </BODY>
 130  </HTML>