Jqplot日期渲染器填充问题

Question

我遇到了一个关于jqplot日期作为X轴的问题。

我的代码是：

var data = [
    ["10/23/2011", 266522], 
    ["10/24/2011", 170287], 
    ["10/25/2011", 2175], 
    ["10/26/2011", 1794]
];

$.jqplot('chart1', [data], {

    axes: {
        xaxis: {
            renderer: $.jqplot.DateAxisRenderer,
        }
    }
});​

我的日期范围从2011年10月23日开始。

然而，渲染的图表总是从2011年10月22日开始。

我知道另一种方法是使用min和max。

但我也希望刻度间隔是均匀的。以下是我尝试通过在图表中平均分布日期标签来实现的内容。

var chart = $('chart1');
chart.resetAxesScale();
var tickInterval = Math.ceil(chart._plotData[0].length / chart.axes.xaxis._numberTicks);
    var newTickInterval = tickInterval * 24 * 60 * 60 * 1000;
    chart.axes.xaxis.tickInterval = newTickInterval;
chart.replot();

这将基本上平衡 tickIntervals，x 轴不会混乱。

我甚至尝试设置图表的最小和最大值，并使用上述代码均匀地分隔日期，但是我没有成功。min 和 max 值在 "chart.resetAxesScale()" 后被重置。即使我在 resetAxesScale 方法中放置了使用现有 min、max 的选项，图形也不会遵守这些值。轴选项中的 'pad' 属性在 DateTimeAxisRenderer 中不起作用。

始终有一个从开始日期开始的刻度。如果有人能指出我的错误，那将非常有帮助。谢谢。

- Krunal

Answer 1

我试图使用“pad”，“padMin”和“PadMax”选项进行操作，但似乎“$.jqplot.DateAxisRenderer”插件不允许使用这些选项。

以下是使用pad但没有“$.jqplot.DateAxisRenderer”的一个fiddle: http://jsfiddle.net/33jEG/4/ 最好的方法是使用 min / max 选项，抱歉。

- sdespont

---

min 在使用 $.jqplot.DateAxisRenderer 时肯定有效。在我的情况下，我有多个系列，这就是我添加的内容，以消除左侧的空间 min: dataObj.array [0] [0] [0]。在 OP 的情况下，它将是 xaxis 中的 min: data [0] [0]。 - Pierre

Answer 2

我曾遇到类似的问题，需要在日期轴上进行填充，最后使用min max设置范围，并使用momentjs库解析日期来调整范围。希望这有所帮助。

var padding = 0.05;
var min = moment(data[0][0]);
var max = moment(data[data.length - 1][0]);
var pad = (max.valueOf() - min.valueOf()) * padding;
min = moment.unix((min.valueOf() - pad)/1000);
max = moment.unix((max.valueOf() + pad)/1000);

<...>

axes: {
  xaxis: {
    min: min.format("YYYY-MM-DD HH:mm:ss"),
    max: max.format("YYYY-MM-DD HH:mm:ss"),
    renderer: $.jqplot.DateAxisRenderer,
    rendererOptions: {
       tickRenderer: $.jqplot.CanvasAxisTickRenderer
    },
   }
}

- saganas