Chart Legneds guide for ASP.NET AJAX, C#, VB.NET, rich aspx sample code for legend properties and layout

Chart Legends in ASP.NET AJAX

Home > How to > Chart Legend

Information to Legend

With the legend, you can easily know what each bar, or line or pie or column stands for. So what is legend? Legend is the symbol and text used to offer some extra information about the chart. And if one chart has several data series, we may usually use the legend to specify each data series with a color-coded symbol and a name.

As for the style and position of the chart legend, the KaxChart control offers various properties for you to fully customize the legend settings. And in this online tutorial, we will offer you sample asp.net programming code to guide you add customized legend to chart. Besides adding, you can also remove, edit, order, resize the lagend in the web chart control.

Legend Properties

Following four properties are used to help you modify and customize the settings of chart legend element.

Visible: you are free to display or hide the legend in the chart.
Appearance: the Appearance property allows users to design the size, the rotation degree, the border space, alignment mode, the fill type (like solid) and the color of the legend element. To put it in another way, this property controls the general look of the legend element.
Items: this property is responsible for the legend symbols and text that are used to represent each data series.
TextBlock: this property is offered to control the default text, font and appearance.

Here we offer a programming example which will show you how to use above mentioned legend properties in aspx web page.


<Legend Visible="true" >
<TextArea StyleSet-Fill-FillMode="Solid" StyleSet-Fill -PrimaryColor="DarkOrange"></TextArea >
</Legend>

We also provide the C# sample code to help you define the basic legned properties.


KaxChart1.Legend.Visible = true;
KaxChart1.Legend.TextArea.Text = "Legend";
KaxChart1.Legend.TextArea.StyleSet.Fill.FillMode = ChartFillMode.Solid;
KaxChart1.Legend.TextArea.StyleSet.Fill.PrimaryColor = System.Drawing.Color.DarkOrange;

Define Legend Layout

The layout of chart legend element covers several aspects, including legend label sizing dimensions, legend position and the symbol of legend. To specify these setting values, the chart legend will redraw to show with differet style and appearance.

Change the symbol of legend: the symbol that the legend uses to present each data series can be changed to different shapes, like circle, rectangle and diamond.
Define the size of legend element: the height and width of legend can be customized respectively.
Set the position of legend element: the legend can be placed at your desired location, like TopRight, CenterRight, BottomRight, Top, Center, Bottom, TopLeft, CenterLeft and BottomLeft.

Here we also attach a programming example for you to customize the legend layout in aspx web page.


<Legend Visible="true">
< StyleSet Position-AlignedPosition="TopRight" Border-Color="CadetBlue" Border-Width="3"></StyleSet >
</Legend>

If you want set legend layout property in aspx.cs class using C# code, it's also supported.


KaxChart1.Legend.StyleSet.Position.AlignedPosition = AlignedPositions.TopRight;
KaxChart1.Legend.StyleSet.Border.Width = 3;
KaxChart1.Legend.StyleSet.Border.Color = System.Drawing.Color.CadetBlue;

Information to Legend

Legend Properties

Define Legend Layout

Related Chart Legend Element Articles