x axis labels alignment problem

Thread is closed for posting
6 posts, 0 answers
  1. Rahul Khinvasara
    Rahul Khinvasara avatar
    303 posts
    Member since:
    Aug 2007

    Posted 09 Apr 2008 Link to this post

    I would like to align the XAxis labels to the right (against the bottom of the graph). Here I have some labels which are shorter in length and some very lengthy labels. I am using MaxLength property of ChartAxis Item to limit the no of characters within the label. Still I would like to align the labels which are shorter than this MaxLength to the right (i.e against the bottom of the graph). When I mention
    RadChart1.Plotarea.XAxis.Appearance.Dimensions.Margins.Top= someval;
    the same margin is applied to all xaxis labels. I would like this margin to be different for different chart axis items. How to achieve this functionality?
  2. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 14 Apr 2008 Link to this post

    Hi Rahul Khinvasara,

    Unfortunately this customization is not possible at the moment -- we will forward your feedback to our developers so they can consider it for one of the future versions of the control.


    Greetings,
    Manuel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. vzzak
    vzzak avatar
    5 posts
    Member since:
    Dec 2006

    Posted 02 Jun 2008 Link to this post

    Hello,

    I have a similar issue.  I would like to change the Aligned Position of my labels on the chart to the bottom of the graph.  I don't know whether the length of the labels is an issue since I am using times as the default label text.  But no matter what I try I am unable to move the labels.  I have tried to change both the series and the series item properties for Aligned Position, and also for  position.x and position.y, and also for offset y and offset x.  Below are the functions I am using to set the series and series item properties.  I have also turned off Auto for the positions. 

    Here is the code behind in C#

    SetSeriesAppearance(s0);

    protected void SetSeriesAppearance(ChartSeries series)

    {

    series.YAxisType =

    ChartYAxisType.Primary;

    series.Appearance.TextAppearance.TextProperties.Font =

    new Font("Tahoma", 8);

    series.Appearance.TextAppearance.TextProperties.Color =

    Color.Black;

    series.Appearance.LabelAppearance.Position.Auto =

    false;

    series.Appearance.LabelAppearance.Position.AlignedPosition =

    AlignedPositions.Bottom;

    series.Appearance.TextAppearance.Position.AlignedPosition =

    AlignedPositions.Bottom;

    //series.Appearance.ShowLabelConnectors = true;

    //appear to do nothing

    series.Appearance.CenterXOffset = 100;

    series.Appearance.CenterYOffset = 100;

    }

    protected void SetSeriesItemProperties(ChartSeriesItem seriesitem, int intTypeCode)

    {

    //seriesitem.Appearance.Border.Color = Color.Black;

    //seriesitem.Label.Appearance.Border.Color = Color.Black;

    seriesitem.Label.Appearance.FillStyle.MainColor =

    Color.Transparent;

    seriesitem.Label.Appearance.Dimensions.Paddings.Top = 2;

    seriesitem.Label.Appearance.Dimensions.Paddings.Left = 0;

    //appear to do nothing to labels.

    //seriesitem.Label.Appearance.Dimensions.Margins.Top = 115;

    //seriesitem.Label.Appearance.Dimensions.Margins.Left = 55;

    seriesitem.Label.Appearance.Distance = 240;

    seriesitem.Label.Appearance.LabelConnectorStyle.Visible =

    true;

     

    //seriesitem.Appearance.TextAppearance.TextProperties.Font = new Font("Tahoma", 8);

    //seriesitem.Appearance.TextAppearance.TextProperties.Color = Color.Black;

    //seriesitem.Appearance.LabelAppearance.Dimensions.Margins = new ChartMargins(5);

    seriesitem.Label.Appearance.Distance = 0;

    //seriesitem.Label.Appearance.Position.Auto = true;

    //seriesitem.Appearance.FillStyle.FillSettings.ComplexGradient = true;

    seriesitem.Label.Appearance.LabelConnectorStyle.PenStyle = System.Drawing.Drawing2D.

    DashStyle.Dash;

    seriesitem.Label.Appearance.LabelConnectorStyle.Color = System.Drawing.

    Color.Blue;

    //Absolute positioning of Labels DZ

    seriesitem.Label.Appearance.Position.Auto =

    false;

    seriesitem.Label.Appearance.Position.X = 245;

    seriesitem.Label.Appearance.Position.Y = 45;

    seriesitem.Label.Appearance.Position.AlignedPosition =

    AlignedPositions.BottomRight;

    seriesitem.Label.Appearance.RotationAngle = 45;

    // seriesitem.Label.Appearance.LabelLocation = StyleSeriesItemLabel.ItemLabelLocation.Auto;


    }
    Please let me know what properties are needed to achieve this and if the labels can be positioned below the bottom of the bar graph.  I am using Y axis only at this point.
  5. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 03 Jun 2008 Link to this post

    Hi vzzak,

    You can change the alignment of the series item labels like this:

    ASPX
    <telerik:RadChart ID="RadChart1" runat="server" Width="700px" AutoLayout="True"
        <Series> 
            <telerik:ChartSeries Name="Series 1" Type="Bar"
                <Items> 
                    <telerik:ChartSeriesItem Name="Item 1" YValue="10"
                        <Label TextBlock-Text="Text 1"
                        </Label> 
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 2" YValue="15"
                        <Label TextBlock-Text="Text 2"
                        </Label> 
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 3" YValue="7"
                        <Label TextBlock-Text="Text 3"
                        </Label> 
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 4" YValue="11"
                        <Label TextBlock-Text="Text 4"
                        </Label> 
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 1" YValue="10"
                        <Label TextBlock-Text="Text 5"
                        </Label> 
                    </telerik:ChartSeriesItem> 
                </Items> 
            </telerik:ChartSeries> 
        </Series> 
        <PlotArea> 
            <XAxis AutoScale="False"
                <Items> 
                    <telerik:ChartAxisItem Value="1" TextBlock-Text="test"
                    </telerik:ChartAxisItem> 
                    <telerik:ChartAxisItem Value="2" TextBlock-Text="test"
                    </telerik:ChartAxisItem> 
                    <telerik:ChartAxisItem Value="3" TextBlock-Text="test"
                    </telerik:ChartAxisItem> 
                    <telerik:ChartAxisItem Value="4" TextBlock-Text="test"
                    </telerik:ChartAxisItem> 
                    <telerik:ChartAxisItem Value="5" TextBlock-Text="test"
                    </telerik:ChartAxisItem> 
                </Items> 
            </XAxis> 
        </PlotArea> 
    </telerik:RadChart> 


    Code-behind
    RadChart1.Series[0].Appearance.LabelAppearance.LabelLocation = Telerik.Charting.Styles.StyleSeriesItemLabel.ItemLabelLocation.Inside; 
    RadChart1.Series[0].Appearance.LabelAppearance.Position.AlignedPosition = Telerik.Charting.Styles.AlignedPositions.BottomRight; 


    However, it is not possible for the series item labels to be placed under the bars. You can use the axis item labels if you would like to achieve the original appearance.

    Hope this helps.


    Greetings,
    Manuel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  6. vzzak
    vzzak avatar
    5 posts
    Member since:
    Dec 2006

    Posted 03 Jun 2008 Link to this post

    If you have a numeric value for the series items, I would like to know if it is possible to set a text value for the Y Axis labels separate from the actual numeric value. 

    I see that there is a ChartAxisItem class. If I create ChartAxisItems as in the following..

    ChartAxisItem

    axisItem0 = new ChartAxisItem();


    Is this the correct approach, and if so do these have to be added to the Series the way the SeriesItems are?  I would like to add Axis item labels that are independent of the value but reflect the time string that I am adding from the data table. 

    Thanks Again,

    Damon
  7. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 05 Jun 2008 Link to this post

    Hi vzzak,

    If you would like to customize the axis item labels manually, you need to set the AutoScale property of the axis to "false" and customize its MinValue / MaxValue / Step properties like this:

    ASPX
    <telerik:RadChart ID="RadChart1" runat="server" AutoLayout="true"
        <Series> 
            <telerik:ChartSeries Name="Series 1"
                <Items> 
                    <telerik:ChartSeriesItem Name="Item 1" YValue="1"
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 2" YValue="3"
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 3" YValue="2"
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 4" YValue="6"
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 5" YValue="8"
                    </telerik:ChartSeriesItem> 
                    <telerik:ChartSeriesItem Name="Item 6" YValue="2"
                    </telerik:ChartSeriesItem> 
                </Items> 
            </telerik:ChartSeries> 
        </Series> 
    </telerik:RadChart> 

    Code-behind
    protected void Page_Load(object sender, EventArgs e) 
        RadChart1.PlotArea.YAxis.AutoScale = false
        RadChart1.PlotArea.YAxis.MinValue = 0
        RadChart1.PlotArea.YAxis.MaxValue = 10
        RadChart1.PlotArea.YAxis.Step = 2
     
        ChartAxisItem axisItem = new ChartAxisItem("custom1"); 
        axisItem.Value = 0
        RadChart1.PlotArea.YAxis.Items.Add(axisItem); 
     
        axisItem = new ChartAxisItem("custom2"); 
        axisItem.Value = 2
        RadChart1.PlotArea.YAxis.Items.Add(axisItem); 
     
        axisItem = new ChartAxisItem("custom3"); 
        axisItem.Value = 4
        RadChart1.PlotArea.YAxis.Items.Add(axisItem); 
     
        axisItem = new ChartAxisItem("custom4"); 
        axisItem.Value = 6
        RadChart1.PlotArea.YAxis.Items.Add(axisItem); 
     
        axisItem = new ChartAxisItem("custom5"); 
        axisItem.Value = 8
        RadChart1.PlotArea.YAxis.Items.Add(axisItem); 
     
        axisItem = new ChartAxisItem("custom6"); 
        axisItem.Value = 10
        RadChart1.PlotArea.YAxis.Items.Add(axisItem); 



    All the best,
    Manuel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017