Locate Previous Next Contents

Multiple Jumps

The chances are that you want to build a whole library of associated charts and backup details, and you are probably very happy to have some program decide the file names for you. This section of the tutorial shows how you might do this for a barchart (say loaf-type by day, using the bread data we started with) so that the summary chart is backed up by some tables of data.

Jumping from a Barchart
First, we had better make the barchart again, this time adding a key and some jump information ...

      dailytot„+š22 7 3½demand
      chName 'mybar'
      chSet 'head' 'Total Demand for the Three Bread Products'
      chSet 'key' 'White' 'Brown' 'Organic'
      chSet 'xlab' 'Monday,Tuesday,Wednesday,Thursday,Friday,Saturday,Sunday'
      chHref 'Mon' 'Tue' 'Wed' 'Thu' 'Fri' 'Sat' 'Sun'°.,'Wh.htm' 'Br.htm' 'Org.htm'
      chBar dailytot
      PG„chClose
      png„0.6 psMakePNG PG

Notice a small shortcut which you can take here – if you supply jumps for every data element you can simply list them all as a matching matrix, omitting the information about the particular row/column they belong to.

      'Mon' 'Tue' 'Wed' 'Thu' 'Fri' 'Sat' 'Sun'°.,'Wh.htm' 'Br.htm' 'Org.htm'
 MonWh.htm  MonBr.htm  MonOrg.htm 
 TueWh.htm  TueBr.htm  TueOrg.htm 
 WedWh.htm  WedBr.htm  WedOrg.htm 
 ThuWh.htm  ThuBr.htm  ThuOrg.htm 
 FriWh.htm  FriBr.htm  FriOrg.htm 
 SatWh.htm  SatBr.htm  SatOrg.htm 
 SunWh.htm  SunBr.htm  SunOrg.htm

I also used chName to enforce my own name for the chart, as I know I will only need one here!

First, let’s write the binary data to disk ...

       'c:\temp\mybar.png' psrput œpng

... then see what we got as the imagemap ...


      2œpng
<MAP name="mybar">
<area shape="rect" coords="28,88,33,163" href="MonWh.htm">
<area shape="rect" coords="60,97,65,163" href="TueWh.htm">
       ....
<area shape="rect" coords="204,138,209,163" href="SatOrg.htm">
<area shape="rect" coords="236,158,241,163" href="SunOrg.htm">
</MAP>

Hopefully, you got 21 lines, each defining the rectangle around each data bar. Go back to Notepad, and paste this into a new document (or just overwrite first.htm if you prefer). Add some text such as ...

<h2>Summary Bread Data</h2>
<img src="mybar.png" usemap="#mybar" border=0>
<p>Click on the bars to see the detailed information!</p>

Note that because we gave the chart our own name (“mybar” in the example) we use this name to refer to it in the imagemap. This makes it a little easier to type it correctly! Now when you load this file into the browser, you will be able to wave the mouse over the bars, and the status line at the bottom will show the jump target.

Of course none of the links will actually work until we create those 21 little files, but that can be left as an exercise for the evening!

Summary
You can define jumps for an entire chart by providing a matrix of jump targets which exactly matches your data. You can force the imagemap to have a sensible name by naming the chart first!


Continue to: Calling a Server
© Copyright Alan Sykes and Adrian Smith 1999