餅圖中的值

Question

如何使用ChartHelper顯示餅圖中每個餅圖的值？我正在使用MVC3/Razor語法。

試圖做這樣的事情：

的影像從this tutorial爲ChartHelper在MVC：

我的代碼：

var bytes = new Chart(600, 300).AddSeries(
        chartType: "pie", 
        legend: "Sales in Store per Payment Collected", 
        xValue: viewModel.SalesInStorePerPaymentCollected.XValues, 
        yValues: viewModel.SalesInStorePerPaymentCollected.YValues 
        ) 
        .GetBytes("png"); 


      return File(bytes, "image/png"); 

Answer 1

我做到了通過使用System.Web.UI.DataVisualization.Charting.Chart類。

這裏是我的控制器代碼：

public ActionResult Chart() 
{ 
    Chart chart = new Chart(); 
    chart.ChartAreas.Add(new ChartArea()); 

    chart.Series.Add(new Series("Data")); 
    chart.Series["Data"].ChartType = SeriesChartType.Pie; 
    chart.Series["Data"]["PieLabelStyle"] = "Outside"; 
    chart.Series["Data"]["PieLineColor"] = "Black"; 
    chart.Series["Data"].Points.DataBindXY(
     data.Select(data => data.Name.ToString()).ToArray(), 
     data.Select(data => data.Count).ToArray()); 
    //Other chart formatting and data source omitted. 

    MemoryStream ms = new MemoryStream(); 
    chart.SaveImage(ms, ChartImageFormat.Png); 
    return File(ms.ToArray(), "image/png"); 
} 

和視圖：

<img alt="alternateText" src="@Url.Action("Chart")" /> 

Answer 2

我的解決方案感謝DaveShaw。需要稍微調整一下，但給了我大部分我需要的東西。

 Chart chart = new Chart(); 

     chart.ChartAreas.Add(new ChartArea()); 

     chart.Series.Add(new Series("Data")); 
     chart.Legends.Add(new Legend("Stores")); 
     chart.Series["Data"].ChartType = SeriesChartType.Pie; 
     chart.Series["Data"]["PieLabelStyle"] = "Outside"; 
     chart.Series["Data"]["PieLineColor"] = "Black"; 
     for (int x = 0; x < viewModel.SalesInStorePerPaymentCollected.XValues.Length; x++) 
     { 
      int ptIdx = chart.Series["Data"].Points.AddXY(
       viewModel.SalesInStorePerPaymentCollected.XValues[x], 
       viewModel.SalesInStorePerPaymentCollected.YValues[x]); 
      DataPoint pt = chart.Series["Data"].Points[ptIdx]; 
      pt.LegendText = "#VALX: #VALY"; 
      pt.LegendUrl = "/Contact/Details/Hey"; 
     } 

     chart.Series["Data"].Label = "#PERCENT{P0}"; 
     chart.Series["Data"].Font = new Font("Segoe UI", 8.0f, FontStyle.Bold); 
     chart.Series["Data"].ChartType = SeriesChartType.Pie; 
     chart.Series["Data"]["PieLabelStyle"] = "Outside"; 
     chart.Series["Data"].Legend = "Stores"; 
     chart.Legends["Stores"].Docking = Docking.Bottom; 

     var returnStream = new MemoryStream(); 
     chart.ImageType = ChartImageType.Png; 
     chart.SaveImage(returnStream); 
     returnStream.Position = 0; 
     return new FileStreamResult(returnStream, "image/png"); 

呈現這樣的：

Answer 3

我的答案和解決方案（與解釋工作）：

這適合MVC 4和MVC 3 .NET 4框架，並添加引用System.Web.DataVisualization.dll而不是.net System.Web.Helpers，DataVisualization.dll可以在 http://www.codeproject.com/Articles/125230/ASP-NET-MVC-Chart-Control

ChartApplication->外部參考

有DataVisualization的圖表的更多信息可以在那裏找到。

沒關係，它可以被替換爲：

 public ActionResult Chart() 
    { 
     Chart chart = new Chart(); 

     chart.ChartAreas.Add(new ChartArea()); 

     chart.Series.Add(new Series("Data")); 
     chart.Legends.Add(new Legend("Stores")); 
     chart.Series["Data"].ChartType = SeriesChartType.Spline; 
     chart.Series["Data"].Points.AddXY(1.0, 5.0); 
     chart.Series["Data"].Points.AddXY(2.0, 9.0); 
     /* 
     chart.Series["Data"]["PieLabelStyle"] = "Outside"; 
     chart.Series["Data"]["PieLineColor"] = "Black"; 
     */ 
     /* 
      int ptIdx = chart.Series["Data"].Points.AddXY(1.0, 5.0); 
      DataPoint pt = chart.Series["Data"].Points[ptIdx]; 
      pt.LegendText = "#VALX: #VALY"; 
      pt.LegendUrl = "/Contact/Details/Hey"; 
     */ 
     /* 
     chart.Series["Data"].Label = "#PERCENT{P0}"; 
     chart.Series["Data"].Font = new Font("Segoe UI", 8.0f, FontStyle.Bold); 
     chart.Series["Data"].ChartType = SeriesChartType.Pie; 
     chart.Series["Data"]["PieLabelStyle"] = "Outside"; 
     chart.Series["Data"].Legend = "Stores"; 
     chart.Legends["Stores"].Docking = Docking.Bottom; 
     */ 
     var returnStream = new MemoryStream(); 
     chart.ImageType = ChartImageType.Png; 
     chart.SaveImage(returnStream); 
     returnStream.Position = 0; 
     return new FileStreamResult(returnStream, "image/png"); 
    } 

或（對於MVC 4和MVC 3在.NET 4和System.Web.Helpers）：

 public ActionResult Chart() 
    { 
     var bytes = new Chart(600, 300).AddSeries(
          chartType: "pie", 
          legend: "Sales in Store per Payment Collected", 
          xValue: new[] { "Jan", "Feb", "Mar", "Apr", "May" }, 
          yValues: new[] { "20", "20", "40", "10", "10" } 
          ) 
          .Write("png"); 
     return null; 
    } 

的和當然你需要在兩者中都加入.cshtml以下內容：

<img src="/Home/Chart" alt="" />