This is a migrated thread and some comments may be shown as answers.

Change x-axis labels programmatically

4 Answers 434 Views
Chart (Obsolete)
This is a migrated thread and some comments may be shown as answers.
Aaron Abdis
Top achievements
Rank 1
Aaron Abdis asked on 18 Oct 2011, 05:45 PM
Please check this chart for reference: http://dl.dropbox.com/u/19767586/radchart-xaxis-labels-tochange.png

Note how the x-axis labels, which also serve as the column headers for the datatable, go 1, 2, 3, ... 10.

I need to change these so they show month names. That is, Jan, Feb, Mar, ... Oct.
(the data fluctuates, showing all months 1 - current). I am generating/adding the dataseries to the graph in code.
There are about a dozen different ChartSeries.
cs = New TC.ChartSeries(mr("NAME"), Telerik.Charting.ChartSeriesType.Line)
For Each lr As DataRow In ls.Rows
    i = New TC.ChartSeriesItem(CDbl(lr("LOANS")), MonthName(lr("MONTH")))
    i.Name = MonthName(lr("MONTH")) '// TRIED WITH AND WITHOUT THIS LINE
    i.Label.Visible = False
 
    cs.AddItem(i)
Next
chartMilestoneLoans.AddChartSeries(cs)

I found this question, and based on the answer there, tried this
chartMilestoneLoans.PlotArea.XAxis.Clear()
chartMilestoneLoans.PlotArea.XAxis.AddRange(1, Now.Month, 1)
For lc As Integer = 0 To (Now.Month - 1)
    chartMilestoneLoans.PlotArea.XAxis(lc).TextBlock.Text = MonthName(lc + 1)
Next

This doesn't throw any errors, ... but it also doesn't change the labels as expected.
How can i replace the numbers with the month names?

4 Answers, 1 is accepted

Sort by
0
Evgenia
Telerik team
answered on 21 Oct 2011, 02:56 PM
Hello Aaron,

The purpose of the Name property of the ChartSeriesItem is to be used as Legend Name in cases where you'd like to see each Items Names in the Legend rather than Series Names. You can find more about thishere. To achieve your scenario I'll suggest you this approach:
You may set your XValues to be DateTimes but formatted so that you see only the Month name. For the purpose have in mind that XValue requires its values to be of float type. That's why DateTime values should be converted to their OLE Automation equivalents using ToOADate(). RadChart.XAxis.Appearance.ValueFormat property provides means to format X axis labels. In this case it is set to ShortDate and the CustomFormat to "MMM".
You can set custom axis range after setting AutoScale property of the axis to false. With the step of 30 days you'll be able to see months per Axis Item Label.

The attached project demonstrates the above described approach. Feel free to use/customize it so that it meets your requirements.

I hope it helps.

Best wishes,
Evgenia
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Aaron Abdis
Top achievements
Rank 1
answered on 21 Oct 2011, 07:46 PM
Okay... thanks for the sample project. I got the month names showing below now.
One problem though... the datatable is no longer showing anything beyond Jan and Feb!

All the data is clearly still there as the actual chart itself is still correct...
it just is not showing up below in the datatable for some reason!  :-O 

Here is how it looks now, with the missing data:
http://dl.dropbox.com/u/19767586/radchart-data-table-missing-data.png

Here is the chart markup:
<telerik:radchart id="chartMilestoneLoans" runat="server" defaulttype="Line" height="500px" width="800px">
    <charttitle>
        <appearance position-alignedposition="Top">
        </appearance>
        <textblock text="Pipeline Summary"></textblock></charttitle>
    <appearance>
        <border color="#9CAAC1" visible="True" />
    </appearance>
    <legend visible="False">
    </legend>
    <plotarea>
        <datatable visible="True">
        </datatable>
        <emptyseriesmessage visible="True">
            <appearance visible="True">
            </appearance>
        </emptyseriesmessage>
        <yaxis>
            <appearance>
                <labelappearance rotationangle="-90">
                </labelappearance>
            </appearance>
            <axislabel visible="True">
                <appearance visible="True">
                </appearance>
                <textblock text="Loans">
                </textblock>
            </axislabel>
        </yaxis>
        <appearance dimensions-margins="18%, 10px, 195px, 150px">
        </appearance>
    </plotarea>
</telerik:radchart>

And here is my current code binding the chart:
Private Sub BindChart()
    chartMilestoneLoans.Skin = Telerik.SkinCharts
    chartMilestoneLoans.ChartTitle.TextBlock.Text = User.Broker & " Pipeline Summary for " & Now.Year
 
    chartMilestoneLoans.Clear()
 
    Dim ms = dbo.ExecuteDT(<s>SELECT NAME, DATEFIELD FROM portal.MILESTONES WHERE DATEFIELD IS NOT NULL ORDER BY NAME</s>)
    Dim df, SQL As String, ls As DataTable, cs As TC.ChartSeries, i As TC.ChartSeriesItem
 
    chartMilestoneLoans.AutoLayout = True
 
    chartMilestoneLoans.PlotArea.XAxis.Appearance.ValueFormat = Telerik.Charting.Styles.ChartValueFormat.ShortDate
    chartMilestoneLoans.PlotArea.XAxis.LayoutMode = Telerik.Charting.Styles.ChartAxisLayoutMode.Inside
    chartMilestoneLoans.PlotArea.XAxis.Appearance.CustomFormat = "MMM"
    chartMilestoneLoans.PlotArea.XAxis.AutoScale = False
    chartMilestoneLoans.PlotArea.XAxis.AddRange(DateTime.Parse(Now.Year & "-01-01").ToOADate(), DateTime.Parse(Now.Year & "-" & Now.Month + 1 & "-01").ToOADate(), 31)
 
    For Each mr As DataRow In ms.Rows
        df = mr("DATEFIELD")
        SQL = <s>SELECT VAL MONTH, ISNULL(COUNT(L.Loan_Number),0) LOANS
                    FROM system.NUMBERS N
                    LEFT JOIN encompass.LOANS L ON DATEPART(MONTH, L.<%= df %>) = N.VAL AND DATEPART(YEAR, L.<%= df %>) = DATEPART(YEAR, getdate())
                        AND L.SystemId = <%= SystemId %> AND L.Broker_Id = <%= User.BrokerId %>
                    WHERE N.VAL BETWEEN 1 AND DATEPART(MONTH, getdate())                          
                    GROUP BY N.VAL</s>
        ls = dbo.ExecuteDT(SQL)
 
        cs = New TC.ChartSeries(mr("NAME"), Telerik.Charting.ChartSeriesType.Line)
        For Each lr As DataRow In ls.Rows
            i = New TC.ChartSeriesItem(CDate(lr("MONTH") & "/01/" & Now.Year).ToOADate, CDbl(lr("LOANS")))
            i.Label.Visible = False
 
            cs.AddItem(i)
        Next
 
        chartMilestoneLoans.AddChartSeries(cs)
    Next
End Sub
0
Accepted
Evgenia
Telerik team
answered on 26 Oct 2011, 02:56 PM
Hi Aaron,

The way DataTable shows its data is connected with the strict mode of the chart. Since you have provided your own XValues the strict mode is disabled and the DataTable gets "confused" - you see missing data.
Here is a woraround. You can remove/comment the XValue binding so that your XValues are the default consequtive numbers 1,2,3 ... etc. Then you can use this approach for manually setting Axis Labels.

Greetings,
Evgenia
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Aaron Abdis
Top achievements
Rank 1
answered on 26 Oct 2011, 06:25 PM
Thanks! Here is my final code for setting the x-axis labels. Works PERFECT!

chartMilestoneLoans.PlotArea.XAxis.AutoScale = False
chartMilestoneLoans.PlotArea.XAxis.AddRange(1, Now.Month, 1)
For lc As Integer = 1 To Now.Month
    chartMilestoneLoans.PlotArea.XAxis(lc - 1).TextBlock.Text = MonthName(lc)
Next
Tags
Chart (Obsolete)
Asked by
Aaron Abdis
Top achievements
Rank 1
Answers by
Evgenia
Telerik team
Aaron Abdis
Top achievements
Rank 1
Share this question
or