This is a migrated thread and some comments may be shown as answers.

Series Item Name in Label Appearance

3 Answers 267 Views
Chart (HTML5)
This is a migrated thread and some comments may be shown as answers.
Brian Mains
Top achievements
Rank 1
Brian Mains asked on 04 Oct 2012, 05:59 PM
Hello,

I would love to put the name of the series item in the label or tooltip for that item, so that it clearly identifies the item referred to.  Is that possible?

Thaks.

3 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 05 Oct 2012, 05:23 AM
Hi Brian Mains,

One suggestion is that you can loop through the Series and can set the DataFormatString for the label and the tooltip. Following is the sample code that I tried.

ASPX:
<telerik:RadHtmlChart runat="server" ID="BarChart" Width="800" Height="500" Transitions="true">
   <Appearance>
        <FillStyle BackgroundColor="White" />
   </Appearance>
   <ChartTitle Text="Revenue">
        <Appearance Align="Center" BackgroundColor="White" Position="Top" />
   </ChartTitle>
   <Legend>
        <Appearance BackgroundColor="White" Position="Bottom" />
   </Legend>
   <PlotArea>
        <Appearance>
            <FillStyle BackgroundColor="White" />
        </Appearance>
        <XAxis AxisCrossingValue="0" Color="#b3b3b3" MajorTickType="Outside" MinorTickType="Outside" Reversed="false">
            <Items>
                <telerik:AxisItem LabelText="2003" />
                <telerik:AxisItem LabelText="2004" />
                <telerik:AxisItem LabelText="2005" />
            </Items>
            <LabelsAppearance DataFormatString="Year {0}" RotationAngle="0" />
            <MajorGridLines Color="#EFEFEF" Width="1" />
            <MinorGridLines Color="Black" Width="1" />
            <TitleAppearance Position="Center" RotationAngle="0" Text="Years" />
        </XAxis>
        <YAxis AxisCrossingValue="0" Color="#b3b3b3" MajorTickSize="1" MajorTickType="Outside" MaxValue="1000000" MinorTickSize="1" MinorTickType="Outside" MinValue="0" Reversed="false" Step="100000">
            <LabelsAppearance DataFormatString="${0}" RotationAngle="0" />
            <MajorGridLines Color="#EFEFEF" Width="1" />
            <MinorGridLines Color="#F7F7F7" Width="1" />
            <TitleAppearance Position="Center" RotationAngle="0" Text="Sum" />
        </YAxis>
        <Series>
            <telerik:BarSeries Name="Quarter 1" Stacked="false">
                <Appearance>
                   <FillStyle BackgroundColor="#c5d291" />
                </Appearance>
                <Items>
                   <telerik:SeriesItem YValue="315000" />
                   <telerik:SeriesItem YValue="495000" />
                   <telerik:SeriesItem YValue="690000" />
                </Items>
            </telerik:BarSeries>
            <telerik:BarSeries Name="Quarter 2">
                <Appearance>
                    <FillStyle BackgroundColor="#92b622" />
                </Appearance>
                <Items>
                   <telerik:SeriesItem YValue="360000" />
                   <telerik:SeriesItem YValue="540000" />
                   <telerik:SeriesItem YValue="735000" />
                </Items>
            </telerik:BarSeries>
            <telerik:BarSeries Name="Quarter 3">
                <Appearance>
                   <FillStyle BackgroundColor="#729021" />
                </Appearance>
                <Items>
                   <telerik:SeriesItem YValue="405000" />
                   <telerik:SeriesItem YValue="600000" />
                   <telerik:SeriesItem YValue="780000" />
                </Items>
            </telerik:BarSeries>
        </Series>
   </PlotArea>
</telerik:RadHtmlChart>

C#:
protected void Page_Load(object sender, EventArgs e)
    {
        foreach (BarSeries series in BarChart.PlotArea.Series)
        {
            series.LabelsAppearance.DataFormatString = series.Name + "${0}";
            series.TooltipsAppearance.DataFormatString = series.Name + "${0}";
        }
    }

Hope this helps.

Regards,
Shinu.
0
Brian Mains
Top achievements
Rank 1
answered on 05 Oct 2012, 12:18 PM
That's at the series level correct?  I want each item to have a custom label.  I don't see a property to support that, but wasn't sure if it was possible.
0
Marin Bratanov
Telerik team
answered on 08 Oct 2012, 10:18 AM
Hi guys,

I would like to add that with the Q3 2012 release the series labels will offer a ClienTemplate property that you will be able to use to create more advanced templates, for example by adding data from other columns from the datasource.


Greetings,
Marin Bratanov
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.
Tags
Chart (HTML5)
Asked by
Brian Mains
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Brian Mains
Top achievements
Rank 1
Marin Bratanov
Telerik team
Share this question
or