是否有任何 ASP.NET MVC 友好的图表控件支持具有不同切片半径的饼图？

Question

我需要创建一种具有不同半径切片的饼图 - 类似于：

http:// www.andypope.info/charts/pieradius.htm。

我还想在其上覆盖第二个系列，作为一条线。

该解决方案需要是 ASP.NET MVC 友好的 - 并且我需要能够将“向下钻取”链接与切片相关联。

如果没有现成的解决方案，是否可以将 Microsoft Chart Controls 饼图自定义到这种程度？或者这只是太多的定制，我最终会花更多的时间来对抗现有的代码而不是编写自己的代码？

Answer 1

jqPlot 非常好。我们花了不到一个小时就制作并运行了漂亮的图表。这是一个纯js实现。它们可以在所有浏览器甚至手机上运行。

http://www.jqplot.com/

Answer 2

您是否尝试过查看http://plugins.jquery.com/project/gchart？考虑到它是 jquery，它应该是 MVC 友好的。我不确定它是否能够完全满足您的要求，但它可能值得一看。

Answer 3

您看过 highcharts 了吗？您可以创建具有不同半径的饼图（demo）和还在其顶部覆盖一条线（demo）。虽然，我不确定您是否可以完全复制您提到的那种图表，但您随时可以向开发人员提出请求。他推出新功能的速度相当快。

Answer 4

Webmatrix 具有内置图表支持。

我不知道它是否支持具有不同切片半径的饼图。
我在当前的 asp.net mvc 项目中使用 WebGrid（也来自 Webmatrix），并且运行得很好。

以下是一些有用的链接：

如何-webmatrix-razor-asp-net-web-pages-and-mvc-fit-together

在饼图中显示数据

Answer 5

这可能对你有帮助
** 控制器***

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    using MvcApp.Models;
    using System.Web.Helpers;

    namespace MvcApp.Controllers
    {
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            ViewBag.Message = "Welcome to ASP.NET MVC!";

            return View();
        }

        public ActionResult About()
        {
            return View();
        }
        public ActionResult ChartDispaly()
        {
            ChartImage();
            return View();
        }
        public void ChartImage() {
        IEnumerable<Product> productList = new List<Product> {
        new Product {Name = "Kayak", Category = "Watersports", Price = 275m},
        new Product {Name = "Lifejacket", Category = "Watersports", Price = 48.95m},
        new Product {Name = "Soccer ball", Category = "Football", Price = 19.50m},
        new Product {Name = "Corner flags", Category = "Football", Price = 34.95m},
        new Product {Name = "Stadium", Category = "Football", Price = 150m},
        new Product {Name = "Thinking cap", Category = "Chess", Price = 16m}
        };
        Chart chart = new Chart(400, 200,
        @"<Chart BackColor=""Gray"" BackSecondaryColor=""WhiteSmoke""
        BackGradientStyle=""DiagonalRight"" AntiAliasing=""All""
        BorderlineDashStyle = ""Solid"" BorderlineColor = ""Gray"">
        <BorderSkin SkinStyle = ""Emboss"" />
        <ChartAreas>
            <ChartArea Name=""Default"" _Template_=""All"" BackColor=""Wheat""
        BackSecondaryColor=""White"" BorderColor=""64, 64, 64, 64""
        BorderDashStyle=""Solid"" ShadowColor=""Transparent"">
        </ChartArea>
        </ChartAreas>
        </Chart>");
        chart.AddSeries(
        chartType: "Pie",
        yValues: productList.Select(e => e.Price).ToArray(),
        xValue: productList.Select(e => e.Name).ToArray()    
        );
        chart.Write();
   }

    }
   }

* 型号 *****

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MvcApp.Models
{
public class Product
{
    public string Name { get; set; }
    public string Category { get; set; }
    public decimal Price { get; set; }
  }
}