OHLC图表

的OHLC(开-高-低-闭)图通常用于说明金融工具价格随时间的变化。图表上的每条垂直线显示了一段时间内的价格范围(最高和最低价格)。

本文假设您熟悉图基础而且数据绑定．

创建OHLC图:

1. 添加一个ChartSeries到ChartSeriesItems集合
2. 设置它类型财产ChartSeriesType。OHLC
3. 为其提供数据集合数据属性，并设置相应的字段:
   • CategoryField-将与x轴匹配的日期
   • OpenField-具有Open值的字段
   • CloseField-具有Close值的字段
   • 海菲尔德-值为High的字段
   • LowField-值为Low的字段
4. 设x轴为a时间轴-虽然烛台图可以处理简单的字符串类别，但它的设计目的是显示一段时间的财务数据

@* OHLC图表*@                @code {List ChartProduct1Data {get;设置;} protected override async Task OnInitializedAsync() {await GenerateChartData();} async Task GenerateChartData() {ChartProduct1Data = new List() {new StockDataPoint(new DateTime(2019, 1,1)， 39.88m, 40.12m, 41.12m, 39.75m, 3584700)， new StockDataPoint(new DateTime(2019, 2,1)， 462 m, 40.12m, 41.69m, 39.81m, 2632000)， new StockDataPoint(new DateTime(2019, 3,1)， 42m, 462 m, 43.31m, 41.38m, 7631700)， new StockDataPoint(new DateTime(2019, 4,1)， 42.25m, 43.06m, 43.31m, 41.12m, 4922200)，}; await Task.FromResult(ChartProduct1Data); } public class StockDataPoint { public StockDataPoint() { } public StockDataPoint(DateTime date, decimal open, decimal close, decimal high, decimal low, int volume) { Date = date; Open = open; Close = close; High = high; Low = low; Volume = volume; } public DateTime Date { get; set; } public decimal Open { get; set; } public decimal Close { get; set; } public decimal High { get; set; } public decimal Low { get; set; } public int Volume { get; set; } } }

OHLC图表特定外观设置

色域

柱状图、OHLC图和烛台图可以采用系列项目的颜色ColorField数据源的。您可以传递一个有效的CSS颜色(例如，#六边形abcdef，# f00,或蓝色的）.

间隙和间距

您可以控制将每个系列的数据点聚在一起的类别之间的距离。要做到这一点，请使用差距级数的性质。它是类别之间的距离，表示为条宽的百分比。

若要设置同一类别中不同系列的柱之间的距离，请使用间距财产。它是一个系列类别中系列项目之间的空间占单个系列项目宽度的比例。

要创建重叠，请设置负值。

的值差距而且间距对于第一个系列的整个图表，它们适用于所有类别和系列项目。

自定义图表元素-嵌套标签设置

在图表中配置嵌套属性和子元素时，内部标记将包含它们的父标记名称，并在其末尾添加细节。一般来说，这种嵌套标记的结构将是<图*级* * *细节>类别可以是以下其中之一:

• CategoryAxis
• ChartArea
• 传说
• PlotArea
• SeriesItems
• 标题
• 工具提示
• ValueAxis
• XAxes
• YAxes
• 和其他人

要自定义图表，请寻找嵌套标记及其属性——内部标记将包含它们的父标记名称并在其末尾添加细节。例如，ChartSeries标签有一个ChartSeriesLabels标记，该标记公开配置选项和更多子标记。

另请参阅

• 现场演示:OHLC图