建立基于WEB的BI图表

一般情况下，JFreeChart只能是基于applet的app，不过，这对客户端要求过高，那么有人就会想到，能转换成jpg或者png等图片格式吗？当然，这是最关键的就是ChartUtilities这个类，它就像一个JFreeChart想摆脱局限的桥梁，有了它，那就一切皆有可能（当然也不是万能的，就像钱一样）。

为此，我就对于我的上篇文章，做进一步的扩展。先看效果

再看源代码

/**/ /* 
* author:hujinpu
*/  
package  com.hujinpu .test; 
  
import  java.io.File; 
import  java.io.FileOutputStream; 
import  java.io.IOException; 
import  java.io.PrintWriter; 
import  java.util.HashMap; 
import  java.util.Map; 
  
import  org.jfree.chart.ChartFactory; 
import  org.jfree.chart.ChartRenderingInfo; 
import  org.jfree.chart.ChartUtilities; 
import  org.jfree.chart.JFreeChart; 
import  org.jfree.chart.labels.StandardPieToolTipGenerator; 
import  org.jfree.chart.plot.PiePlot; 
import  org.jfree.chart.urls.CustomPieURLGenerator; 
import  org.jfree.data.general.DefaultPieDataset; 
  
public   class  PieWithMap  ... { 
    public static void main(String[] args) throws IOException ...{ 
  
        // 第一步创建数据集 
        DefaultPieDataset dataset = new DefaultPieDataset(); 
        dataset.setValue("类别1", 125.3); 
        dataset.setValue("类别2", 52.7); 
        dataset.setValue("类别3", 10.6); 
        dataset.setValue("类别4", 85.96); 
        dataset.setValue("类别5", 43.2); 
  
        // 第二步创建一个JFreeChart对象 
        JFreeChart chart = ChartFactory.createPieChart("第一个饼图", dataset, true, // 是否有图注 
                true, // 是否有提示 
                false // 是否有URLS 
                ); 
  
        ChartUtilities.saveChartAsJPEG(new File("firstPieChart.jpg"), chart, 300, 300); 
        // 根据不同类型的图表使用不同类，以下是针对饼图的操作 
        PrintWriter w = null; 
        FileOutputStream fos_jpg = null; 
        FileOutputStream fos_cri = null; 
        //这个是重点 
        ChartRenderingInfo info = new ChartRenderingInfo(); 
        
        PiePlot plot = (PiePlot) chart.getPlot(); 
        //构造一个Map用于指定具体类别的url 
        Map urls = new HashMap(); 
        urls.put("类别1", "http://www.livahu.com"); 
        urls.put("类别2", "http://www.google.com"); 
        urls.put("类别3", "http://www.baidu.com"); 
        urls.put("类别4", "http://www.163.com"); 
        urls.put("类别5", "http://www.youkuaiyun.com"); 
        
        CustomPieURLGenerator cpug = new CustomPieURLGenerator(); 
        
        cpug.addURLs(urls); 
        
        plot.setURLGenerator(cpug); 
        
        // 设置工具提示 
        plot.setToolTipGenerator(new StandardPieToolTipGenerator()); 
        
        fos_jpg = new FileOutputStream("firstPieChart.jpg"); 
        
        //把pieChart图生成出来，写入到输出流生成图片，同时把图片的具体信息放入ChartRenderingInfo的一个实例为以后生成Map提供信息 
        ChartUtilities.writeChartAsJPEG(fos_jpg, 1.0f, chart, 400, 300, info); 
        fos_cri = new FileOutputStream("firstPieChart.map"); 
        
        w = new PrintWriter(fos_cri); 
        //使用info中的图像具体信息生成关于这个图像的类别热点，并把它写到输出流中生成map文件。 
        ChartUtilities.writeImageMap(w, "mymap", info, true); 
        w.flush(); 
    } 
}

大家会注意到，ChartUtilities类在其中起了一个最为重要的作用。

我创建了一个ChartRenderingInfo对象并在调用ChartUtilities的writeChartAsJPEG时作为最后一个参数传递进去。

调用该方法结束后将产生一个图像文件以及一个填充好MAP数据的ChartRenderingInfo对象，再通过ChartUtilities的writeImageMap方法来将ChartRenderingInfo对象读取出来，写到map文件中去。

具体map文件如下

< map  id ="mymap"  name ="mymap" >  
< area  shape ="poly"  coords ="137,92,150,80,165,71,182,66,200,64,200,147,200,147"  onMouseOver ="return overlib('类别5 = 43.2');"  onMouseOut ="return nd();"  href ="http://www.youkuaiyun.com" />  
< area  shape ="poly"  coords ="153,216,140,205,129,191,121,175,117,158,116,140,120,123,126,107,137,92,200,147,200,147"  onMouseOver ="return overlib('类别4 = 85.96');"  onMouseOut ="return nd();"  href ="http://www.163.com" />  
< area  shape ="poly"  coords ="169,225,153,216,200,147,200,147"  onMouseOver ="return overlib('类别3 = 10.6');"  onMouseOut ="return nd();"  href ="http://www.baidu.com" />  
< area  shape ="poly"  coords ="251,213,232,224,211,230,190,230,169,225,200,147,200,147"  onMouseOver ="return overlib('类别2 = 52.7');"  onMouseOut ="return nd();"  href ="http://www.google.com" />  
< area  shape ="poly"  coords ="200,64,213,65,225,68,237,73,248,79,258,87,266,97,273,108,278,120,282,133,283,146,282,158,279,171,275,183,269,194,261,204,251,213,200,147,200,147"  onMouseOver ="return overlib('类别1 = 125.3', STICKY, MOUSEOFF);"  onMouseOut ="return nd();"  href ="http://blog.youkuaiyun.com/hujinpu" />  
</ map >

这里还有必要说明是我用到了overlib中的overlib.js，overlib是一个开源js类库, 这是官方网站，里面说得很详细，其实一般情况下，我们只要把overlib.js这个js复制到你的目录就行了
(也可以在本站看我写的overlib简明教程)

注意类别1，我玩子一个小小的trick哦！(这里由于没有上传overlib.js这个文件，可能看不到效果)