Date as X-Axis on a bar chart

5 posts, 1 answers
  1. erwin
    erwin avatar
    358 posts
    Member since:
    Dec 2006

    Posted 13 Oct 2008 Link to this post

    Hi,

    I'd like to draw a bar chart, where the X Axis are Days and the Y Axis are values for that Day. X-Axis Step is 1 Day.

    The chart draws fine when I calculate a decimal age in days as X-Axis, however, I would like the actual dates to appear as labels on the X-Axis, rotated 90 degrees.

    What's the best way to do this?

    Thanks and regards
    erwin

  2. Answer
    Dwight
    Admin
    Dwight avatar
    475 posts

    Posted 16 Oct 2008 Link to this post

    Hello Erwin,

    Here is a sample code changing the the XAxis labels appearance and format:
    this.radChart1.PlotArea.XAxis.IsZeroBased = false
    this.radChart1.PlotArea.XAxis.Appearance.LabelAppearance.RotationAngle = 90; 
    this.radChart1.PlotArea.XAxis.Appearance.LabelAppearance.Position.AlignedPosition = Telerik.Charting.Styles.AlignedPositions.Top; 
    this.radChart1.PlotArea.XAxis.Appearance.ValueFormat = Telerik.Charting.Styles.ChartValueFormat.ShortDate; 

    If you have further questions do not hesitate to ask.

    Regards,
    Evtim
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for WinForms is Visual Studio 2017 Ready
  4. erwin
    erwin avatar
    358 posts
    Member since:
    Dec 2006

    Posted 20 Oct 2008 Link to this post

    Thanks, works like a charm!
    what I overlooked was ZeroBased property.

    regards
    erwin
  5. Ambu
    Ambu avatar
    18 posts
    Member since:
    Jan 2008

    Posted 26 Feb 2009 Link to this post

    I am trying to add dates to my x-axis as well, but only generic dates are being returned. These fixes do not work for me. Am I missing something?

    Here is my dataset:
    CountryName    LastUpdate                         Sites   Running Total
    United States    2009-02-02 00:00:00.000   4         4
    United States    2009-02-19 00:00:00.000   1         5

    More Details
    1. The date is returned as the datetime datatype.
    2. AutoScale and IsZeroBased values for the X-Axis are set to false
    3. My code is included below.

     
            <telerik:RadChart ID="RadChart1" runat="server" AutoLayout="True" DataGroupColumn="CountryName" 
                DataSourceID="SqlDataSource1" DefaultType="Line" Height="400px">  
                <Series> 
                    <telerik:ChartSeries DataYColumn="RunningTotal" Name="United States" Type="Line">  
                        <Appearance> 
                            <FillStyle MainColor="213, 247, 255">  
                            </FillStyle> 
                        </Appearance> 
                    </telerik:ChartSeries> 
                </Series> 
                <PlotArea> 
                    <XAxis AutoScale="False" DataLabelsColumn="LastUpdate" IsZeroBased="False" MaxValue="2" 
                        MinValue="1" Step="1">  
                        <Appearance ValueFormat="ShortDate">  
                            <LabelAppearance Position-AlignedPosition="Top" RotationAngle="45">  
                            </LabelAppearance> 
                        </Appearance> 
                        <AxisLabel Visible="True">  
                            <Appearance Visible="True">  
                            </Appearance> 
                            <TextBlock Text="Timeline">  
                            </TextBlock> 
                        </AxisLabel> 
                        <Items> 
                            <telerik:ChartAxisItem Value="1">  
                            </telerik:ChartAxisItem> 
                            <telerik:ChartAxisItem Value="2">  
                            </telerik:ChartAxisItem> 
                        </Items> 
                    </XAxis> 
                    <YAxis> 
                        <AxisLabel Visible="True">  
                            <Appearance Visible="True">  
                            </Appearance> 
                            <TextBlock Text="Number of Sites">  
                            </TextBlock> 
                        </AxisLabel> 
                    </YAxis> 
                </PlotArea> 
                <ChartTitle> 
                    <TextBlock Text="Site Completion Summary">  
                    </TextBlock> 
                </ChartTitle> 
            </telerik:RadChart> 
    Select a.CountryName, Convert(datetime, a.LastUpdate, 101) as LastUpdate,  
           a.Sites,  
           SUM(b.Sites) AS RunningTotal  
    From   
    (  
        Select DATEADD(dd, 0, DATEDIFF(dd, 0, atss.LastUpdate)) as LastUpdate, c.CountryName,  
               Max(DATEADD(dd, 0, DATEDIFF(dd, 0, atss.LastUpdate))) as LastUpdateMax,  
               Count(ts.TrackedSiteID) as Sites  
        From SLLS_TrackedSite ts  
        Left Outer Join SLLS_AuditTrackSiteStatus atss On atss.TrackedSiteID = ts.TrackedSiteID  
        Left Outer Join SLLS_Country c On c.CountryID = ts.CountryID  
        Where ts.SiteStatusID = 1 And 
              atss.SiteStatusID = 1 And 
              ts.CountryID = 1  
        Group By DATEADD(dd, 0, DATEDIFF(dd, 0, atss.LastUpdate)), c.CountryName  
    ) a  
    Cross Join 
    (  
        Select DATEADD(dd, 0, DATEDIFF(dd, 0, atss.LastUpdate)) as LastUpdate, c.CountryName,  
               Max(DATEADD(dd, 0, DATEDIFF(dd, 0, atss.LastUpdate))) as LastUpdateMax,  
               Count(ts.TrackedSiteID) as Sites  
        From SLLS_TrackedSite ts  
        Left Outer Join SLLS_AuditTrackSiteStatus atss On atss.TrackedSiteID = ts.TrackedSiteID  
        Left Outer Join SLLS_Country c On c.CountryID = ts.CountryID  
        Where ts.SiteStatusID = 1 And 
              atss.SiteStatusID = 1 And 
              ts.CountryID = 1  
        Group By DATEADD(dd, 0, DATEDIFF(dd, 0, atss.LastUpdate)), c.CountryName  
    ) b  
    WHERE (b.LastUpdate <= a.LastUpdate)  
    GROUP BY a.CountryName,a.LastUpdate,a.Sites  
    ORDER BY a.CountryName,a.LastUpdate,a.Sites 

  6. Dwight
    Admin
    Dwight avatar
    475 posts

    Posted 27 Feb 2009 Link to this post

    Hello Allan,

    Please, find the answer to your question in the other thread:
    http://www.telerik.com/community/forums/winforms/chart/date-on-x-axis-on-line-chart.aspx

    Also, note, that the ASP.NET chart has separate resources and support area:
    http://www.telerik.com/products/aspnet-ajax/chart.aspx

    Best wishes,
    Evtim
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
Back to Top
UI for WinForms is Visual Studio 2017 Ready