Stacked Charts with Intelligent Labels?

2 posts, 1 answers
  1. Marcelino
    Marcelino avatar
    4 posts
    Member since:
    Jul 2012

    Posted 17 May 2013 Link to this post

    Hello,
    First I meant " Stacked Columns", instead of " Stacked Charts"  (Could not edit the title)

    This is a very similar case as in : Stacked Column series item label getting overlapping

    Problem:
    For one particular case when there are stacked columns with high amounts and some columns with very low amounts, causing the ratio to set smaller columns and overlapping the labels. (please check uploaded image)

    What I have tried:
    1) Set position on the Series.LabelAppearance, all the 4 options (Center, Inside Base, Inside end, Outside End) and of course they all keep overlapping.
    2) Set Minimum and Max Values for the Y axis, to get more room for columns to be larger.
    3) Smaller Font.

    I was looking for the intelligent labels but I didn't find any similar option on this HTML Chart
    http://demos.telerik.com/aspnetajax/chart/examples/newfeatures/intelligentlabels/defaultcs.aspx

    Is there any work around for this? or future release for this feature?

    I am currently using latest version 2013.1 417 (April 17)

    Thank you very much for your time
  2. Answer
    Danail Vasilev
    Admin
    Danail Vasilev avatar
    1490 posts

    Posted 21 May 2013 Link to this post

    Hi Marcelino,

    I have already answered your question in this forum thread, so I paste my replay in this forum thread as well:

    I am sorry to say that the intelligent labels functionality is not supported by the RadHtmlChart. What I can suggest you to do in your case is to use the TextStyle property of the labels and set an appropriate margin/padding to them.
    <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server">
        <PlotArea>
            <Series>
                <telerik:ColumnSeries Stacked="true">
                    <Items>
                        <telerik:SeriesItem YValue="11" />
                        <telerik:SeriesItem YValue="11" />
                        <telerik:SeriesItem YValue="11" />
                    </Items>
                    <LabelsAppearance>
                        <TextStyle Margin="5" />
                    </LabelsAppearance>
                </telerik:ColumnSeries>
                <telerik:ColumnSeries>
                    <Items>
                        <telerik:SeriesItem YValue="12" />
                        <telerik:SeriesItem YValue="12" />
                        <telerik:SeriesItem YValue="12" />
                    </Items>
                    <LabelsAppearance>
                        <TextStyle Margin="10" />
                    </LabelsAppearance>
                </telerik:ColumnSeries>
                <telerik:ColumnSeries>
                    <Items>
                        <telerik:SeriesItem YValue="13" />
                        <telerik:SeriesItem YValue="13" />
                        <telerik:SeriesItem YValue="13" />
                    </Items>
                    <LabelsAppearance>
                        <TextStyle Margin="17" />
                    </LabelsAppearance>
                </telerik:ColumnSeries>
            </Series>
            <YAxis MaxValue="1000">
            </YAxis>
        </PlotArea>
    </telerik:RadHtmlChart>



    Greetings,
    Danail Vasilev
    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
Back to Top