Issue 107 June 1999
A Web-Based Chart Recorder
GRAPH-DRAWING
CODE
When
the web server gets a request for a URL, it usually
tries to satisfy that request from its compressed store
of HTML files and images. In the case of the GIF image,
there is no compressed store. The image is entirely
generated programmatically.
Besides
capturing the GIF request, I also need to capture the
reset and clear requests from the data summary box at
the bottom of the displayed page. This process is done
in the function MyDoGet, shown in Listing 7.
| Listing
7—The
MyDoGet code looks at the document URL and performs
different actions depending on the document name
part of the URL. If it is IMAGE.GIF, the request
is sent to the image-rendering system. If it contains
RESET, it processes one of several actions and redirects
the browser to a new web page. |
Once
the GET that is redirecting code recognizes the request
as a request for IMAGE.GIF, it sends a GIF header, and
it then calls DrawGraph:
di.WriteGIF(sock);
return
0;
DrawGraph
performs four functions. It initializes the image and
color map, draws and labels the x axis, draws
the data, and then draws and labels the y axis.
In
the graph initialization, two transmap objects—xaxis
and yaxis—are created, which permit easy mapping
from the natural units on time and temperature to the
graph dimensions of pixels.
After
the graph object is initialized, the program draws the
x axis by measuring the size of the display text
and figuring out how close together it can place the
x-axis tick marks (see Listing 8). The data is
drawn (see Listing 9) and sent out to the web browser
in Listing 10.
| Listing
8—This
code draws the tick marks and numbers on the x-axis.
It adjusts the spacing of the numbers to fit on
the displayed scale. |
| Listing
9—This code draws the temperature data
in the graph. It uses the temperature data stored
in the circular buffer gMeasurments. It also uses
two-axis map objects to scale the data properly. |
| Listing
10—This code sets up the graphic
response object, sets some default colors, and
draws an outside border in preparation for drawing
the actual graph data. |
FUTURES
In
its current implementation, the graphics class is a
RAM hog. It creates an uncompressed image buffer before
it compresses the image. It’s possible to write
a GIF generator that doesn’t buffer the whole image
prior to compressing it, but this arrangement is more
complex and error prone. Because 4 MB of embedded DRAM
costs less then $8, it wasn’t worth the effort.
Once
embedded developers become comfortable using the Internet
technologies and capabilities in their environment,
the possibilities are endless. You might set limits
and send e-mail when the limits are exceeded, or even
have the system dial up an ISP via modem and send an
e-mail message with an attached GIF image showing the
problem.
