jQuery HighCharts和MVC 2应用程序中的简单条形图？

我正在尝试使用MVC中的JSon操作方法的结果创建一个非常简单的条形图。 我得到了实际的条形图，但我不明白这些选项和所有这些，所以我基本上猜测该怎么做。 我使用HighCharts网站上的示例作为如何从服务器代码获取数据并创建图表的示例。 不同之处在于我的图表比示例更简单。 我没有每个用户的类别（如在水果示例中），我只有一个用户和记录的小时数。

这是HighCharts jQuery代码：

function getHighChart() { var actionUrl = ''; var customerId = $('#customersId').val(); var startdate = $('.date-pickStart').val(); var enddate = $('.date-pickEnd').val(); var options = { chart: { renderTo: 'chart-container', defaultSeriesType: 'bar' }, title: { text: 'Statistik' }, xAxis: { categories: [] }, yAxis: { title: { text: 'Timmar' } }, series: [] } jQuery.getJSON(actionUrl, { customerId: customerId, startdate: startdate, enddate: enddate }, function (items) { var series = { data: [] }; $.each(items, function (itemNo, item) { series.name = item.Key; series.data.push(parseFloat(item.Value)); }); options.series.push(series); var chart = new Highcharts.Chart(options); }); } 

这是返回JSon的action方法：

  public JsonResult GetChartData(string customerId, string startdate, string enddate) { int intcustomerId = Int32.Parse(customerId); var emps = from segment in _repository.TimeSegments where segment.Date.Date >= DateTime.Parse(startdate) && segment.Date.Date  ts.Hours) }; Dictionary retVal = new Dictionary(); foreach (var currentEmployee in emps) { retVal.Add(currentEmployee.Name, currentEmployee.CurrentMonthHours); } return Json(retVal.ToArray(), JsonRequestBehavior.AllowGet); } 

我能够创建一个饼图，但是现在当我想创建一个简单的栏时，我无法弄清楚jQuery代码中的内容，所以我得到的结果是一个首先是唯一用户的栏图例中列出的是数组中的最后一个。 其次，工具提示显示x = [用户名]，y = 29，而不是[用户名]：29，这是我在饼图中得到的。

如何从这个JSon在HighCharts中创建这样一个简单的条形图？

Answer 1

我用：

 //Controller action: public JsonResult GetData(int id) { Dictionary data = this.repository.GetData(id); return Json(data.ToArray(), JsonRequestBehavior.AllowGet); } 

视图：

所以基本上我使用addPoint（’x，y’数组，false表示不重绘图表）

Answer 2

好吧，毕竟我自己完成了……我想我应该发布它以防其他像我这样的HighCharts新手感兴趣：

这是有效的jQuery：

  function getHighChart() { var actionUrl = '<%= Url.Action("GetChartData") %>'; var customerId = $('#customersId').val(); var customerName = $('#customersId option:selected').text(); var startdate = $('.date-pickStart').val(); var enddate = $('.date-pickEnd').val(); //define the options var options = { chart: { renderTo: 'chart-container', defaultSeriesType: 'column' }, title: { text: 'Hours worked for ' + customerName }, xAxis: { categories: [customerName] }, yAxis: { title: { text: 'Hours' } }, series: [] }; //Calls the JSON action method jQuery.getJSON(actionUrl, { customerId: customerId, startdate: startdate, enddate: enddate }, function (items) { $.each(items, function (itemNo, item) { var series = { data: [] }; series.name = item.Key; series.data.push(parseFloat(item.Value)); options.series.push(series); }); var chart = new Highcharts.Chart(options); }); } 

如果有人能找到这方面的错误并指出我有更好的方法去做，我很乐意交出答案，否则我会接受我自己的答案……