How to avoid the axis label overlapping in JavaScript PivotChart?
This KB illustrates that how to avoid the axis label overlapping in JavaScript PivotChart.
Solution:
When the axis labels overlap with each other, based on the chart dimensions and label size, you can use the labelIntersectAction = "multiplerows" property of the axis to avoid such overlapping. The default value of the “labelIntersectAction” property is none
We can also apply the same property for PivotChart inside PivotClient by using the chartLoad event.
The following screen-shot shows the result, when the “labelIntersectAction” property is set to “multiplerows”.
The code sample below illustrates on how to set “labelIntersectAction” property in PivotChart.
$(function () { $("#PivotChart1").ejPivotChart({ url: "../wcf/OlapChartService.svc", load: "loadTheme", primaryXAxis: { labelIntersectAction: 'multiplerows' } }); });
The code sample below illustrates on how to set “labelIntersectAction” property in PivotChart inside PivotClient.
$(function () { $("#PivotClient1").ejPivotClient({ url: "../wcf/OlapClientService.svc", title: "OLAP Browser", chartLoad: "setChartProperties"}); }); function setChartProperties(args) { this.model.load = "loadTheme"; this.model.primaryXAxis.labelIntersectAction = "multiplerows"; }
Conclusion
I hope you enjoyed learning about how to rotate axis labels in JavaScript Chart.
You can refer to our JavaScript PivotChart feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications. You can also explore our JavaScript PivotChart example to understand how to create and manipulate data.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!