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

Showing % in a bar

1 Answer 89 Views
Chart (Obsolete)
This is a migrated thread and some comments may be shown as answers.
PureRamu
Top achievements
Rank 1
PureRamu asked on 18 Apr 2009, 05:29 AM

I have heard that telerik charts are good.

 

But I have to show percentage (%) value in one bar

I just want one bar

 

For example if I use forms authentication and want to shows the mark percentage obtained by the logged in student.

 

 

In short I should be able to bind a percentage value to a  bar.

if the width of the bar is 100px and i have to bind a value 60  the it should show  60px of width in one

 

 

I want to show it in horizontal bar.

Only one bar is needed at a time since there we show the logged in users percentage only

 

 

I

f the width of the bar is 100px and i have to bind a value 60 to the chart

  then it should show  60px of width in one bright colour and rest(40px) in fade coulour.


 

 

 

 

 

 

 

 

 

1 Answer, 1 is accepted

Sort by
0
Accepted
Dessy
Telerik team
answered on 21 Apr 2009, 10:44 AM

Hi PureRamu,

In order to  create horizontal-oriented Bar Chart  you should set  SeriesOrientation to 'Horizontal' .   DefaultLabelValue property of RadChart  will specify a format for label values of all items in Chart Series .With this property you can display the value of the Series items following of percentage.
Here you can find more information about DefaultLabelValue property and  the formats which it could contain.
Setting BarWidthPercent to 100 will enlarge the size of Bar Series and in this way you will achieve one Bar Series containing two parts - first part will be the  value of the item in percentage and the next one -PlotArea- will represent what's left of the YAxis. You could also customize the appearance of Plot Area (your second series part) and Series Item using Appearance properties. Here is an example:

        <telerik:RadChart ID="RadChart1" runat="server" SeriesOrientation="Horizontal" Height="140" 
            AutoLayout="true"
            <Legend Visible="false"></Legend> 
            <Series> 
                <telerik:ChartSeries Name="Series 1" DefaultLabelValue="#Y%"
                    <Appearance BarWidthPercent="100"
                    </Appearance> 
                    <Items> 
                        <telerik:ChartSeriesItem Name="Item 1" YValue="60"
                        </telerik:ChartSeriesItem> 
                    </Items> 
                </telerik:ChartSeries> 
            </Series> 
            <PlotArea> 
                <YAxis AutoScale="False" MaxValue="100" MinValue="0" Step="10"
                    <AxisLabel> 
                        <Appearance RotationAngle="0"
                        </Appearance> 
                    </AxisLabel> 
                </YAxis> 
            </PlotArea> 
        </telerik:RadChart> 

Hope that helps.

Regards,

Dessy
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Tags
Chart (Obsolete)
Asked by
PureRamu
Top achievements
Rank 1
Answers by
Dessy
Telerik team
Share this question
or