jqplot: Separating ticks and series values

Question

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

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

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

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

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

$(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

Answer 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:

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

to "merge" the two arrays into point pairs.

Answer 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: .

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.

I hope this will be of help.