Example 6 : jchart-Graph with Image Map

Screenshot
GraphWithMap.html
GraphWithMap.java
JChartMapArea.java

This adds an image map to the previous jCharts example

It is basically the same stuff as the previous jCharts example
The jchart-API provides automatic construction of image maps. The helper class JChartMapArea transformes the areas to sotacs map areas.
In this example only tooltips are added to the map. Client and server sided event handlers can be added to the JChartMapArea instances in the same way as it is shown in the previous examples
The helper class is not included in the sotacs library to avoid dependency on jchart. If you want to use this kind of stuff, include a copy of the helper class in your app.

Screenshot

Note

This is static documentation. You can see this example live

GraphWithMap.html

			
<form jwcid="@Form">
     Enter an arbitrary company name : <input type="text" jwcid="@TextField" 
     listener="listener:onSubmit" value="ognl:companyName"/>
     <input type="submit" value="show stock graph"/>   
  </form>
  
  <img jwcid="@sotacs:DynamicImage"  parameters="ognl:{companyName,'mapped'}" 
       hasMap="ognl:true"
          height="300" width="500" painter="painter:paintGraph" 
          cachingMode="literal:application"
          disabled="ognl:companyName == null || companyName.trim().length() == 0"/>

GraphWithMap.java

			
public abstract class GraphWithMap extends BasePage{
    
       private static final int MINUTES_BACK = 8;

       @Persist("client")
       public abstract String getCompanyName();
        
       /*
        * this method paints the graph and sets expiration time
        */
       public void paintGraph(Graphics2D g2d, IPainterContext context){
           //retrieve data from DB
           double[] data = getStockData(getCompanyName());
           
           try{
               // render the chart with jCharts
               Chart chart = makeJChart(context, data); 
               chart.setGraphics2D(g2d);
               chart.render();
               
               //construct the image map
               chart.renderWithImageMap();
               for (Iterator it = chart.getImageMap().getIterator(); it.hasNext();) {
                 ImageMapArea jChartsArea = (ImageMapArea) it.next();
                 MapArea area = new JChartMapArea(jChartsArea);
                 area.setTooltip((int)jChartsArea.getValue() + " $");
                 context.addMapArea(area);
               }
           } catch(Throwable e){
               e.printStackTrace();
           }
           
           //set expiration time to 5 minutes 
           context.setExpiresAt(System.currentTimeMillis() + 1000 * 60 * 5);
       }
    
    /*
     * Produce a chart using the jCharts-API
     */   
    private Chart makeJChart(IPainterContext context, double[] data) throws Exception{
           GregorianCalendar cal = new GregorianCalendar();
           
           String[] xLabels = new String[MINUTES_BACK];
           
           for (int i = MINUTES_BACK - 1; i >= 0 ;i--) {
              if(i != MINUTES_BACK - 1) cal.add(Calendar.MINUTE, -1);
              xLabels[i] = cal.get(Calendar.HOUR_OF_DAY) + "h " + cal.get(Calendar.MINUTE );
            }
           String xTitle = "Time";
           String yTitle = "Price in $";
           String title = getCompanyName() + " (last updated "+ new Date()+")";
           DataSeries dataSeries = new DataSeries( xLabels, xTitle, yTitle, title );
           String[] legendLabels = {getCompanyName() + " stock price"};
           Paint[] paints = new Paint[]{Color.BLUE};
           Stroke[] strokes= { new BasicStroke( 1.0f )};
           Shape[] shapes= { PointChartProperties.SHAPE_CIRCLE };
           LineChartProperties lineChartProperties= new LineChartProperties(strokes, shapes);
           AxisChartDataSet axisChartDataSet = 
               new AxisChartDataSet(new double[][]{data}, legendLabels, paints, 
                  ChartType.LINE, lineChartProperties );
           dataSeries.addIAxisPlotDataSet( axisChartDataSet );
           ChartProperties chartProperties= new ChartProperties();
    
           AxisProperties axisProperties= new AxisProperties();
           LegendProperties legendProperties= new LegendProperties();

           return new AxisChart( dataSeries, chartProperties, 
                   axisProperties, legendProperties, context.getWidth(), context.getHeight());
        
    } 

    /*
     * retrieve stock prices out of a randomDB 
     */
    private double[] getStockData(String name) {
        Random random = new Random(System.currentTimeMillis());
        double[] data = new double[MINUTES_BACK];
        double start = random.nextDouble() * 1000.0 + 1.0;
        for (int i = 0; i < data.length; i++) {
            start += start * 0.4 * random.nextGaussian();
            if(start < 0)  start = - start;
            data[i] = start;
        }
        return data;
    }

}

JChartMapArea.java

			
package examples.dynimg;

import java.io.Serializable;

import org.jCharts.imageMap.ImageMapArea;

import net.sf.sotacs.dynimg.api.MapArea;

public class JChartMapArea extends MapArea implements Serializable{

	private ImageMapArea jChartMapArea = null;
	
	public JChartMapArea(ImageMapArea jChartMapArea) {
		this.jChartMapArea = jChartMapArea;
	}

	@Override
	public String getHtmlMapCoords() {
		return null;
	}

	@Override
	public String getHtmlMapType() {
		return null;
	}

	@Override
	public String toHTML(String link) {
		StringBuilder sb = new StringBuilder();
		addOptionalAttributes(sb, link);
		return jChartMapArea.toHTML(sb.toString());
	}

}