Reputation: 6695
Issue with my xaxis ticks, only the first tick shows at the far right of the graph, and no bars are plotted. I have a feeling i'm missing something obvious.
Desired solution: Show all the xaxis ticks and plot the bars accordingly
Associated code:
$.plot($("#chart"), results, {
grid: {
hoverable: true,
aboveData: true
},
xaxis: {
ticks: [
[1, "AL"],
[2, "AZ"],
[3, "CA"],
[4, "CO"],
[5, "CT"],
[6, "DE"],
[7, "FL"],
[8, "GA"],
[9, "HI"],
[10, "IA"],
[11, "IL"],
[12, "IN"],
[13, "KS"],
[14, "KY"],
[15, "LA"],
[16, "MA"],
[17, "MD"],
[18, "ME"],
[19, "MI"],
[20, "MN"],
[21, "MO"],
[22, "MS"],
[23, "NC"],
[24, "NE"],
[25, "NJ"],
[26, "NM"],
[27, "NY"],
[28, "OH"],
[29, "OK"],
[30, "OR"],
[31, "PA"],
[32, "RI"],
[33, "SC"],
[34, "TN"],
[35, "TX"],
[36, "UT"],
[37, "VA"],
[38, "WA"],
[39, "WV"]
],
tickSize: 1,
tickLength: 1
},
grid: {
hoverable: true,
clickable: false,
borderWidth: 1
},
legend: {
labelBoxBorderColor: "none",
position: "ne",
margin: [-100, 0]
},
series: {
bars: {
show: true,
align: "center",
horizontal: "true"
}
}
});
JSFiddle: http://jsfiddle.net/emaM7/
Upvotes: 0
Views: 74
Reputation: 6695
I think the problem may be simply that you're using non-numeric X values in your data. I added this code before the plot call:
for (i = 0; i < results.length; i++) {
for (j = 0; j < results[i].data.length; j++) {
results[i].data[j][0] = j;
}
}
with this a graph shows up as do the labels.
You'll probably want to use slightly more complex logic to select the proper numeric code for each state, as what I wrote won't work if you have states missing or out of order in the 'results' object.
Upvotes: 2