I have the code bellow to draw a chart. I want show in the X axis the month/year but, when I run the application, it shows me just the first month. How can I show anothers month ?
var data1 = [
[0, 4], [1, 8], [2, 5], [3, 10], [4, 4], [5, 16], [6, 5], [7, 11], [8, 6], [9, 11], [10, 30], [11, 10], [12, 13], [13, 4], [14, 3], [15, 3], [16, 6]
];
var data2 = [
[0, 1], [1, 0], [2, 2], [3, 0], [4, 1], [5, 3], [6, 1], [7, 5], [8, 2], [9, 3], [10, 2], [11, 1], [12, 0], [13, 2], [14, 8], [15, 0], [16, 0]
];
$("#flot-dashboard-chart").length && $.plot($("#flot-dashboard-chart"), [
data1, data2
],
{
series: {
lines: {
show: false,
fill: true
},
splines: {
show: true,
tension: 0.4,
lineWidth: 1,
fill: 0.4
},
points: {
radius: 0,
show: true
},
shadowSize: 2
},
grid: {
hoverable: true,
clickable: true,
tickColor: "#d5d5d5",
borderWidth: 1,
color: '#d5d5d5'
},
colors: ["#1ab394", "#464f88"],
xaxis: {
mode: "time",
minTickSize: [1, "day"],
timeformat: "%b/%y"
},
yaxis: {
ticks: 4
},
tooltip: true
}
);
Rendered Chart
If I remove all the options from xaxis
(i.e. xaxis: { },
), in the rendered chart some points appears on the X axis.
Rendered Chart without options on xaxis
Do either:
xaxis: {ticks: [[1, Jan], [2, Feb], [3, Mar]} etc..
or try adding
axisLabel: "Date",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'Verdana, Arial',
axisLabelPadding: 10
Read more here