{工具}HightChart 圖表套件

圓餅圖實例：
xxx.cs >>
//資料來源
var newData =ReadResult;
//資料轉為Json
data = new JavaScriptSerializer().Serialize(newData.Data);
 HiddenField1.Value=data;
//被統計項目
returnValue = new JavaScriptSerializer().Serialize(newData.Title);

xxx.aspx >>
<script type="text/javascript">
        var chart;
        $(document).ready(function () {
//解析資料來源
            var dataArr=new Array();
            if ($('#<%=HiddenField1.ClientID%>').val() != '') {
                dataArr = JSON.parse($('#<%=HiddenField1.ClientID%>').val());
                }
            var categories = <%=returnValue %>;
            var data=new Array();
            for(i=0;i<dataArr.length;i++)
            {
                data.push({name:categories[i],y:dataArr[i]});
            }

       //開始畫圖   
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
//圓餅圖表
                    defaultSeriesType:'pie'
                },
                title: {
                    text: 'High Chart'
                },
                xAxis: {
                    categories: <%=returnValue %>
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage}%</b>',
                    percentageDecimals: 1
                },
                plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                        color: '#000000',
                        connectorColor: '#000000',
                        formatter: function() {
                            return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
                        }
                    }
                }
            },
                series: [{ data: data}]
            });

        });
       
      
    </script>




http://www.highcharts.com/demo/line-log-axis

相關範例∶
http://www.dotblogs.com.tw/lastsecret/archive/2011/01/30/21137.aspx
http://www.cnblogs.com/jsonzheng/archive/2011/05/13/2045344.html

長條圖：
http://www.cnblogs.com/jsonzheng/archive/2011/01/18/1938489.html

API:
http://api.highcharts.com/highcharts#title