jqPlot:折线图:不显示线条和刻度

时间:2014-11-03 01:23:57

标签: javascript jqplot linegraph

我正在努力创建一个jqPlot线图,我希望有人可以提供帮助。出于某种原因,我的线条和刻度没有出现,我无法弄清楚原因。我已经复制了下面麻烦的代码。

谁能告诉我我做错了什么?

如果我还有其他任何事情可以帮助说明或解决问题,请告诉我。

$(document).ready(function(){   

    var line1 = [['07-01-2014',0],['08-01-2014',87],['09-01-2014',0],['10-01-2014',0],['11-01-2014',0],['12-01-2014',0],['01-01-2015',0],['02-01-2015',71],['03-01-2015',0],['04-01-2015',83],['05-01-2015',0],['06-01-2015',82]]
    var line2 = [['07-01-2014',0],['08-01-2014',85],['09-01-2014',0],['10-01-2014',0],['11-01-2014',1],['12-01-2014',0],['01-01-2015',0],['02-01-2015',71],['03-01-2015',0],['04-01-2015',83],['05-01-2015',0],['06-01-2015',82]]
    var jqpData = [line1, line2];

    var xLabels = ['07-01-2014','08-01-2014','09-01-2014','10-01-2014','11-01-2014','12-01-2014','01-01-2015','02-01-2015','03-01-2015','04-01-2015','05-01-2015','06-01-2015'],
        lLables = ['Series 1','Series 2'];

    $(function () {
        var plot1 = $.jqplot('chart1', jqpData, {
            title: 'July through June',
            seriesDefaults:{

                rendererOptions: {smooth: true},
                label:' ',
                lineWidth: 2
            },
            axesDefaults: {
                labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer
            },
            legend:{
                show: true,
                location: 'sw',
                placement: 'outsideGrid',
                labels: lLables
            },
            axes: {
                xaxis: {
                    renderer:$.jqplot.DateAxisRenderer,
                    tickOptions:{
                        angle:-30,
                        fontFamily:'Trebuchet MS,Arial,Helvetica,sans-serif',
                        fontSize: '1em',
                        min:'07-01-2014', 
                        tickInterval:'1 month'
                    }
                },
                yaxis:{
                    label:'',
                    min:0,
                    max:96.9849
                }
            }
        });
    });
});

1 个答案:

答案 0 :(得分:1)

尝试将其添加为以下选项之一:

axes: {
    xaxis:{
        renderer: $.jqplot.CategoryAxisRenderer, //etc

更多信息: 如果您还没有看过这个链接:

http://www.jqplot.com/docs/files/jqplot-axisTickRenderer-js.html

然后如下所示申请:

http://www.jqplot.com/tests/rotated-tick-labels.php