前台强大的图表（js）

http://www.jqplot.com/ 网址，自己下载下例子看一下就明白了。

  这个是我之前做的项目中的例子（仅是部分代码）：

function publicMethod(){
            
             var plot1 = $.jqplot(chart, [currYear], {
                 seriesColors: ["rgb(23, 108, 238)"],
                 title: titles,
                  highlighter: {
                     show: true,
                     sizeAdjust: 1,
                     tooltipOffset: 9
                 },
                 grid: {
                     background: ‘rgba(57,57,57,0.0)‘,
                     drawBorder: false,
                     shadow: false,
                     gridLineColor: ‘#666666‘,
                     gridLineWidth: 1
                 },
                 legend: {
                     show: true,
                     placement: ‘outside‘
                 },
                 series: [
                     {
                         label: visits
                     }
                 ],
                 axes: {
                     xaxis: {
                         renderer: $.jqplot.DateAxisRenderer,
                          tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                         tickOptions: {
                             formatString: "%b %e",
                             angle: -30,
                             textColor: ‘#333333‘
                         },
                         min: start_array,
                         max: end_array,
                         tickInterval: distance,
                          drawMajorGridlines: false
                     },
                 },
             });

               $(‘.jqplot-highlighter-tooltip‘).addClass(‘ui-corner-all‘);  
        }

返回的数据类型在上面链接中就有，有很多不同样式的图表。

前台强大的图表（js）,布布扣,bubuko.com

前台强大的图表（js）

原文：http://www.cnblogs.com/sm-hl/p/chihuo.html