1

我想创建一个包含 31 天数据的图表,然后放大我希望能够放大这些天,例如 7 天,如果我要突出显示 7 天。

我遇到的问题是我希望 x 轴上的标签从第一天开始,最后一个是最后一天,但 jqPlot 似乎出于某种原因增加了天数。

例如,在下面的数据中,x 轴从 21 开始,最后一个是 26,但我希望它每天显示从 22 到 23。我尝试使用最小值和最大值,但只有一个有效。

我还希望它每天显示 1、2、3、4 等,而不是像目前那样显示 1、5、12、19 等。

我还注意到,当您放大时,有时它有 3、4、4、4、5、5、5、6 等,我每天都想要它。

这是我当前的代码:

$(document).ready(function(){
        s1 = [["6/22/2012",425.32], ["6/23/2012",424.84], ["6/24/2012",417.23], ["6/25/2012",390],
            ["6/26/2012",393.69], ["6/27/2012",392.24], ["6/28/2012",369.78], ["6/29/2012",330.16], ["6/30/2012",308.57],
            ["7/1/2012",346.45], ["7/2/2012",371.28], ["7/3/2012",324.7], ["7/4/2012",315.07], ["7/5/2012",300.36],
            ["7/6/2012",315.76], ["7/7/2012",292.96], ["7/8/2012",310.02], ["7/9/2012",359.36], ["7/10/2012",372.54],
            ["7/11/2012",386.91], ["7/12/2012",449.15], ["7/13/2012",444.25], ["7/14/2012",463.29],  ["7/15/2012",510.15],
            ["7/16/2012",467.86],["7/17/2012",467.86], ["7/18/2012",481.32], ["7/19/2012",537], ["7/20/2012",546.43], ["7/21/2012",567],
            ["7/22/2012",544.62], ["7/23/2012",573.2]];



        var plot1 = $.jqplot('chart1', [s1], {
            title: 'test',
            series: [{
                label: 'test',
                renderer:$.jqplot.BarRenderer
            }],
            axes: {
                xaxis: {
                    renderer:$.jqplot.DateAxisRenderer,

                    tickOptions:{formatString:"%#d"}
                },
                yaxis: {
                    // renderer: $.jqplot.LogAxisRenderer,
                    tickOptions:{
                        formatString:'$%.2f'
                    }
                }
            },
            cursor:{
                show: true,
                zoom: true,
                constrainZoomTo: 'x'
            }
        });
    });

谁能帮我这个?

4

1 回答 1

3

通过添加 numberTicks 以及最小值和最大值来计算:

xaxis: {
                    renderer:$.jqplot.DateAxisRenderer,
                    min: '6/22/2012',
                    max:   '7/23/2012',
                    numberTicks: 31,
                    tickOptions:{formatString:"%#d"}
                },

它解决了额外天数的问题,并且缩放现在可以正常工作

于 2012-04-18T09:02:16.610 回答