Question

我正在寻找有关如何在网页上显示KendoUI图表的教程和代码示例，其中包含从数据库中提取的数据。更确切地说是ASP.Net MVC网页;喜欢在服务器端需要做什么才能显示在KendoUI图表上显示的控制器方法计算的数据。

具体问题是：

KendoUI是否仅适用于服务，或者我是否可以返回ViewModel对象一个ActionResult方法为return View(vmObj);？
服务器端有没有返回KendoUI图表的代码示例？
KendoUI只能在MVC中使用，还是可以在Asp.Net WebForms中使用它

我到目前为止看到的KendoUI文档只显示客户端代码，而不是针对AspNet MVC开发人员。

谢谢你的时间..

Answer 1

Kendo曾经有过一些ASP.NET MVC演示，您可以在Visual Studio中下载和运行这些演示，以了解如何绑定到远程数据等，但由于某些原因它们被删除了。以下是我根据这些演示制作的一个简单示例：

控制器操作（例如，在“ChartsController.cs”中）：

public ActionResult Index()
{
    return View();
}
public ActionResult GetChartData()
{
    IEnumerable<ChartModel> chartData = SomeRepository.GetData();
    return Json(chartData );
}

ChartModel：

public class ChartModel
{
    public ChartModel(string year, int val2, int val3)
    {
        Year = year;
        Val2= val2;
        Val3= val3;
    }

    public string Year { get; set; }
    public int Val2 { get; set; }
    public int Val3 { get; set; }
}

查看（“Charts / Index.cshtml”，不包括布局）：

<div class="chart-wrapper">
@(Html.Kendo().Chart<ChartExample.Models.ChartModel>()
    .Name("chart")
    .Title("Example Column Chart")
    .Legend(legend => legend
        .Position(ChartLegendPosition.Top)
    )
    .DataSource(ds => ds.Read(read => read.Action("GetChartData", "Charts")))
    .Series(series => {
        series.Column(model => model.Val2).Name("Val2");
        series.Column(model => model.Val3).Name("Val3");
    })
    .CategoryAxis(axis => axis
        .Categories(model => model.Year)
        .Labels(labels => labels.Rotation(-90))
    )
    .ValueAxis(axis => axis.Numeric()
        .Labels(labels => labels.Format("{0:N0}"))
        .MajorUnit(10000)
    )
) 
</div>

此示例使用单独的控制器操作来获取视图并获取图表的数据，但您也可以将它们组合在一起并拥有return View(chartData);并在视图中显示：

@model IEnumerable<ChartExample.Models.ChartModel>
<div>
    @(Html.Kendo().Chart(Model)
        // just don't include the ".DataSource" line
        // ...
    )
</div>

不幸的是，我不能告诉你是否可以用Webforms完成，因为我之前从未使用过。希望这有帮助！

Answer 2

Kendo UI为ASP.NET MVC提供官方包装。

它们取代了旧的Telerik Extensions for ASP.NET MVC。现有用户应该查看Migration Guide。完整的文档是docs.kendoui.com site。

的一部分

Trial包含服务器端包装器和脱机演示。您可以在wrappers\aspnetmvc包的kendoui.trial.x.y.z.zip文件夹中找到它们。

Answer 3

以下是您的问题的一些答案（未分类）

通过here看一下这个演示 - 我猜它会满足你的需求。使用图表下方的按钮检查视图/控制器和模型
请注意，即使该集合也会传递到服务器上的图表。 图表始终在客户端初始化。
只要有要使用的数据，您就可以在任何地方使用KendoChart。它再次可以是本地JavaScript数组JSON，它是对服务/控制器的调用的结果。

使用Asp.net MVC的KendoUI图表

3 个答案: