Question

我是ASP.Net MVC的新手，我正在做一个项目，我必须使用数据库显示图表。假设数据库“Average”中有一个字段。如果我们针对某个特定用户ID找到4条记录，那么图形应该像4条形图，x轴上的每条形条代表1 2 3 4的数字，而在y轴上，应该是平均值。我尝试了很多东西，比如高级图表，但它不起作用，它给出了错误“无法找到DotNet（你是否缺少汇编参考）”。我搜索过它并得到了.net框架的问题。但老实说，我没有建立图表。我试过网络助手，通过这个我刚刚创建了一个图形图像，但不知道与数据库的热连接。

我试过但仍然没有使用highcharts 这是我的行动方法

 public ActionResult Index()
        {
            Highcharts chart = new DotNet.Highcharts.Highcharts("chart")
           .SetXAxis(new XAxis
                       {
                           Categories = new[] { "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" }
                       })
           .SetSeries(new Series
                       {
                           Data = new Data(new object[] { 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4 })
                       });

            return View(chart);

        }

这是我的view.cshtml

@model DotNet.Highcharts.Highcharts
@{
    ViewBag.Title = "Index";
}
<header>
    <script src="~/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="~/Scripts/highcharts.js" type="text/javascript"></script>
</header>



@(Model)

所以请有人举例说明代码。我将不胜感激。

Answer 1

您可以按照这个简单的教程DotNet.Hightcharts。

这里有一些例子DotNet.Highcharts 4.0 with Examples。

这是一个有效的例子：

控制人员的行动

public virtual ActionResult GetWorkloadChart()
{          
    var chart = ConstructChart();
    return View("WorkloadChart", chart);
}

构建图表

    private static Highcharts ConstructChart()
    {
        var title = new Title() {Text = "Workload"};

        var subtitle = new Subtitle() {Text = "workload per day"};
        //You can get these values from database
        var XData = new[]        { "25", "26", "27", "28", "29", "30", "31", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12"};
        var YData = new object[] {  195,  150,    0,  270,    0,   90,  245,  215,  350,  355,  190,   95,    0,  100,  225};

        var xaxisTitle = new XAxisTitle { Text = "Wokload in minutes" };
        var yaxisTitle = new YAxisTitle { Text = "Time in days" };

        string serieName = "Workload per day";

        Highcharts chart = new Highcharts("chart")
            .SetTitle(title)
            .SetSubtitle(subtitle)
            .SetXAxis(new XAxis
                {
                    Categories = XData,
                    Title = xaxisTitle               
                })
            .SetYAxis(new YAxis
                {
                    Title = yaxisTitle
                })
            .SetSeries(new Series
                {
                    Data = new Data(YData),
                    Name = serieName               
                });

        return chart;
    }

查看

@model DotNet.Highcharts.Highcharts

    @{
        ViewBag.Title = "WorkloadChart";
    }

    <script src="~/Scripts/jquery-1.7.1.js" type="text/javascript"></script>
    <script src="~/Scripts/Highcharts-2.2.1/js/highcharts.js" type="text/javascript"></script>


    <h2>Workload Chart</h2>

    @Model

请记住添加： hightcharts.js

应该渲染到这样的东西：

Chart

如何使用数据库在MVC 4中显示图形/图表？

1 个答案: