franta-hg@1: franta-hg@1: franta-hg@1: franta-hg@1: Cewolf Tutorial(5): Create ImageMap and Tooltip Information franta-hg@1: franta-hg@1: franta-hg@1: franta-hg@1: franta-hg@1:

Tutorial: Step 5

franta-hg@1:

Create ImageMap and Tooltip Information

franta-hg@1:

To provide your chart with additionnal tooltips and image map franta-hg@1: information you have to provide an additional Java class or enhance an franta-hg@1: existing one like the one below. In this tutorial we will add some franta-hg@1: methods to the datasetproducer class which had been introduced at the franta-hg@1: beginning of this tutorial.

franta-hg@1:

franta-hg@1:
...
public String generateLink(Object data, int series, Object category) {
return seriesNames[series];
}

public String generateToolTip(CategoryDataset arg0, int series, int arg2) {
return seriesNames[series];
}
...
franta-hg@1:

As you can see it is very easy to implement a class that produces franta-hg@1: image map and tooltips information. First of all it has to implement the franta-hg@1: interfaces CategoryItemLinkGenerator and CategoryToolTipGenerator franta-hg@1: (as it produces a CategoryDataset). For other data types refer to the cewolf java api.

franta-hg@1:

To let your class produce links and tooltips for the chart image you franta-hg@1: have to change the <cewolf:img> tag as follows:

franta-hg@1:

franta-hg@1:
<cewolf:img chartid="line" renderer="cewolf" width="400" height="300">
<cewolf:map id="pageViews"/>
</cewolf:img>
franta-hg@1:

Reload your page and you will see tooltips and links on data points. franta-hg@1: Internet Explorer browsers are handled slightly different as others as franta-hg@1: they are able to render a tooltip based on the alt attribute franta-hg@1: inside an image map. All other browser need the overlib.js for this. franta-hg@1: Cewolf tries to determine the used browser and renders a correct page franta-hg@1: transparently.

franta-hg@1:

For further information on using Cewolf refer to the Tag Library Reference and the Cewolf JavaDoc.

franta-hg@1:

If you want to see more examples of how to implement catchy charts franta-hg@1: in your webapp, you should deploy the example webapp (downloadable from franta-hg@1: the Cewolf home franta-hg@1: page and have a look at its sourcecode.

franta-hg@1: SourceForge Logo franta-hg@1: franta-hg@1: