首页 文章

使用Kendo UI Asp.net mvc核心未显示图表组件

提问于
浏览
0

我目前正在尝试评估Kendo UI asp.net mvc 6("asp.net core")小部件 . 我下载了示例项目Kendo.Mvc.Examples项目,可以在这里找到:http://docs.telerik.com/kendo-ui/aspnet-mvc/aspnetmvc-apps/mvc-6/introduction

示例项目工作得很好 . 现在我正在尝试创建我自己的骨架项目,如下所示:

  • 使用ASP.NET 5 Web应用程序模板创建了一个新的Visual Studio项目

  • 在我的项目json中添加了 "Kendo.Mvc": "2016.1.301" 依赖项 .

  • Startup.ConfigureServices() 中添加 services.AddKendo();

  • 修改了我的Index.chtml以包含Kendo UI控件:

@using Kendo.Mvc.UI

@ {ViewData [“Title”] =“我的事情仪表板”; }

@ViewData [“Title”]

目前运行的东西

@(Html.Kendo() . Button() . Name(“iconTextButton”) . HtmlAttributes(new ) . Icon(“ungroup”).Content(“Kendo UI Button”))

@(Html.Kendo() . Chart() . Name(“chart”) . Headers (“国内 生产环境 总值增长\ n / GDP年度%/”) . 传奇(图例=>图例.Position(ChartLegendPosition.Bottom)) .ChartArea(chartArea => chartArea .Background(“transparent”)) . SeriesDefaults(seriesDefaults => seriesDefaults.Area() . Line(line => line.Style(ChartLineStyle.Smooth))) . Series(series => {series .Area(new double [] {3.907,7.943,7.848,9.284,9.263,9.801,3.890,8.238,9.552,6.855} . ) . Name(“India”);}) . CategoryAxis(axis => axis .Categories(“ 2002“,”2003“,”2004“,”2005“,”2006“,”2007“,”2008“,”2009“,”2010“,”2011“).MajorGridLines(lines => lines.Visible(false) ))) . ValueAxis(axis => axis .Numeric() . Labels(labels => labels.Format(“{0}%”)) . AxisCrossingValue(-10).Line(line => line.Visible(false) ).Tooltip(tooltip => tooltip .Visible(true).Format(“{0}%”) . 模板(“#= series.name#:#= value#”)))

当我运行应用程序时,按钮显示正确但图表不显示 . 但是,查看html源我可以看到正在生成图表:

目前运行的东西

Kendo UI ButtonjQuery(function(){jQuery(“#iconTextButton”) . kendoButton({“icon”:“ungroup”});});

<div id="chart" name="chart"></div><script>jQuery(function(){jQuery("#chart").kendoChart({"categoryAxis":[{"categories":["2002","2003","2004","2005","2006","2007","2008","2009","2010","2011"],"majorGridLines":{"visible":false}}],"chartArea":{"background":"transparent"},"legend":{"position":"bottom"},"series":[{"name":"India","type":"area","data":[3.907,7.943,7.848,9.284,9.263,9.801,3.89,8.238,9.552,6.855]},{"name":"World","type":"area","data":[1.988,2.733,3.994,3.464,4.001,3.939,1.333,-2.245,4.339,2.727]},{"name":"Haiti","type":"area","data":[-0.253,0.362,-3.519,1.799,2.252,3.343,0.843,2.877,-5.416,5.59]}],"title":{"text":"Gross domestic product growth \n /GDP annual %/"},"tooltip":{"format":"{0}%","template":"#= series.name #: #= value #","visible":true},"valueAxis":[{"axisCrossingValue":[-10],"labels":{"format":"{0}%"},"line":{"visible":false},"type":"numeric"}],"seriesDefaults":{"area":{"line":{"style":"smooth"}}}});});</script>

不知道我做错了什么....感谢您的帮助!

1 回答

相关问题