About the chart
3 Replies
Hi Pylori,
We can use axisLabelRender event in the chart to achieve your requirement. We have also prepared a sample for your reference in which we have modified the day of the week in Japanese language and also we have modified color of the label of the weekends to red as requested. This can also be customized based on your requirement. Please find the sample, code snippet, and screenshot below
Code Snippet:
|
// add your additional code here
@Html.EJS().Chart("container").AxisLabelRender("axislabelRender").ChartArea(area => area.Border(br => br.Color("transparent")))
// add your additional code here
<script>
var axislabelRender = function (args) {
if (args.axis.name == "primaryXAxis") {
if (args.text.indexOf('Mon') > -1) {
args.text = args.text.replace("Mon", "月曜");
} else if (args.text.indexOf('Tue') > -1) {
args.text = args.text.replace("Tue", "火曜日");
} else if (args.text.indexOf('Wed') > -1) {
args.text = args.text.replace("Wed", "水曜日");
} else if (args.text.indexOf('Thu') > -1) {
args.text = args.text.replace("Thu", "木曜日");
} else if (args.text.indexOf('Fri') > -1) {
args.text = args.text.replace("Fri", "金曜日");
} else if (args.text.indexOf('Sat') > -1) {
args.text = args.text.replace("Sat", "土曜日");
args.labelStyle.color = "red";
} else if (args.text.indexOf('Sun') > -1) {
args.text = args.text.replace("Sun", "日曜日");
args.labelStyle.color = "red";
}
}
}
</script>
// add your additional code here
|
Screenshot:
Let us know if you have any concerns.
Regards,
Srihari M
SIGN IN To post a reply.
