Category / Section
How to avoid overlapping of the Pivot Chart lables?
1 min read
This KB illustrates that how to avoid overlapping of the Pivot Chart lables.
Solution:
In order to avoid overlapping of the Chart labels, set the LabelIntersectAction as MultipleRows for the respective axis. In the following example, multiple rows’ display of Chart labels have been enabled in the X-axis since the Chart is of Column type.
JS
$(function () {
$("#PivotChart1").ejPivotChart({ url: "../wcf/OlapChartService.svc", primaryXAxis: { labelIntersectAction:"MultipleRows" },
});
});
ASP.NET
<ej:PivotChart ID="PivotChart1" runat="server" Url="../wcf/OlapChartService.svc"> <primaryxaxis LabelIntersectAction="MultipleRows" /> </ej:PivotChart>
MVC
@Html.EJ().Pivot().PivotChart("PivotChart1").Url(Url.Content("~/wcf/OlapChartService.svc")).PrimaryXAxis(primaryXAxis => primaryXAxis.LabelIntersectAction(LabelIntersectAction.MultipleRows))
Figure 1: Chart label without overlap
