Stacked Column series item label getting overlapping

[Kannan]

Hi,

I am using StackedBar series in RadHtml Chart.
In the chart xaxis having both positive and negative values data. When it is having negative and postive data it is getting overlapping the item labels.
Can you please let me know how to make them display in different locations?

Regards
Kannan S

[Danail Vasilev]

Hi Kannan,

I assume you are dealing with scenario similar to this and trying to make it look like that.
In that case a possible way to evade the overlapping of the negative Items labels with the XAxis labels could be to simply set items' labels position outside the items themselves:

<LabelsAppearance DataFormatString="${0}" Position="OutsideEnd" />

Please refer to this Server-side API article where you can find the full list of the styling properties that RadHtmlChart provides. I am attaching my VS sample in RadHtmlChart_BarSeries_Stacked.zip archive as well.

Kind regards,
Danail Vasilev
the Telerik team

[Marcelino]

Hello,

I was not sure if I should create a new thread but I have similar issue.

Problem:
For one particular case when there are stacked high amounts and some very low amounts, causing the ratio to set small 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
3) Smaller Font.

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

Is there any work around for this?

Thank you very much for your time

[Danail Vasilev]

Hello Marcelino,

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.

For example:

<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>

I hope that helps.

All the best,
Danail Vasilev
the Telerik team

[Marcelino]

Thank you very much for your suggestion it helped.

Any plans to get the intelligent labels on the html chart?

[Danail Vasilev]

Hi Marcelino,

Intelligent labels functionality is not in the scope of our short term plans. However, I have logged this idea in our feedback portal here, so that you can monitor and comment on it. For the time being you can raise the priority of this item by voting on it.

As a small token of gratitude for sharing your ideas with us I have updated your Telerik points.

You can also find interesting the release notes of the HtmlChart in Q2 2013 Beta.

Regards,
Danail Vasilev
Telerik

[Siva]

Hi,

Am working with telerik:RadHtmlchart with scattered line series

In that i have created two series with same x and y axis

its working fine until the two series have same values

if purchase series x=5 y=10, sales series x=10 y=20 then its working fine

if purchase series x=5 y=10, sales series x=5 y=10 then its overlapping one on other, there is no differentiation between two series

its displaying 1 tooltip only for sales series

 

after that

i want to display integers only but when am using dataformat it will show like 0 0 0  1  1 1

but i don't want to display like this because it's look like duplicating the values

is there any way to show those series seperately or need to display two tooltips?

and for avoiding decimals and duplicating axis values any way to solve this issue?

how i need to do that, am trying to fix this issue for the past two day still i can't find the solution

 

Thanks,

Regards,

SIVASHANKARI