一、用JavaScript做出饼状图或柱形图，需要精通JS代码。

二、利用第三方网站提供的组件：

1、Open Flash Chart是一个开源的Flash制图组件。

2、 XML SWF Charts是一个简单，但强大，利用Flash和动态生成XML数据来产生web chart的工具。

3、 Flotr是一个基于Prototype开发的javascript绘图工具。支持图例，鼠标跟踪，图片区域选择，图片缩放，添加事件钩子（event hook），通过CSS设置样式等。

4、FusionCharts Free是一个制图组件用于创建好看，数据驱动，拥有动画效果的Flash charts。它能够与PHP、Python、Ruby on Rails、ASP、http://ASP.NET、JSP、ColdFusion、HTML页面等一起使用。这个组件是FusionCharts的免费版，但功能仍然很强大。

jfreechart绘制柱状图

import java.io.File

import java.io.IOException

import org.jfree.chart.ChartFactory

import org.jfree.chart.ChartUtilities

import org.jfree.chart.JFreeChart

import org.jfree.chart.plot.PlotOrientation

import org.jfree.data.category.DefaultCategoryDataset

/*

* 绘制柱状图

*你亮哥

* */

public class BarChart3DDemo

{

public static void main(String[] args)

{

try

{

//设置主题

ChartFactory.setChartTheme(Theme.getTheme())

//构造数据

DefaultCategoryDataset dataset = new DefaultCategoryDataset()

dataset.addValue(100, "JAVA","1")

dataset.addValue(200, "js","1")

dataset.addValue(200, "C++", "2")

dataset.addValue(300, "C", "3")

dataset.addValue(400, "HTML", "4")

dataset.addValue(400, "CSS", "5")

/*

* public static JFreeChart createBarChart3D(

* java.lang.String title, 设置图表的标题

* java.lang.String categoryAxisLabel, 设置分类轴的标示

* java.lang.String valueAxisLabel, 设置值轴的标示

* CategoryDataset dataset, 设置数据

* PlotOrientation orientation, 设置图表的方向

* boolean legend, 设置是否显示图例

* boolean tooltips,设置是否生成热点工具

* boolean urls) 设置是否显示url

*/

JFreeChart chart = ChartFactory.createBarChart3D("编程语言统计", "语言",

"学习人数", dataset, PlotOrientation.VERTICAL, true, false,

false)

//保存图表

ChartUtilities.saveChartAsPNG(new File("E:/chart/BarChart3D.png"), chart, 800, 500)

System.out.println("绘图完成")

}

catch (IOException e)

{

e.printStackTrace()

}

}

}

===================================================================================

//一条线 有点 有数

package Test

import java.awt.Color

import java.awt.Font

import org.jfree.chart.ChartFactory

import org.jfree.chart.ChartFrame

import org.jfree.chart.JFreeChart

import org.jfree.chart.axis.AxisSpace

import org.jfree.chart.labels.ItemLabelAnchor

import org.jfree.chart.labels.ItemLabelPosition

import org.jfree.chart.labels.StandardXYItemLabelGenerator

import org.jfree.chart.plot.XYPlot

import org.jfree.chart.renderer.xy.XYItemRenderer

import org.jfree.chart.renderer.xy.XYLineAndShapeRenderer

import org.jfree.chart.title.TextTitle

import org.jfree.data.time.Month

import org.jfree.data.time.TimeSeries

import org.jfree.data.time.TimeSeriesCollection

import org.jfree.ui.RectangleInsets

import org.jfree.ui.TextAnchor

public class try123 {

public static void main(String[] args){

//首先构造数据

TimeSeries timeSeries = new TimeSeries("BMI", Month.class)

// 时间曲线数据集合

TimeSeriesCollection lineDataset = new TimeSeriesCollection()

// 构造数据集合

timeSeries.add(new Month(1, 2009), 45)

timeSeries.add(new Month(2, 2009), 46)

timeSeries.add(new Month(3, 2009), 1)

timeSeries.add(new Month(4, 2009), 500)

timeSeries.add(new Month(5, 2009), 43)

timeSeries.add(new Month(6, 2009), 324)

timeSeries.add(new Month(7, 2009), 632)

timeSeries.add(new Month(8, 2009), 34)

timeSeries.add(new Month(9, 2009), 12)

timeSeries.add(new Month(10, 2009), 543)

timeSeries.add(new Month(11, 2009), 32)

timeSeries.add(new Month(12, 2009), 225)

lineDataset.addSeries(timeSeries)

JFreeChart chart = ChartFactory.createTimeSeriesChart("", "date", "bmi", lineDataset, true, true, true)

//增加标题

chart.setTitle(new TextTitle("XXXBMI指数", new Font("隶书", Font.ITALIC, 15)))

chart.setAntiAlias(true)

XYPlot plot = (XYPlot) chart.getPlot()

plot.setAxisOffset(new RectangleInsets(10,10,10,10))//图片区与坐标轴的距离

plot.setOutlinePaint(Color.PINK)

plot.setInsets(new RectangleInsets(15,15,15,15))//坐标轴与最外延的距离

// plot.setOrientation(PlotOrientation.HORIZONTAL)//图形的方向，包括坐标轴。

AxisSpace as = new AxisSpace()

as.setLeft(25)

as.setRight(25)

plot.setFixedRangeAxisSpace(as)

chart.setPadding(new RectangleInsets(5,5,5,5))

chart.setNotify(true)

// 设置曲线是否显示数据点

XYLineAndShapeRenderer xylineandshaperenderer = (XYLineAndShapeRenderer)plot.getRenderer()

xylineandshaperenderer.setBaseShapesVisible(true)

// 设置曲线显示各数据点的值

XYItemRenderer xyitem = plot.getRenderer()

xyitem.setBaseItemLabelsVisible(true)

xyitem.setBasePositiveItemLabelPosition(new ItemLabelPosition(ItemLabelAnchor.INSIDE10, TextAnchor.BASELINE_LEFT))

xyitem.setBaseItemLabelGenerator(new StandardXYItemLabelGenerator())

xyitem.setBaseItemLabelFont(new Font("Dialog", 1, 14))

plot.setRenderer(xyitem)

//显示

ChartFrame frame = new ChartFrame("try1", chart)

frame.pack()

frame.setVisible(true)

}

}