Colleen Colleen - 1 month ago 10
jQuery Question

flot bar chart ticks not displaying

my data:

var data5 = [
{ label: "my cat", data: [[1,10], [4,20], [7,30]], color: 'rgb(85, 96, 42)'},
{ label: "my job", data: [[2,30], [5,20], [8,30]], color: '#42215F'}
];


my options:

var type = {};
type[charttype] = {show: true};
type["xaxis"] = {ticks: [[1,"foo"], [2,"bar"], [4,"cat"], [5,"woo"], [7,"cookie"], [8,"yay"]]};

var chart_options = {};
chart_options["series"] = type;


however, when I

var plot = $.plot($(div), data5, chart_options);


The ticks just show up as 1-9, instead of with the strings I've given.
What am I doing wrong?

Answer

Try this:

var data5 = [
    { label: "my cat",  data: [[1,10], [4,20], [7,30]], color: 'rgb(85, 96, 42)'},
    { label: "my job",  data: [[2,30], [5,20], [8,30]], color: '#42215F'}
];

var chart_options = {
    series: {lines:{show: true}},
    xaxis:{ticks: [[1,"foo"], [2,"bar"],  [4,"cat"], [5,"woo"],  [7,"cookie"], [8,"yay"] ]}
};

var plot = $.plot($('div'), data5, chart_options);

Demo

charttype is replaced with an actual type (lines/points..)

xaxis should not be inside of series object, instead on the same level.