java/cewolf-1.0/src/site/tutorial/step5.html
author František Kučera <franta-hg@frantovo.cz>
Sat Feb 28 21:31:02 2009 +0100 (2009-02-28)
changeset 1 639991d0808a
permissions -rw-r--r--
Rozbalená knihovna verze 1.0
franta-hg@1
     1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
franta-hg@1
     2
<html>
franta-hg@1
     3
<head>
franta-hg@1
     4
  <title>Cewolf Tutorial(5): Create ImageMap and Tooltip Information</title>
franta-hg@1
     5
  <meta name="author" content="Guido Laures">
franta-hg@1
     6
  <link href="../cewolf.css" rel="stylesheet" type="text/css">
franta-hg@1
     7
</head>
franta-hg@1
     8
<body>
franta-hg@1
     9
<h1>Tutorial: Step 5</h1>
franta-hg@1
    10
<h2>Create ImageMap and Tooltip Information</h2>
franta-hg@1
    11
<p> To provide your chart with additionnal tooltips and image map
franta-hg@1
    12
information you have to provide an additional Java class or enhance an
franta-hg@1
    13
existing one like the one below. In this tutorial we will add some
franta-hg@1
    14
methods to the datasetproducer class which had been introduced at the
franta-hg@1
    15
beginning of this tutorial. </p>
franta-hg@1
    16
<p> </p>
franta-hg@1
    17
<pre>...<br>  public String generateLink(Object data, int series, Object category) {<br>    return seriesNames[series];<br>  }<br><br>  public String generateToolTip(CategoryDataset arg0, int series, int arg2) {<br>    return seriesNames[series];<br>  }<br>...<br></pre>
franta-hg@1
    18
<p> As you can see it is very easy to implement a class that produces
franta-hg@1
    19
image map and tooltips information. First of all it has to implement the
franta-hg@1
    20
interfaces <tt>CategoryItemLinkGenerator</tt> and <tt>CategoryToolTipGenerator</tt>
franta-hg@1
    21
(as it produces a CategoryDataset). For other data types refer to the <a
franta-hg@1
    22
 href="../apidoc/index.html">cewolf java api</a>. </p>
franta-hg@1
    23
<p> To let your class produce links and tooltips for the chart image you
franta-hg@1
    24
have to change the &lt;cewolf:img&gt; tag as follows: </p>
franta-hg@1
    25
<p> </p>
franta-hg@1
    26
<pre>&lt;cewolf:img chartid="line" renderer="cewolf" width="400" height="300"&gt;<br>    &lt;cewolf:map id="pageViews"/&gt;<br>&lt;/cewolf:img&gt;<br></pre>
franta-hg@1
    27
<p> Reload your page and you will see tooltips and links on data points.
franta-hg@1
    28
Internet Explorer browsers are handled slightly different as others as
franta-hg@1
    29
they are able to render a tooltip based on the <tt>alt</tt> attribute
franta-hg@1
    30
inside an image map. All other browser need the overlib.js for this.
franta-hg@1
    31
Cewolf tries to determine the used browser and renders a correct page
franta-hg@1
    32
transparently. </p>
franta-hg@1
    33
<p> For further information on using Cewolf refer to the <a
franta-hg@1
    34
 href="../taglib.html">Tag Library Reference</a> and the <a
franta-hg@1
    35
 href="../apidoc/index.html">Cewolf JavaDoc</a>. </p>
franta-hg@1
    36
<p> <b>If you want to see more examples of how to implement catchy charts
franta-hg@1
    37
in your webapp, you should deploy the example webapp (downloadable from
franta-hg@1
    38
the <a href="http://cewolf.sf.net" alt="Cewolf Homepage">Cewolf home
franta-hg@1
    39
page</a> and have a look at its sourcecode.</b> </p>
franta-hg@1
    40
<a height="30" target="new" href="http://sourceforge.net"><img
franta-hg@1
    41
 alt="SourceForge Logo" border="0" height="30"
franta-hg@1
    42
 src="http://sourceforge.net/sflogo.php?group_id=57282&amp;type=5"></a>
franta-hg@1
    43
</body>
franta-hg@1
    44
</html>