I want to show my x labels as "2014 Jan", for example, instead of "2014-01".
The json of my data looks like this:
[
{
"product1": 2,
"product2": 0,
"period": "2013-05"
},
...
OP found the solution using xLabelFormat
and dateFormat
:
Morris.Line({
element: 'morris-line-chart',
data: <?php echo $morris_line_json; ?>,
xkey: 'period',
ykeys: ['product1', 'product2'],
labels: ['Product 1', 'Product 2'],
hideHover: 'auto',
xLabelAngle: 70,
xLabelFormat: function (x) {
var IndexToMonth = [ "Jan", "Feb", "Mär", "Apr", "Mai", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dez" ];
var month = IndexToMonth[ x.getMonth() ];
var year = x.getFullYear();
return year + ' ' + month;
},
dateFormat: function (x) {
var IndexToMonth = [ "Jan", "Feb", "Mär", "Apr", "Mai", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dez" ];
var month = IndexToMonth[ new Date(x).getMonth() ];
var year = new Date(x).getFullYear();
return year + ' ' + month;
},
resize: true
});