Telerik UI for ASP。网络核心?下载30天免费试用

多轴

Telerik ASP。网络核心Bar chart supports multiple axis. This helps you leverage the best charting performance and visualize data on any number axis to provide solid business reports for your users.

上面的例子显示了一个混合动力汽车的里程报告,通过四个值轴可视化:公里、英里、每加仑英里和每100公里升。注意,它们每个都有唯一的名称,这是通过ValueAxis设置的。标题的方法。您还可以设置CategoryAxis。方法指定值轴的对齐方式。

下面的实现演示了设置条形图多轴所需的代码:

@(Html.Kendo().Chart() .Name("chart") .Title("混合动力汽车里程报告").Legend(legend => legend .Position(ChartLegendPosition.Top)) .Series(series => {series .Column(新int[] {20,40,45,30,50}) .Stack(true) .Color("#cc6e38") .Name("on battery");series .Column(new int[] {20, 30, 35, 35, 40}) .Stack(true) .Color("#ef955f") .Name("on gas");series .Line(new double[] {30,38,40,32,42}) .Name("mpg") .Color("#ec5e0a") .Axis("mpg");系列.Line(新双[]{7.8,6.2,5.9,7.4,5.6}). name (l / 100公里).Color .Axis(“# 4 e4141”)(“l100km”);}) . categoryaxis (axis => axis . categories ("Mon", "Tue", "Wed", "Thu", "Fri") //将前两个值轴向左对齐//将后两个值轴向右对齐。/ / / /右对齐是通过指定一个/ /交叉值大于或等于/ /类别的数量。.AxisCrossingValue(0, 0, 10、10)).ValueAxis(轴= >轴.Numeric () .Title(英里).Min (0) .Max (100)) .ValueAxis(轴= >轴.Numeric(公里).Title(公里).Min (0) .Max (161) .MajorUnit (32) .ValueAxis(轴= >轴.Numeric (mpg) .Title(英里/加仑).Color (" # ec5e0a ")) .ValueAxis(轴= >轴.Numeric (l100km) .Title(升/ 100公里).Color (" # 4 e4141 ")))
@addTagHelper *,剑道。Mvc @{var categories = new string[] {"Mon", "Tue", "Wed", "Thu", "Fri"};} 
.

条形图的多轴实现概述:

用户界面为ASP。网络核心多轴

另请参阅

在本文中
Baidu
map