使用highcharts画图

<script type="text/javascript" src="Scripts/jquery-1.7.min.js"></script>
<script type="text/javascript" src="Scripts/highcharts/highcharts.js"></script>
<script type="text/javascript" src="Scripts/highcharts/themes/grid.js"></script>

 

        //renderTo    要显示的ID
        //title_text  标题
        //subtitle    副标题
        //yAxis_text  Y轴文字
        //tip_text    提示文字
        //series_name 分组的名称
        //series_data 数据
        function drawColumn(renderTo, title_text, subtitle, yAxis_text,tip_text,series_name, series_data) {
            $(document).ready(function () {
                chart = new Highcharts.Chart({
                    chart: {
                        renderTo: renderTo,  //放置图表的容器
                        type: 'column'       //图表类型
                    },
                    title: {                //主标题
                        text: title_text
                    },
                    subtitle: {             //副标题
                        text: subtitle
                    },
                    credits: {
                        enabled: false      //禁用名片
                    },
                    exporting: {
                        enabled: false      //禁用导出,打印图片按钮
                    },
                    xAxis: {
                        categories: [
                                '1月',
                                '2月',
                                '3月',
                                '4月',
                                '5月',
                                '6月',
                                '7月',
                                '8月',
                                '9月',
                                '10月',
                                '11月',
                                '12月'
                            ],
                        labels: {
                            //rotation: -45,//控制斜体
                            align: 'right',
                            style: {font: 'normal 10px 宋体'},
                            x:5
                            }
                    },
                    yAxis: {
                        min: 0,
                        title: {
                            text: yAxis_text
                        }
                    },
                    legend: {
                        layout: 'vertical',
                        backgroundColor: '#FFFFFF',
                        align: 'left',
                        verticalAlign: 'top',
                        x: 100,
                        y: 70,
                        floating: true,
                        shadow: true,
                        enabled:false//禁用图例
                    },
                    tooltip: {
                        formatter: function () {
                            return '' + this.x + ': ' + Highcharts.numberFormat(this.y)+tip_text;
                        }
                    },
                    plotOptions: {
                        column: {
                             cursor: 'pointer',
                             //allowPointSelect:true,
                             point: {
                                events: {
                                    click: function() {
                                        //window.open();                                       
                                        tt(this.x+1);//点击柱子跳转URL                                        
                                    }
                                }
                            },
                            pointPadding: 0.2,
                            borderWidth: 0,
                            pointWidth:15    //显示的宽度
                        }
                    },                    
                    series: [{
                        name: series_name,
                        data: series_data,  //逗号不要多余
                        dataLabels:{　　　　　//在柱子的顶部显示值
                            enabled:true,
                            formatter:function(){
                                if(this.y>0){
                                    return Highcharts.numberFormat(this.y);
                                }                                
                            }
                        }
                    }]
                });
            });
        }
    </script>
    <script type="text/javascript">
        function tt(month) {
            window.location.href = "SearchCer.aspx?month=" + month;
        }
    </script>

如果你想对一个柱子使用不同的颜色的话：将series中的 data格式改成这样: [{"color":"red","y":49.9}]，加入一个color属性控制它的颜色