jquery用jqplot插件画图事例

jquery用jqplot插件画图例子
$.jqplot.config.enablePlugins = true;

    l1 = [2, 3, 1, 4, 3];
    l2 = [1, 4, 3, 2, 5];

    line1=[['2008-09-30', 4], ['2008-10-30', 6.5], ['2008-11-30', 5.7], ['2008-12-30', 9], ['2009-01-30', 8.2]];
    line2=[['2008-09-30', 3], ['2008-10-30', 5.5], ['2008-11-30', 5.7], ['2008-12-30', 10], ['2009-01-30', 9.2]];
    
    plot2 = $.jqplot('chart2', [line1,line2], {
        title:'Rotated Axis Text',
        axes:{
            xaxis:{
                renderer:$.jqplot.DateAxisRenderer,
                min:'August 30, 2008',
                tickInterval:'1 month',
                rendererOptions:{
                    tickRenderer:$.jqplot.CanvasAxisTickRenderer},
                    tickOptions:{formatString:'%b %#d, %Y', fontSize:'10pt', fontFamily:'Tahoma', angle:-40, fontWeight:'normal', fontStretch:1}
            }
        },
        series:[{lineWidth:4, markerOptions:{style:'square'}}]
    });
   
     line1 = [[4, 1], [4, 2], [3, 3], [16, 4]];
     line2 = [[3, 1], [7, 2], [4, 3], [3.125, 4]];
     plot3 = $.jqplot('chart3', [line1, line2], {
         //stackSeries: true,
         legend: {
             show: true,
             location: 'se'
         },
         title: '条形图',
         seriesDefaults: {
             renderer: $.jqplot.BarRenderer,
             rendererOptions: {
                 barDirection: 'horizontal',
                 barPadding: 6,
                 barMargin: 10
             }
         },
         series: [{
             label: '1st Qtr'
         },
         {
             label: '2nd Qtr'
         }],
         axes: {
             yaxis: {
                 renderer: $.jqplot.CategoryAxisRenderer,
                 ticks: ['Q1', 'Q2', 'Q3', 'Q4']
             },
             xaxis: {min: 0, max: 20, numberTicks:5}
         }
     });
   
     line1 = [[4, 1], [4, 2], [3, 3], [16, 4]];
     line2 = [[3, 1], [7, 2], [4, 3], [3.125, 4]];
     plot3 = $.jqplot('chart3d', [line1, line2], {
         stackSeries: true,
         legend: {
             show: true,
             location: 'se'
         },
         title: '条形图',
         seriesDefaults: {
             renderer: $.jqplot.BarRenderer,
             rendererOptions: {
                 barDirection: 'horizontal',
                 barPadding: 6,
                 barMargin: 40
             }
         },
         series: [{
             label: '1st Qtr'
         },
         {
             label: '2nd Qtr'
         }],
         axes: {
             yaxis: {
                 renderer: $.jqplot.CategoryAxisRenderer,
                 ticks: ['Q1', 'Q2', 'Q3', 'Q4']
             },
             xaxis: {min: 0, max: 20, numberTicks:5}
         }
     });
     line1 = [4, 2, 9, 16];
     line2 = [3, 7, 6.25, 3.125];
     plot3b = $.jqplot('chart3b', [line1, line2], {
         stackSeries: true,
         legend: {
             show: true,
             location: 'nw'
         },
         title: '柱状图1',
         seriesDefaults: {
             renderer: $.jqplot.BarRenderer,
             rendererOptions: {
                 barPadding: 6,
                 barMargin: 40
             }
         },
         series: [{
             label: '1st Qtr'
         },
         {
             label: '2nd Qtr'
         }],
         axes: {
             xaxis: {
                 renderer: $.jqplot.CategoryAxisRenderer,
                 ticks: ['Q1', 'Q2', 'Q3', 'Q4']
             },
             yaxis: {min: 0, max: 20, numberTicks:5}
         }
     }); 
    
     line1 = [4, 2, 9, 16];
     line2 = [3, 7, 6.25, 3.125];
     plot3c = $.jqplot('chart3c', [line1, line2], {
         legend: {
             show: true,
             location: 'nw'
         },
         title: '柱状图2',
         seriesDefaults: {
             renderer: $.jqplot.BarRenderer,
             rendererOptions: {
                 barPadding: 6,
                 barMargin: 20
             }
         },
         series: [{
             label: '1st Qtr'
         },
         {
             label: '2nd Qtr'
         }],
         axes: {
             xaxis: {
                 renderer: $.jqplot.CategoryAxisRenderer,
                 ticks: ['Q1', 'Q2', 'Q3', 'Q4']
             },
             yaxis: {min: 0, max: 20, numberTicks:5}
         }
     });  
//  
   line1 = [['item1', 3], ['item2', 7], ['item3', 2.5], ['item4', 6], ['item5', 5], ['item6', 4]];
   line2 = [3, 7, 2.5, 6, 5, 4];
  
   plot4 = $.jqplot('chart4', [line1], {
     title: '饼图1',
     seriesDefaults:{renderer:$.jqplot.PieRenderer},
     legend:{show:true}
   });
   line1 = [['item1', 3], ['item2', 7], ['item3', 2.5], ['item4', 6], ['item5', 5], ['item6', 4]];
   line2 = [3, 7, 2.5, 6, 5, 4];
  
   plot4 = $.jqplot('chart4b', [line1], {
     title: '饼图2',
     seriesDefaults:{renderer:$.jqplot.PieRenderer, rendererOptions:{sliceMargin:4}},
     legend:{show:true}
   });
     l1 = [2.2, 3, .6, 4.8, 3];
     l2 = [1, 4, 3, 2, 5.7];
     l3 = [1, 5, 6, 7, 5.7];
 
 
    plot5 = $.jqplot('chart5', [l1, l2,l3]);