javascript - 具有数据库连接的 ASP.NET MVC 中的 HighChart

Question

我对 ASP.NET MVC 非常陌生，我尝试使用 Visual Studio 2015 将数据库中的数据显示到 Highchart 中。我的 Controller 中有以下代码来从数据库获取数据:

namespace HelloWorld.Controllers
{
    public class SecondlyReadingDatasController : ApiController
    {

        private cloudsqlEntities db = new cloudsqlEntities();

        // GET: api/SecondlyReadingDatas
        public IQueryable<SecondlyReading> GetSecondlyReadings()
        {
            SecondlyReading sec = db.SecondlyReadings.First();
            return db.SecondlyReadings;
        }

这是我的模型:

namespace HelloWorld.Models
{
    using System;
    using System.Collections.Generic;

    public partial class SecondlyReading
    {
        public int Id { get; set; }
        public int ChannelID { get; set; }
        public string TimeStamp { get; set; }
        public double RMSVoltage { get; set; }
        public double Frequency { get; set; }
        public double RMSCurrent { get; set; }
        public double RealPower { get; set; }
        public double ReactivePower { get; set; }
        public double ApparentPower { get; set; }
        public double PowerFactor { get; set; }
        public string DeviceId { get; set; }
    }
}

当我在浏览器中键入/api/SecondlyReadingDatas 时，我可以获取 json 格式的数据，但是，我的目标是使用 Highcharts 将该数据绘制成折线图。我确实知道需要实现类似以下代码才能查看折线图中的数据:

<script type="text/javascript">
$.ajax({
  url: 'http://localhost/TestWebsite/api/SecondlyReadingDatas',
  success: function(singleSeries) {
    Highcharts.chart('container', {
      series: [singleSeries]
    });
  }
});
</script>

我还在我的项目中安装了 DotNet.HighChart:

我有两个主要问题:

• 从下载 Highchart 库有什么区别吗？ 网站，然后将在 Visual Studio 中引用该网站 在 Visual Studio 本身中安装 DotNet.HighChart？
• 我应该将 <script type="text/javascript"> 放在哪个文件中？ 模型、 Controller 还是_Layout.cshtml？

Answer 1

问题1

DotNet.HighCharts包装包括js您可以根据应用程序使用它们的文件。

问题2

您始终应该添加 <script type="text/javascript">在View (客户端)。 Model和Controller用于服务器端。

参见this article有关 Highcharts 的更多信息在 ASP.NET MVC 中。