Cannot get the x-axis lables to line up properly

Thread is closed for posting
4 posts, 0 answers
  1. Andy
    Andy avatar
    25 posts
    Member since:
    Aug 2011

    Posted 04 Oct 2011 Link to this post

    Charts are bound to a class.  2 doubles and 1 date.  The doubles are the y-axis series and the date is the x-axis

    See the attached file for how it looks. LayoutMode is set to inside which moves the points but not the label.

    Here is the code for the 1st chart:

    <div class="chartleft">
         
       <telerik:RadChart ID="RadChart1" runat="server" DefaultType="Line" ChartTitle-TextBlock-Text="Last 10 Updates" Width="525">
          <PlotArea>
             <Appearance Dimensions-Margins="18%, 30%, 25%, 10%">
             </Appearance>
             <EmptySeriesMessage Visible="True">
                <Appearance Visible="True">
                </Appearance>
             </EmptySeriesMessage>
              <YAxis IsZeroBased="false">
              </YAxis>
              <XAxis LayoutMode="Inside" AutoScale="false" LabelStep="1" DataLabelsColumn="date" >
                  <Appearance ValueFormat="ShortDate" MajorGridLines-Visible="false" >
                      <LabelAppearance RotationAngle="45" Position-AlignedPosition="Top">
                      </LabelAppearance>
                  </Appearance>
              </XAxis>
          </PlotArea>
            
          <Series>
              <telerik:ChartSeries DataYColumn="realvalues" Name="Real Values" Type="Line">
              </telerik:ChartSeries>
              <telerik:ChartSeries DataYColumn="othervalues" Name="Trending Values" Type="Line">
              </telerik:ChartSeries>
          </Series>
            
       </telerik:RadChart>
    </div>

    here is the class it is bound to:

    public class chartdata
       {
       public double realvalues { get; set; }
       public double othervalues { get; set; }
       public double date { get; set; }
       public chartdata(double r, double o, DateTime dt)
          {
          date = dt.ToOADate();
          realvalues = r;
          othervalues = o;
          }
       }


     

     

     

     



  2. Evgenia
    Admin
    Evgenia avatar
    1407 posts

    Posted 05 Oct 2011 Link to this post

    Hello Andy,

    Since you have rotated the Axis Labels - they look as they are not affected by the LayoutMode property. The Rotation mechanism uses the middle of the Label's Length as starting point. If you set the Rotation angle to 90 for example you should be able to see that the LayoutMode is visibly set.

    Regards,
    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Andy
    Andy avatar
    25 posts
    Member since:
    Aug 2011

    Posted 05 Oct 2011 Link to this post

    You are correct... the 90 degree rotation made them line up.

    The 45 rotation looks so much better... any options to be able to shift them over another way?

    Andy
  5. Evgenia
    Admin
    Evgenia avatar
    1407 posts

    Posted 10 Oct 2011 Link to this post

    Hello Andy,

    You may keep the RotationAngle to 45 degrees as you wished and set the Left Margin of the AxisX Items to 0 which will cause the labels to shift left. Here is how you can access the Margins - PlotArea-> XAxis -> Appearance -> LabelAppearance -> Dimensions-Margins.

    Kind regards,
    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
Back to Top