jqplot：分隔刻度和系列值

I have a web service that sends date values (for x-axis) in one array. It sends y-axis values in another array.

我有一个Web服务,它在一个数组中发送日期值(对于x轴)。它在另一个数组中发送y轴值。

Is it possible to have jqPlot create a chart with 2 such arrays. Documentation seems to indicate this is possible.

是否有可能让jqPlot创建一个包含2个此类数组的图表。文档似乎表明这是可能的。

I know combining the date and series value in one array works. Would like to avoid the extra processing of combining the 2 arrays.

我知道在一个数组中合并日期和系列值。想避免组合2个阵列的额外处理。

This jsFiddle http://jsfiddle.net/abhivm/HmnmH/1/ shows sample code. Can anyone please look and let me know how to do this?

这个jsFiddle http://jsfiddle.net/abhivm/HmnmH/1/显示了示例代码。任何人都可以看看,让我知道如何做到这一点?

jsFiddle is returning errors this morning, so posting the jQuery code below.

jsFiddle今天早上返回错误,所以发布下面的jQuery代码。

$(document).ready(function() {
    var dateValues = ["01/15/2012", "01/17/2012", "01/18/2012", "01/19/2012"];
    var dailyValues = [219, 73, 73, 146];

    plot2 = $.jqplot('chart', [dailyValues], {

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

Thanks Abhi

2 个解决方案

#1

I can not figure out a way for jqPlot to accept how you want to define your inputs (the ticks option seems to only work with numbers). I'm curious as to the "avoid the extra processing" comment. With jQuery it would be as easy as:

我无法想办法让jqPlot接受你想要如何定义你的输入(ticks选项似乎只适用于数字)。我很好奇“避免额外处理”的评论。使用jQuery可以很简单:

$.map(dateValues, 
       function(val,idx){
           return [[val,dailyValues[idx]]];
       }
);

to "merge" the two arrays into point pairs.

将两个数组“合并”成点对。

#2

The 'multiple ticks for the same date' for the date-axis can be solved by including the following code snippet:

可以通过包含以下代码段来解决日期轴的“同一日期的多个刻度”:

  xaxis: {
           label: "Whatever you name it",
           renderer: $.jqplot.DateAxisRenderer,
           min:dateVal[0],
           max:dateVal[dateVal.length-1],
           tickInterval: '1 day',

Please include min,max and tickInterval under xaxis: and not under tickOptions: .

请在xaxis下包含min,max和tickInterval:而不是在tickOptions下:。

In my case I am having the date values in the array dateVal where the 0th element is the minimum value of date for the x-axis and the last element is the max date value. If you so wish you could hard-code the date values.

在我的例子中,我在数组dateVal中有日期值,其中第0个元素是x轴的最小日期值,最后一个元素是最大日期值。如果您希望可以硬编码日期值。

I hope this will be of help.

我希望这会有所帮助。

#1