javascript - JqPlot显示数据

Question

我可以帮忙在图表上显示数据吗？我正在使用 JqPlot。

这是我的代码:

            line0 = [["2012-07-31",3.8182],["2012-08-01",3.4000],["2012-08-02",3.7500]]; 
            line1 = [["2012-07-31",4.8182],["2012-08-01",4.4000],["2012-08-02",4.7500]];
            line2 = [["2012-07-31",5.8182],["2012-08-01",5.4000],["2012-08-02",5.7500]];
        plot1 = $.jqplot('servicechart', [line0,line1,line2], {
            legend:{show:false}, 
            title:'<b>Service</b>',
            seriesDefaults:{pointLabels:{show:false}},
            grid: {background:'#f8f8f8', gridLineColor:'#dbdbdb',borderWidth: 0,shadowDepth: 0},
            axes:{
                yaxis: {  label: 'Service -1 (poor) to 4 (excellent)', min: 1, max: 4, tickInterval: 1,labelRenderer: $.jqplot.CanvasAxisLabelRenderer},
                xaxis:{ label: 'Months', renderer:$.jqplot.DateAxisRenderer, tickInterval:'1 month',tickOptions:{formatString:'%b %#d, %Y'}  }
            },
            seriesColors: [ "#329dd5", "#0d8e17", "#f47320"],
            highlighter: { tooltipLocation: 's',tooltipAxes: 'both',tooltipSeparator: ' - ',tooltipOffset: 10,sizeAdjust: 8,tooltipFadeSpeed:'slow'   }             
        });

由于某种原因，数据未显示在图表上。有人可以帮我解决这个问题吗？

提前致谢。

Answer 1

试试这个:

注意这些行:

/*labelRenderer: $.jqplot.CanvasAxisLabelRenderer*/ //It is not necessary

xaxis:{
  min:"2012-07-01" //you need to put min...if not..it doesn't work

highlighter: {
            show:true //For obvious reasons

完整示例:http://jsfiddle.net/pabloker/C5W4b/1/

var line0 = [["2012-07-01",1.8182],["2012-08-01",1.4000],["2012-09-01",1.7500]]; 
var line1 = [["2012-07-01",2.8182],["2012-08-01",2.4000],["2012-09-01",2.7500]];
var line2 = [["2012-07-01",3.8182],["2012-08-01",3.4000],["2012-09-01",3.7500]];

var plot1 = $.jqplot('servicechart', [line0,line1,line2], {
        legend:{
            show:false
        }, 
        title:'<b>Service</b>',
        seriesDefaults:{
            pointLabels:{
                show:false
            }
        },
        grid: {
            background:'#f8f8f8', 
            gridLineColor:'#dbdbdb',
            borderWidth: 0,
            shadowDepth: 0},
        axes:{
            yaxis: {  
                label: 'Service -1 (poor) to 4 (excellent)', 
                min: 1, 
                max: 4, 
                tickInterval: 1
                /*labelRenderer: $.jqplot.CanvasAxisLabelRenderer*/
            },
            xaxis:{ 
                label: 'Months', 
                renderer:$.jqplot.DateAxisRenderer, 
                tickInterval:'1 month',
                min:"2012-07-01",
                tickOptions:{
                    formatString:'%b %#d, %Y'
                }  
            }
        },
        seriesColors: [ "#329dd5", "#0d8e17", "#f47320"],
        highlighter: {
            show:true,
            tooltipLocation: 's',
            tooltipAxes: 'both',
            tooltipSeparator: ' - ',
            tooltipOffset: 10,
            sizeAdjust: 8,
            tooltipFadeSpeed:'slow'   }             
    });