Question

我正在尝试将数据绑定到饼图

的方法

  Public ActionResult Charts
  {
      Highcharts chart = new Highcharts("chart")
        .InitChart(new Chart { PlotShadow = false })
        .SetTitle(new Title { Text = "Browser market shares at a specific website, 2010" })
        .SetTooltip(new Tooltip { Formatter = "function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; }" })
        .SetPlotOptions(new PlotOptions
        {
            Pie = new PlotOptionsPie
            {
                AllowPointSelect = true,
                Cursor = Cursors.Pointer,
                DataLabels = new PlotOptionsPieDataLabels
                {
                    Color = ColorTranslator.FromHtml("#000000"),
                    ConnectorColor = ColorTranslator.FromHtml("#000000"),
                    Formatter = "function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; }"
                }
            }
        })
        .SetSeries(new Series
        {
            Type = ChartTypes.Pie,
            Name = "Browser share",
            Data = new Data(new object[]
                                   {
                                       new object[] { "Firefox", 45.0 },
                                       new object[] { "IE", 26.8 },
                                       new DotNet.Highcharts.Options.Point
                                       {
                                           Name = "Chrome",
                                           Y = 12.8,
                                           Sliced = true,
                                           Selected = true
                                       },
                                       new object[] { "Safari", 8.5 },
                                       new object[] { "Opera", 6.2 },
                                       new object[] { "Others", 0.7 }
                                   })
                             });
        }
    }

    public JsonResult GetData()
    {
        int Param1;
        Param1 = 1;     
        var reports = db.ExecuteStoreQuery<ResourceReports>("ResourceReports @EmployeeID", new SqlParameter("@EmployeeID", Param1)).ToList();
        return Json(reports, JsonRequestBehavior.AllowGet);
    }

我想替换

    .SetSeries(new Series
    {
        Type = ChartTypes.Pie,
        Name = "Browser share",
        Data = new Data(new object[]
                                   {
                                       new object[] { "Firefox", 45.0 },
                                       new object[] { "IE", 26.8 },
                                       new DotNet.Highcharts.Options.Point
                                       {
                                           Name = "Chrome",
                                           Y = 12.8,
                                           Sliced = true,
                                           Selected = true
                                       },
                                       new object[] { "Safari", 8.5 },
                                       new object[] { "Opera", 6.2 },
                                       new object[] { "Others", 0.7 }
                                   })
        });
    }

使用我的GetData()如何执行此操作，.SetSeries中的数据应该是GetData method

中返回的数据

Answer 1

看来你正在使用Dotnet.Highcharts。您可以创建Series列表和Point列表。

List<Series> mySeries = new List<Series>();
List<Point> myPoints = new List<Point>();

我会遍历你需要创建的每个系列并生成点数据，如下所示：

myPoints.Add(new Point {
    X = (detailRec.RecordTime - new DateTime(1970, 1, 1, 0, 0, 0)).TotalMilliseconds,
    Y = detailRec.TotalCount
});

然后您可以使用其数据的点列表创建系列本身，如下所示：

mySeries.Add(new Series{
  Name = distinctDistrict.Name,
  Data = new Data(myPoints.ToArray())
});

然后设置系列，您可以使用以下语句：

.SetSeries(mySeries.Select(s => new Series { 
  Name = s.Name, 
  Data = s.Data 
}).ToArray())

如果在Visual Studio中使用对象浏览器，则可以查看Series和Point类的其他属性和方法。要使用上面的代码，您必须包含以下using语句：

using DotNet.Highcharts;
using DotNet.Highcharts.Enums;
using DotNet.Highcharts.Helpers;
using DotNet.Highcharts.Options;
using Point = DotNet.Highcharts.Options.Point;

如何使用dotnet highcharts dll在MVC3中显示HighCharts？

1 个答案: