Отображение баров с флотом
Проблема с моими галочками Xaxis, только первый галочка отображается в правой части графика, и столбцы не отображаются. У меня такое чувство, что я упускаю что-то очевидное.
Желаемое решение: показать все отметки по оси X и построить соответствующие столбцы
Связанный код:
$.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/
1 ответ
Решение
Я думаю, что проблема может быть просто в том, что вы используете не числовые значения X в ваших данных. Я добавил этот код перед вызовом сюжета:
for (i = 0; i < results.length; i++) {
for (j = 0; j < results[i].data.length; j++) {
results[i].data[j][0] = j;
}
}
с этим отображается график, как и метки.
Возможно, вы захотите использовать немного более сложную логику для выбора правильного числового кода для каждого состояния, так как то, что я написал, не будет работать, если у вас отсутствуют или вышли из строя состояния в объекте "results".