highcharts是一個javascript圖表庫，支援曲線圖、柱狀圖、餅圖、散點圖等。具體的demo可檢視官方網站：highcharts示例

       使用之前肯定要引入相應的js檔案，以3d餅圖為例，需要引用highcharts.js和highcharts-3d.js，兩個檔案可到官網下載。引數div為餅圖在html中的容器的id，pieTitle和pieSubTitle為餅圖的標題和副標題，pieSeriesName是欄位值的名稱。pieSeriesData是一個數組，每個元素也是一個數組，包括欄位名和欄位值兩個元素，欄位值必須為數值型。

pieSeriesData = new Array();.push(new Array(key,value));

function pieChart(div) {
    Highcharts.chart(div, {
        chart: {
            type: 'pie',
            options3d: {
                enabled: true,
                alpha: 45
            }
        },
        title: {
            text: pieTitle
        },
        subtitle: {
            text: pieSubTitle
        },
        plotOptions: {
            pie: {
                innerSize: 100,
                depth: 45,
                events: {
                    click: function (e) {pieClick(e.point.name);}    
                }
            }
        },
        series: [{
            name: pieSeriesName,
            data: pieSeriesData
        }]
    });
}
 

餅圖的點選事件

function pieClick(name){

//name為所點選的餅圖區域的key值，即pieSeriesData中配置的資料來源中的key，可根據key值進行相關操作。

}

效果圖如下：