Creating simple bar chart

[Baby]

Hi All,

              We would like to make a simple chart control with no x axis and y axis. (I have the pic of that but did not find a link to upload the same in this forum). My chart is very simple. It should not have any x axis or y axis. it is an horizontal bar. at the begining of the horizontal bar there should be some text. The lowest number should be inside the bar at the starting and the highest number should be there at the end of the bar. There need not be any other text inside the bar. The Fill inside the bar should be of gradient effect.All this is to be developed at runtime through C#. Kindly help us generating this kind of bar chart using Telerik Rad Charts.

It would even help if you ask us a few questions or point us where we should be looking?

Thanks,
BMW

[Ves]

Hello BMW,

RadChart provides most of the functionalities you would need. You can set the Visible property of both XAxis and YAxis in order to hide them (more details about axes - here). You can hide/change the PlotArea borders and background (more details) and shrink/remove the margins (help topic). You can also hide the legend and the title. You can use the ChartSeriesItem.Appearance.FillStyle properties to define the gradient FillType (which is set by default) and the MainColor and SecondColor like this: RadChart1.Series[0].Appearance.FillStyle.MainColor = Color.Red;

The only requirement, that RadChart will not be able to meet is for the label at the beginning of the bar, unfortunately, it only supports one label per item.

Kind regards,
Ves
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Baby]

Thanks for the Reply, Can you also letme know how it is possible to display a bar inside a bar. For example imagine that there was a target for 10( this should be the outer bar with no fill but solid border and the target no 10 printed on the edge ie; at the ending of the bar).  The person was able to achieve only 5.(This should be the inner bar within the outer bar previously created with solid fill  and border and the label 5 at the beginning of this inner bar).

Best Regards
BMW

[Ves]

Hello BMW,

Please, find attached a sample page showing this. it takes advantages of BarWidthPercent and BarOverLapPercent properties for this. You can find more details here.

Kind regards,
Ves
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Baby]

Hi,

           Thanks for the reply. I have another requirement ie; when the chart is cretaed I will be applying many attributes values. Like 
          

iboChart.Appearance.Border.Visible =

false;

 

iboChart.Appearance.BarWidthPercent = 100;

iboChart.Appearance.Dimensions.Height = 36;

iboChart.Appearance.Dimensions.Width = 500;

iboChart.Legend.Visible =

false;

 

iboChart.ChartTitle.Visible =

false;

 

iboChart.SeriesOrientation =

ChartSeriesOrientation.Horizontal;

 

 

/**** The PlotArea Properties ****/

 

iboChart.PlotArea.Appearance.Border.Visible =

false;

 

iboChart.PlotArea.Appearance.FillStyle.FillType =

FillType.Solid;

 

iboChart.PlotArea.Appearance.FillStyle.MainColor =

Color.White;

 

iboChart.PlotArea.Appearance.Dimensions.Margins.Left = 130;

iboChart.PlotArea.Appearance.Dimensions.Height = 25;

iboChart.PlotArea.Appearance.Dimensions.Width = 450;

can i manipulate properties like these through a style sheet so that at a later stage it is easy to change the them with out touching the code. Thanks.

[Ves]

Hello,

Stylesheets will not work for this purpose with RadChart  as RadChart is an image and the colors, margins, paddings etc are defined in the server-side code before rendering this image. The image, when ready, is sent to the client and it is not then possible to change it using CSS.

Still, there is a solution -- you can use RadChart.SaveToXml() method to save a template chart in an .xml file. You can then use RadChart.LoadFromXml() method to load this chart. In the future you will only need to update this file in order to update the template. Alternatively, you can use the ASP.NET 2.0 Themes mechanism to set the a common set of properties for all instances of RadChart in your application

Hope this helps.

Sincerely,
Ves
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.