Set vertical text on x axis in syncfusion column chart

Question

NET MVC 4.0 with Syncfusion controls to implement graph.

I have successfully implemented it and running fine but when there are more data in x axis the text overlap each other so I want to show it vertically so it will show it properly.

Code:

@(Html.EJ().Chart("idofthegraph")
        .PrimaryXAxis(pr => pr.Title(tl => tl.Text("Technician")).LabelIntersectAction(LabelIntersectAction.Rotate90))
        .PrimaryYAxis(pr => pr.Title(tl => tl.Text("Sum (Price)")))
        .CommonSeriesOptions(cr => cr.Type(SeriesType.Column).EnableAnimation(true))
        .Title(t => t.Text("Jobs by Engineer - Value (Job this Month)"))
        .Series(sr =>
        {
            sr.DataSource(Model)
            .Type(SeriesType.Column)
            .XName("Name").YName("Value")
            .Name("Jobs this month")
            .Add();
        })
        .Size(sz => sz.Height("600"))
        .CanResize(true)
        .Zooming(zn => zn.Enable(true).EnableMouseWheel(true).EnableScrollbar(true))
        .Enable3D(true)
                )

Result:

As you can see the x axis where text overlap each other and also is there any method available to show the x axis data on the top of the inside bar?

I have tried the method called .LabelIntersectAction(LabelIntersectAction.Rotate90) in PrimaryXAxis but having the issue.

I have tried this example to do but I couldn't find any method like LabelIntersectAction except inside the method PrimaryXAxis.

Is there any formula or method available to show it vertical?

There is label intersect action while keeping it to rotate90 it makes it vertical — rahul, Jan 30 '17 at 10:47
@rahul hello I appreciate your response but please read I have already mentioned that I have tried but not found any option regarding intersect and where I found I tried but not applied successfully. — 3 rules, Jan 30 '17 at 10:51
It is predefined function I can not manually call or changer the name my own name to the system function. — 3 rules, Jan 30 '17 at 10:53
Can you give me some example if possible so I can understand properly. — 3 rules, Jan 30 '17 at 10:54

score 2 · Accepted Answer · answered Feb 01 '17 at 09:27

2

Try to remove .Enable3D(true) from the code and see if it is working or not.

I am teling to remove because I think LabelIntersectAction is not supported in Columnchart with 3D.

answered Feb 01 '17 at 09:27

Mahavirsinh Padhiyar

1,299
11
33

Yes it is working now, there is not need to show it in 3D as of now so I can remove it. Thanks 0MV1 you always helpful to me. Really appreciate. – 3 rules Feb 01 '17 at 09:30
You are welcome I also wonder why it is not working in 3D but they will add this feature in coming version I think so. ;) – Mahavirsinh Padhiyar Feb 01 '17 at 09:32
Let's hope they will add. – 3 rules Feb 01 '17 at 09:33

score 1 · Answer 2 · answered Feb 03 '17 at 06:27

We have provided label intersection action support for 2D chart only. So as of now we can’t able to handle the axis labels intersection of 3D chart. And we have already added this requirement in our features request list and this will be available in any of our upcoming Essential Studio release.

Thanks, Dharani

Set vertical text on x axis in syncfusion column chart

2 Answers2