I want the dates to be displayed in Persian on the Highcharts chart. I know you can use jalali-moment to convert the date to normal. Is there a way to do this in the Highcharts? I use Angular 12 and Highcharts 9.
Highcharts.chart('lineChart', {
chart: {
scrollablePlotArea: {}
},
xAxis: {
type: 'datetime',
gridLineWidth: 1,
labels: {
align: 'left',
x: 3,
y: -3
}
},
yAxis: [{
title: {
text: null
},
showFirstLabel: false
}],
series: [{
type: 'line',
data: [
[
1633209533000,
3
],
[
1635796087000,
3
],
[
1635882487000,
6
],
[
1636055287000,
4
],
[
1638466033000,
8
],
[
1638479933000,
6
]
]
}]
});
CodePudding user response:
You can use Highcharts dateFormats and jalali-moment.
Use this link to install jalali-moment
in Highcharts options use Highcharts.dateFormats
> chartDateFormat() {
Highcharts.dateFormats.a = (ts) => {
return moment(ts).locale('fa').format('dddd');
};
Highcharts.dateFormats.A = (ts) => {
return moment(ts).locale('fa').format('dddd');
};
Highcharts.dateFormats.d = (ts) => {
return moment(ts).locale('fa').format('DD');
};
Highcharts.dateFormats.e = (ts) => {
return moment(ts).locale('fa').format('D');
};
Highcharts.dateFormats.b = (ts) => {
return moment(ts).locale('fa').format('MMMM');
};
Highcharts.dateFormats.B = (ts) => {
return moment(ts).locale('fa').format('MMMM');
};
Highcharts.dateFormats.m = (ts) => {
return moment(ts).locale('fa').format('MM');
};
Highcharts.dateFormats.y = (ts) => {
return moment(ts).locale('fa').format('YY');
};
Highcharts.dateFormats.Y = (ts) => {
return moment(ts).locale('fa').format('YYYY');
};
Highcharts.dateFormats.W = (ts) => {
return moment(ts).locale('fa').format('ww');
};
}