学习笔记：jqchart

（Highcharts 167K； 　　ECharts 354K；　　jqChart 240K），如果用于网络，Highchart最小

jqchart 国外的一个图表库　　　　挺漂亮的

http://www.jqchart.com　　官网

一个饼图的小例子：

<link rel="stylesheet" type="text/css" href="http://www.jqchart.com/jquery/chart/Content/jquery.jqChart.css" />

<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>

<script src="http://www.jqchart.com/jquery/chart/Scripts/jquery.jqChart.min.js" type="text/javascript"></script>

<!--[if IE]><script lang="javascript" type="text/javascript" src="http://www.jqchart.com//jquery/chart/Scripts/excanvas.js"></script><![endif]-->

<script lang="javascript" type="text/javascript">

  $(document).ready(function () {

    var background = {

        type: 'linearGradient',

        x0: 0,

        y0: 0,

        x1: 0,

        y1: 1,

        colorStops: [{ offset: 0, color: '#d2e6c9' },

                 { offset: 1, color: 'white' }]

    };

    $('#jqChart').jqChart({

        title: { text: 'Doughnut Chart' },

        legend: { title: 'Countries' },

        border: { strokeStyle: '#6ba851' },

        background: background,

        animation: { duration: 1 },

        shadows: {

          enabled: true

        },

        series: [

          {

            type: 'doughnut',

            innerExtent: 0.5,

            outerExtent: 1.0,

            fillStyles: ['#418CF0','#FCB441','#E0400A','#056492','#BFBFBF','#1A3B69','#FFE382'],

            labels: {

                stringFormat: '%.1f%%',

                valueType: 'percentage',

                font: '15px sans-serif',

                fillStyle: 'white'

            },

            data: [

                ['家具',27],

                ['家电',20],

                ['布艺装饰',10],

                ['材料费',24],

                ['人工费',10],

                ['管理费',4],

                ['设计费',5]

            ]

          }

        ]

    });

  });

</script>

<div id="jqChart" style="width:500px;height:300px;"></div>

..