Значения в круговой диаграмме - PullRequest
3 голосов
/ 06 декабря 2011

Как вы отображаете значения каждого круга в круговой диаграмме, используя ChartHelper? Я использую синтаксис MVC3 / Razor.

Попытка сделать что-то вроде этого:

Pie

Изображение из этого урока для 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");

Ответы [ 3 ]

13 голосов
/ 06 декабря 2011

Я сделал это с помощью класса 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")" />
4 голосов
/ 07 декабря 2011

Мое решение благодаря DaveShaw.Требуется немного доработать, но дает мне большую часть того, что мне нужно.

3 голосов
/ 06 мая 2012

мой ответ и решение (работает с объяснением):

это подходит для MVC 4 и MVC 3 с платформой .NET 4 и добавлением ссылки на System.Web.DataVisualization.dll, а не на .net System.Web.Helpers. 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="" /> 
...