图例是一个显示与该图表上绘制的每个数据系列相对应的颜色,符号和文本的列表。在多个序列的情况下,它有助于理解和分析绘制的数据。
在FlexChart中,如果设置了系列的Name属性,则会自动显示图例。换句话说,需要使用系列的Name属性来生成与之对应的图例条目。此外,FlexChart会根据图表区域上的可用空间自动放置图例。但是,您也可以通过设置Position属性,将其设置为相对于绘图区域显示在顶部,底部,左侧或右侧 。为了以最优化的方式使用可用空间,FlexChart放置在顶部或底部时水平显示图例,放置在绘图区域的左侧或右侧则垂直显示图例。同时,FlexChart还允许您根据需求设置 Orientation来垂直或水平显示图例 。
flexChart1.Series.Clear(); //Setting type of chart to Line flexChart1.ChartType = ChartType.Line; //Setting FlexChart's Header flexChart1.Header.Content = "Daily Price Movement"; //Binding FlexChart's AxisX to 'Name' so country names appear in Horizontal axis flexChart1.BindingX = "Date"; //Creating and adding multiple series, one for High and one for Low this.flexChart1.Series.Add(new Series { Binding = "High", Name = "Highs" }); this.flexChart1.Series.Add(new Series { Binding = "Low", Name = "Lows" }); //Passing data in FlexChart flexChart1.DataSource = GetQuotes(100); //Setting legends Position and Orientation flexChart1.Legend.Position = Position.Top; flexChart1.Legend.Orientation = C1.Chart.Orientation.Horizontal;
切换系列
使用FlexChart,如果FlexChart类的LegendToggle属性 设置为True,则用户可以在运行时单击相应的图例条目来切换对应数据系列的可见性 。
//允许最终用户通过单击图例来切换系列的可见性 flexChart1.LegendToggle = true;
管理长图例文本
有时候,没有足够的空间来显示图表区域中图例条目的完整文本。FlexChart提供Legend类的TextWrapping属性,当文本的宽度超过ItemMaxWidth属性中指定的值时,该属性可用于换行或裁剪文本 。该TextWrapping属性接受TextWrapping 值枚举。
TextWrapping = TextWrapping.Wrap | TextWrapping = TextWrapping.Truncate |
---|---|
//如果文本宽度超过最大限制,则换行图例文本 flexChart1.Legend.ItemMaxWidth = 70; flexChart1.Legend.TextWrapping = TextWrapping.Wrap;
图例样式
FlexChart还允许您使用Legend类的Style属性设置图例和图例条目的样式。此属性使您可以指定图例的填充,填充颜色,线条粗细,线条颜色等。
//图例 样式 flexChart1.Legend.Style.Font = new Font("Arial", 10, FontStyle.Italic); flexChart1.Legend.Style.StrokeWidth = 0.75f; flexChart1.Legend.Style.StrokeColor = Color.Firebrick;
图例分组
图例分组是指根据图例条目提供的数据进行分类。对于多个堆叠序列,此功能通常有助于识别数据序列的类别。例如,在同一图表区域中绘制多个季度的销售和利润时,图例分组有助于识别哪些系列是销售系列,哪些是利润系列。
要使用FlexChart创建图例组,控件提供LegendGroup属性,该属性接受字符串值并将具有相同值的系列分组在一起。此属性的值不仅充当组名,而且还充当组标题,该标题将显示在相应图例组的顶部。未指定LegendGroup属性的系列被视为第0个组的一部分,并且显示时不带任何组标题。FlexChart还允许您使用Legend类的GroupHeaderStyle属性来自 定义图例组标题 。
//为每个系列指定组 flexChart1.Series[0].LegendGroup = "Sales"; flexChart1.Series[1].LegendGroup = "Profit"; flexChart1.Series[2].LegendGroup = "Sales"; flexChart1.Series[3].LegendGroup = "Profit"; flexChart1.Series[4].LegendGroup = "Sales"; flexChart1.Series[5].LegendGroup = "Profit"; flexChart1.Series[6].LegendGroup = "Sales"; flexChart1.Series[7].LegendGroup = "Profit"; //图例组表头样式 flexChart1.Legend.GroupHeaderStyle.Stroke = Brushes.DarkBlue; flexChart1.Legend.GroupHeaderStyle.Font = new Font(FontFamily.GenericMonospace, 10f, FontStyle.Bold);
也可以看看