使用迷你图可视化展示趋势
本帖最后由 Richard.Ma 于 2020-2-17 09:54 编辑迷你图是迷你,轻型的图表,有助于快速可视化数据。“数据密集,设计简单,字符大小的图形”。尽管迷你图不包含传统图表中的许多元素(如轴和坐标),但基于其简单性,它们可能比其他图表类型更具信息性。由于尺寸紧凑,迷你图可以轻松地嵌入到数据网格或仪表板中,以显示一系列价值趋势,例如销售,天气或股票市场。
FlexGrid中的迷你图在数据网格中使用迷你图是很常见的,因为它们在不占用太多空间的情况下为表格数据增加了丰富的可视化功能。FlexGrid控件提供了在网格的列中显示迷你图的功能。让我们通过一个非常常见的用例来了解此功能-分析特定月份不同公司的库存趋势。
使用迷你图可视化股票市场趋势迷你图提供即时趋势信息。这正是股票市场分析师所需要的-即时趋势财务数据。https://grapecitycontentcdn.azureedge.net/blogs/componentone/20181206-visualizing-data-trends-using-sparklines/1.jpg
在上面描述的示例中,网格显示了2018年10月月份不同公司的以下股票信息,最近一周的交易量(最近7天的交易量),前一周的交易量(前7天的交易量),一周一周内交易量(原始和百分比)的变化以及整个月的交易量趋势。现在,让我们看一下如何在FlexGrid中实现这一点。
创建迷你图绑定到数据源将FlexGrid绑定到包含表示数字数据集合的字段的数据源。例如,一个实现IEnumerable或INotifyCollectionChanged接口(如Array,List或ObservableCollection)的字段。
我们将网格绑定到一个数据源,该数据源包含:有关最近一周的交易量,前一周的交易量,两者之间的变化和百分比变化的信息,以及十月份不同公司的交易量的数字集合。
绑定好网格后,就该探索我们需要使用的属性了,以便在FlexGrid中显示迷你图。
使用ShowSparkline和Sparkline属性设置Column类的ShowSparkline和Sparkline属性,在集合表示的数据的相应单元格中显示迷你图。因此,为了可视化一个月的交易量趋势,只需将列的ShowSparkline属性设置为true即可,如图所示。
Column volumeTrendCol = c1FlexGrid1.Cols["VolumeValues"];
volumeTrendCol.Caption = "Volume Trend Last 31 days\n as of 31-10-2018";
//Set the Column's ShowSparkline property to true to show sparklines in that column
volumeTrendCol.ShowSparkline = true;
您可以在三种不同类型的迷你图中选择一种,即“列”,“线”和“ WinLoss”,以可视化不同上下文中的数据。
例如,折线迷你图适用于可视化连续数据,例如销售数据。柱形迷你图用于涉及数据比较的场景,例如,比较特定年份的月利润。
同样,WinLoss迷你图最适合可视化真假(即输赢)情况,例如,跟踪运动季节。
在这里,由于我们有连续的数据(一个月的交易量),因此我们将使用折线迷你图。为了设置迷你图类型,您需要使用Column类的Sparkline属性来获得迷你图对象。
然后,将检索到的对象的SparklineType属性设置为SparklineType.Line。您还可以使用标记突出显示迷你图上的各个数据点,以使其更具可读性。例如,要突出显示迷你图中的最高和最低交易量值,请将Sparkline类的ShowHigh和ShowLow属性设置为true,如下所示:
//Sets the type of Sparkline
volumeTrendCol.Sparkline.SparklineType = SparklineType.Line;
//Highlight the highest and the lowest data points
volumeTrendCol.Sparkline.ShowHigh = true;
volumeTrendCol.Sparkline.ShowLow = true;
您还可以使用不同的样式选项来更改迷你图的外观。迷你图样式为了设置迷你图的样式,FlexGrid控件的命名空间提供了一个名为SparklineStyles的类,该类公开了许多属性以自定义迷你图的外观,例如轴的颜色,数据点的颜色,对象的颜色。系列,列/ winloss迷你图的两个条之间的距离以及“线条”迷你图中的线条的粗细。
页:
[1]