1

我是 MVC3 的新手,我正在尝试弄清楚如何使用 dotnet.highcharts。顺便说一句,我已经阅读了几篇文章,但似乎没有任何帮助。我尝试使用从 codeplex 下载的简单示例。即使通过复制和粘贴,我什至无法让它工作。我很少在论坛上注册,我主要只是寻找答案。我通常不会遇到太多麻烦,我很抱歉不得不问这样的问题,但我需要帮助。我想做的只是简单地创建一个图表。我将发布我的代码任何帮助将不胜感激。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using DotNet.Highcharts.Options;
using DotNet.Highcharts.Helpers;
using DotNet.Highcharts.Enums;
using DotNet.Highcharts;

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

            return View();
    }

    public ActionResult About()
    {
        return View();
    }

    public ActionResult PartialChart()
    {
        Highcharts chart = new Highcharts("chart")
            .InitChart(new Chart { DefaultSeriesType = ChartTypes.Bar })
            .SetTitle(new Title { Text = "Stacked bar chart" })
            .SetXAxis(new XAxis { Categories = new[] { "Apples", "Oranges", "Pears", "Grapes", "Bananas" } })
            .SetYAxis(new YAxis
            {
                Min = 0,
                Title = new YAxisTitle { Text = "Total fruit consumption" }
            })
            .SetTooltip(new Tooltip { Formatter = "function() { return ''+ this.series.name +': '+ this.y +''; }" })
            .SetPlotOptions(new PlotOptions { Bar = new PlotOptionsBar { Stacking = Stackings.Normal } })
            .SetSeries(new[]
                       {
                           new Series { Name = "John", Data = new Data(new object[] { 5, 3, 4, 7, 2 }) },
                           new Series { Name = "Jane", Data = new Data(new object[] { 2, 2, 3, 2, 1 }) },
                           new Series { Name = "Joe", Data = new Data(new object[] { 3, 4, 4, 2, 5 }) }
                       });

        return PartialView(chart);
    }
}
}

这是部分视图:

@model DotNet.Highcharts.Highcharts

@(Model)

这是索引页面:

@{
    ViewBag.Title = "Home Page";
}

<h2>@ViewBag.Message</h2>
<p>
    To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET     MVC Website">http://asp.net/mvc</a>.
</p>
<p>
@Html.Action("PartialChart", "Home")
@Html.Partial("PartialChart")
</p>

这是母版页:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript">    </script>
    <script src="@Url.Content("~/Scripts/highcharts.js")" type="text/javascript">    </script>
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
</head>
<body>
    <div class="page">
        <header>
            <div id="title">
                <h1>My MVC Application</h1>
            </div>
            <div id="logindisplay">
                @Html.Partial("_LogOnPartial")
            </div>
            <nav>
                <ul id="menu">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li>@Html.ActionLink("About", "About", "Home")</li>
                </ul>
            </nav>
        </header>
        <section id="main">
            @RenderBody()
        </section>
        <footer>
        </footer>
    </div>
</body>
</html>
4

1 回答 1

3

在朋友的帮助下,我得到了答案。以防万一外面有人还在乎。问题是对 Highcharts 脚本的引用。这些脚本的位置与示例中列出的不同,并且完全没有注意到我没有注意到。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title</title>
        <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
        <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")"   type="text/javascript">    </script>
        <script src="@Url.Content("~/Scripts/Highcharts-2.2.1/js/highcharts.js")" type="text/javascript">      </script>
        <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
    </head>
    <body>
        <div class="page">
            <header>
                <div id="title">
                    <h1>My MVC Application</h1>
                </div>
                <div id="logindisplay">
                    @Html.Partial("_LogOnPartial")
                </div>
                <nav>
                    <ul id="menu">
                        <li>@Html.ActionLink("Home", "Index", "Home")</li>
                        <li>@Html.ActionLink("About", "About", "Home")</li>
                    </ul>
                </nav>
            </header>
            <section id="main">
                @RenderBody()
            </section>
            <footer>
            </footer>
        </div>
    </body>
</html>
于 2012-08-28T00:14:16.783 回答