HighCharts - MVC 3数据库 [英] HighCharts -- MVC 3 Database

查看:122
本文介绍了HighCharts - MVC 3数据库的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在Visual Studio 2010中使用DotNet.Highcharts。我正在创建一个MVC 3 Web应用程序。我可以通过静态分配数据来获得HighCharts的工作。我希望能够将数据从数据库发送到HighCharts进行显示。



我可以创建一个类来控制数据,然后将该类发送到HighCharts?如果是这样,谁能告诉我该怎么做?此外,如果有人有一个工作项目,证明这一点,并愿意分享,这将是非常棒的。



我看到有人在另一个问题上发布了下面的课程。但是,我不知道如何使用它或将该类发送到HighCharts脚本。任何帮助将不胜感激。

  class HighChartsPoint 
{
public double x {set; get;}
public double y {set; get;}
public string color {set; get;}
public string id {set; get;}
public string name {set; get;}
public bool sliced {set; get;}
}

编辑



好的,我正在构建一个Web应用程序,以显示从太阳能监控收集的数据中的信息。所以它将由功率,电压,电流等组合,逆变器等组成。我相信这将是X和Y数据。但是,如果通过一个对象数组进行编码会更简单,那我就是为了它。我希望能回答你的问题。以下是我对数据的模型类。我没有完全做到。我仍然需要添加验证并更改链接到其他表的字段。要将power_string类中的combiner_id字段链接到power_combiner类中的id字段,我将使用:public virtual power_combiner combiner_id {get;组; }

  public class AESSmartEntities:DbContext 
{
public DbSet< power_combiner> PowerCombiners {get;组; }
public DbSet< power_combinerhistory> PowerCombinerHistorys {get;组; }
public DbSet< power_coordinator> PowerCoordinators {get;组; }
public DbSet< power_installation> PowerInstallations {get;组; }
public DbSet< power_inverter> PowerInverters {get;组; }
public DbSet< power_string> PowerStrings {get;组; }
public DbSet< power_stringhistory> PowerStringHistorys {get;组; }
}

public class power_combiner
{
[ScaffoldColumn(false)]
public int id {get;组; }

[必填]
[DisplayName(Name)]
[StringLength(128,ErrorMessage =The name'不能超过128个字符)]
public string name {get;组; }
$ b $ [必填]
[DisplayName(Mac地址)]
[StringLength(24,ErrorMessage ='mac'不能超过24个字符)]
public string mac {get;组; }
$ b $ [DisplayName(Location)]
[StringLength(512,ErrorMessage =The name'不能超过512个字符)]
public string location {得到;组; }

[DisplayName(power_installation)]
public int? installation_id {get;组; }

[DisplayName(power_inverter)]
public int? inverter_id {get;组; }

[DisplayName(power_coordinator)]
public int coordinator_id {get;组; }

[DisplayName(Installation ID)]
public virtual power_installation installation_ {get;组; }
$ b $ [DisplayName(Inverter ID)]
public virtual power_inverter inverter_ {get;组; }

[DisplayName(Coordinator ID)]
public virtual power_coordinator coordinator_ {get;组; }
}

public class power_combinerhistory
{
[ScaffoldColumn(false)]
public int id {get;组; }

[必需的]
[DisplayName(Voltage)]
public double voltage {get;组; }

[必需]
[DisplayName(Current)]
public double current {get;组; }

[必需的]
[DisplayName(Temperature)]
public double temperature {get;组; }

[必需]
[DisplayName(DateTime)]
public DateTime recordTime {get;组; }

[必需]
[DisplayName(power_combiner)]
public int combiner_id {get;组; }

[DisplayName(Combiner ID)]
public virtual power_combiner combiner_ {get;组; }
}

public class power_coordinator
{
[ScaffoldColumn(false)]
public int id {get;组; }
$ b $ [必填]
[DisplayName(Mac地址)]
[StringLength(24,ErrorMessage ='mac'不能超过24个字符)]
public string mac {get;组; }

[必需的]
[DisplayName(Report Time)]
public DateTime reportTime {get;组; }
$ b $ [必需的]
[DisplayName(Command)]
[StringLength(2,ErrorMessage =The'command'不能超过2个字符)]
public string command {get;组; }

[必需的]
[DisplayName(Collect Time)]
public int collect_time {get;组; }

[必需]
[DisplayName(Interval Time)]
public int interval_time {get;组; }

[DisplayName(power_installation)]
public int? installation_id {get;组; }

[DisplayName(Installation ID)]
public virtual power_installation installation_ {get;组; }
}

public class power_installation
{
[ScaffoldColumn(false)]
public int id {get;组; }

[必填]
[DisplayName(Name)]
[StringLength(128,ErrorMessage =The name'不能超过128个字符)]
public string name {get;组; }
$ b $ [必需的]
[DisplayName(UUID)]
[StringLength(36,ErrorMessage ='uuid'不能超过36个字符)]
public string uuid {get;组; }
$ b $ [DisplayName(Description)]
[StringLength(512,ErrorMessage =The description'不能超过512个字符)]
public string description {得到;组; }

[DisplayName(History Time)]
public int historytime {get;组; }
}

public class power_inverter
{
[ScaffoldColumn(false)]
public int id {get;组; }

[必填]
[DisplayName(Name)]
[StringLength(128,ErrorMessage =The name'不能超过128个字符)]
public string name {get;组; }
$ b $ [必需的]
[DisplayName(UUID)]
[StringLength(36,ErrorMessage ='uuid'不能超过36个字符)]
public string uuid {get;组; }
$ b $ [必填]
[DisplayName(Location)]
[StringLength(512,ErrorMessage =The'location'不能超过512个字符)]
public string location {get;组; }

[DisplayName(power_installation)]
public int installation_id {get;组; }

[DisplayName(power_coordinator)]
public int coordinator_id {get;组; }

[DisplayName(Installation ID)]
public virtual power_installation installation_ {get;组; }

[DisplayName(Coordinator ID)]
public virtual power_coordinator coordinator_ {get;组; }
}

public class power_string
{
[ScaffoldColumn(false)]
public int id {get;组; }
$ b $ [必需的]
[DisplayName(UUID)]
[StringLength(36,ErrorMessage ='uuid'不能超过36个字符)]
public string uuid {get;组; }

[必需]
[DisplayName(Position)]
public int position {get;组; }
$ b $ [DisplayName(Name)]
[StringLength(128,ErrorMessage =The name'不能超过128个字符)]
public string name {得到;组; }
$ b $ [DisplayName(Location)]
[StringLength(512,ErrorMessage =The'location'不能超过512个字符)]
public string location {得到;组; }

[必需]
[DisplayName(power_combiner)]
public int combiner_id {get;组; }

[DisplayName(Combiner ID)]
public virtual power_combiner combiner_ {get;组; }
}

public class power_stringhistory
{
[ScaffoldColumn(false)]
public int id {get;组; }

[必需]
[DisplayName(Current)]
public double current {get;组; }

[必需]
[DisplayName(Record Time)]
public DateTime recordTime {get;组; }

[必需的]
[DisplayName(power_string)]
public int string_id {get;组; }

[DisplayName(String ID)]
public virtual power_string string_ {get;组; }
}

编辑 $ b

下面的代码就是我所拥有的。我在转换日期时遇到问题。 GetTotalMilliseconds在当前上下文中不存在。这是来自HighCharts脚本还是来自我需要包含的其他名称空间?此外,它看起来像我正确使用数据上下文将数据分配给图表?我将x值更改为组合ID:

  .SetSeries(new [] 
{
new Series
{
Name =Combiner,
YAxis = 0,
Data = new Data(powercombinerhistorys.Select(mm => new Point {X = mm.combiner_id, Y = mm.current})。ToArray())
}
});

,但我仍然遇到错误。错误是:
无法强制类型'System.Int32'键入'DotNet.Highcharts.Helpers.Number'。 LINQ to Entities只支持投射实体数据模型原型类型。

  using System; 
使用System.Collections.Generic;
使用System.Linq;
使用System.Web;
使用System.Web.Mvc;
使用System.Drawing;
使用DotNet.Highcharts;
使用DotNet.Highcharts.Enums;
使用DotNet.Highcharts.Helpers;
使用DotNet.Highcharts.Options;
使用Point = DotNet.Highcharts.Options.Point;
使用AESSmart.Models;
使用System.Data;
使用System.Data.Entity;

namespace AESSmart.Controllers
{
public class HighChartsTestController:Controller
{
private AESSmartEntities db = new AESSmartEntities();

public ActionResult CombinerHistoryData()
{
var powercombinerhistorys = db.PowerCombinerHistorys.Include(p => p.combiner_);

Highcharts chart = new Highcharts(chart)
.InitChart(新图表{DefaultSeriesType = ChartTypes.Column})
.SetTitle(新标题{Text =Combiner History })
.SetXAxis(new XAxis {Type = AxisTypes.Datetime})
.SetYAxis(new YAxis
{
Min = 0,
Title = new YAxisTitle {Text =Current}
})
.SetSeries(new []
{
new Series
{
Name =Combiner,
YAxis = 0,
Data = new Data(powercombinerhistorys.Select(x => new Point {X = GetTotalMilliseconds(x.recordTime),Y = x.current})。ToArray())
}
});

return查看(图表);




解决方案

据我所知,你需要一个图表来显示你所有的值(温度,电压,电流等)。另外我在模型中看到你有recordTime,它可以是你的xAxis。以下是示例代码:

  Highcharts chart = new Highcharts(chart)
.InitChart(new Chart { (新的标题{文本=组合历史})
.SetXAxis(新的XAxis {类型= AxisTypes.Datetime})
.SetYAxis(新的[]
{
new YAxis
{
Title = new YAxisTitle {Text =Current},
GridLineWidth = 1
},
new YAxis
{
Labels = new YAxisLabels {Formatter =function(){return this.value +'°C';},},
Title = new YAxisTitle {Text = Temperature},
Opposite = true,
GridLineWidth = 0
},
new YAxis
{
Labels = new YAxisLabels {Formatter =function(){return this.value +'V'; }},
Title = new YAxisTitle {Text =Voltage},
Opposite = true,
GridLineWidth = 0
}
})
.SetSeries(new []
{
new Series
{
Name =Current,
YAxis = 0,
Data = new Data(history .Select(x => new Point {X = GetTotalMilliseconds(x.recordTime),Y = x.current})。ToArray())
},
new Series
{
Name =Temperature,
YAxis = 1,
Data = new Data(history.Select(x => new Point {X = GetTotalMilliseconds(x.recordTime),Y = x。温度}).Tarray())
},
新系列
{
名称=电压,
YAxis = 2,
数据=新数据(history.Select(x => new Point {X = GetTotalMilliseconds(x.recordTime),Y = x.voltage})。ToArray())
}
});

结果如下图所示:

第二张可以让你感兴趣的图表是柱状图将两次测量的当前值与记录的时间进行比较。以下是示例代码:

  Highcharts chart = new Highcharts(chart)
.InitChart(new Chart { (新的Title {Text =Combiner History})
.SetXAxis(new XAxis {Type = AxisTypes.Datetime})
.SetYAxis(new YAxis
{
Min = 0,
Title = new YAxisTitle {Text =Current}
})
.SetSeries(new []
{
new Series
{
Name =Combiner,
YAxis = 0,
Data = new Data(combinerhistories.Select(x => new Point {X = GetTotalMilliseconds(x.recordTime),Y = x.current})。ToArray())
},
new系列
{
Name =String,
YAxis = 0,
Data = new Data(stringhistories.Select(x => new Point {X = GetTotalMilliseconds(x.recordTime),Y = x.current})。ToArray())
}
});

以下是页面上的图表:



我希望这对您有所帮助。


I am working with DotNet.Highcharts in Visual Studio 2010. I am creating a MVC 3 Web Application. I am able to get HighCharts working by statically assigning the data. I would like to be able to send the data from a database to HighCharts for displaying.

Can I create a class to control the data and then send the class to HighCharts? If so, can anyone tell me how to do this? Also, if someone has a working project that demonstrates this and is willing to share that would be awesome.

I saw someone posted the below class in another question. however, I don't know how to use it or send the class to the HighCharts script. Any help would be greatly appreciated.

class HighChartsPoint
{
    public double x {set; get;}
    public double y {set; get;}
    public string color {set; get;}
    public string id {set; get;}
    public string name {set; get;}
    public bool sliced {set; get;}
} 

EDIT

Well, I am building a web application to display the information from data collected from solar monitoring. So it would be power, voltage, current, and etc grouped by combiner, inverter, and etc. I believe that would be X and Y data. However, if it would be simpler to code via an array of object, then I am all for it. I hope that answered your question. Below are the model classes I have for the data. I am not fully done with them. I still need to add validation and change the fields that link to other tables. To link the combiner_id field in the power_string class to the id field in the power_combiner class would I use: public virtual power_combiner combiner_id { get; set; }

public class AESSmartEntities : DbContext
{
    public DbSet<power_combiner> PowerCombiners { get; set; }
    public DbSet<power_combinerhistory> PowerCombinerHistorys { get; set; }
    public DbSet<power_coordinator> PowerCoordinators { get; set; }
    public DbSet<power_installation> PowerInstallations { get; set; }
    public DbSet<power_inverter> PowerInverters { get; set; }
    public DbSet<power_string> PowerStrings { get; set; }
    public DbSet<power_stringhistory> PowerStringHistorys { get; set; }
}

public class power_combiner
{
    [ScaffoldColumn(false)]
    public int id { get; set; }

    [Required]
    [DisplayName("Name")]
    [StringLength(128, ErrorMessage = "The 'name' cannot be longer than 128 characters")]
    public string name { get; set; }

    [Required]
    [DisplayName("Mac Address")]
    [StringLength(24, ErrorMessage = "The 'mac' cannot be longer than 24 characters")]
    public string mac { get; set; }

    [DisplayName("Location")]
    [StringLength(512, ErrorMessage = "The 'name' cannot be longer than 512 characters")]
    public string location { get; set; }

    [DisplayName("power_installation")]
    public int? installation_id { get; set; }

    [DisplayName("power_inverter")]
    public int? inverter_id { get; set; }

    [DisplayName("power_coordinator")]
    public int coordinator_id { get; set; }

    [DisplayName("Installation ID")]
    public virtual power_installation installation_ { get; set; }

    [DisplayName("Inverter ID")]
    public virtual power_inverter inverter_ { get; set; }

    [DisplayName("Coordinator ID")]
    public virtual power_coordinator coordinator_ { get; set; }
}

public class power_combinerhistory
{
    [ScaffoldColumn(false)]
    public int id { get; set; }

    [Required]
    [DisplayName("Voltage")]
    public double voltage { get; set; }

    [Required]
    [DisplayName("Current")]
    public double current { get; set; }

    [Required]
    [DisplayName("Temperature")]
    public double temperature { get; set; }

    [Required]
    [DisplayName("DateTime")]
    public DateTime recordTime { get; set; }

    [Required]
    [DisplayName("power_combiner")]
    public int combiner_id { get; set; }

    [DisplayName("Combiner ID")]
    public virtual power_combiner combiner_ { get; set; }
}

public class power_coordinator
{
    [ScaffoldColumn(false)]
    public int id { get; set; }

    [Required]
    [DisplayName("Mac Address")]
    [StringLength(24, ErrorMessage = "The 'mac' cannot be longer than 24 characters")]
    public string mac { get; set; }

    [Required]
    [DisplayName("Report Time")]
    public DateTime reportTime { get; set; }

    [Required]
    [DisplayName("Command")]
    [StringLength(2, ErrorMessage = "The 'command' cannot be longer than 2 characters")]
    public string command { get; set; }

    [Required]
    [DisplayName("Collect Time")]
    public int collect_time { get; set; }

    [Required]
    [DisplayName("Interval Time")]
    public int interval_time { get; set; }

    [DisplayName("power_installation")]
    public int? installation_id { get; set; }

    [DisplayName("Installation ID")]
    public virtual power_installation installation_ { get; set; }
}

public class power_installation
{
    [ScaffoldColumn(false)]
    public int id { get; set; }

    [Required]
    [DisplayName("Name")]
    [StringLength(128, ErrorMessage = "The 'name' cannot be longer than 128 characters")]
    public string name { get; set; }

    [Required]
    [DisplayName("UUID")]
    [StringLength(36, ErrorMessage = "The 'uuid' cannot be longer than 36 characters")]
    public string uuid { get; set; }

    [DisplayName("Description")]
    [StringLength(512, ErrorMessage = "The 'description' cannot be longer than 512 characters")]
    public string description { get; set; }

    [DisplayName("History Time")]
    public int historytime { get; set; }
}

public class power_inverter
{
    [ScaffoldColumn(false)]
    public int id { get; set; }

    [Required]
    [DisplayName("Name")]
    [StringLength(128, ErrorMessage = "The 'name' cannot be longer than 128 characters")]
    public string name { get; set; }

    [Required]
    [DisplayName("UUID")]
    [StringLength(36, ErrorMessage = "The 'uuid' cannot be longer than 36 characters")]
    public string uuid { get; set; }

    [Required]
    [DisplayName("Location")]
    [StringLength(512, ErrorMessage = "The 'location' cannot be longer than 512 characters")]
    public string location { get; set; }

    [DisplayName("power_installation")]
    public int installation_id { get; set; }

    [DisplayName("power_coordinator")]
    public int coordinator_id { get; set; }

    [DisplayName("Installation ID")]
    public virtual power_installation installation_ { get; set; }

    [DisplayName("Coordinator ID")]
    public virtual power_coordinator coordinator_ { get; set; }
}

public class power_string
{
    [ScaffoldColumn(false)]
    public int id { get; set; }

    [Required]
    [DisplayName("UUID")]
    [StringLength(36, ErrorMessage = "The 'uuid' cannot be longer than 36 characters")]
    public string uuid { get; set; }

    [Required]
    [DisplayName("Position")]
    public int position { get; set; }

    [DisplayName("Name")]
    [StringLength(128, ErrorMessage = "The 'name' cannot be longer than 128 characters")]
    public string name { get; set; }

    [DisplayName("Location")]
    [StringLength(512, ErrorMessage = "The 'location' cannot be longer than 512 characters")]
    public string location { get; set; }

    [Required]
    [DisplayName("power_combiner")]
    public int combiner_id { get; set; }

    [DisplayName("Combiner ID")]
    public virtual power_combiner combiner_ { get; set; }
}

public class power_stringhistory
{
    [ScaffoldColumn(false)]
    public int id { get; set; }

    [Required]
    [DisplayName("Current")]
    public double current { get; set; }

    [Required]
    [DisplayName("Record Time")]
    public DateTime recordTime { get; set; }

    [Required]
    [DisplayName("power_string")]
    public int string_id { get; set; }

    [DisplayName("String ID")]
    public virtual power_string string_ { get; set; }
}

EDIT

The below code is what I have. I am having problems with the conversion of the date. The GetTotalMilliseconds does not exist in the current context. Is that coming from the HighCharts scripts or is that from some other namespace that I need to include? Also, does it look like I am using the data context correctly to assign the data to the chart? I changed the x value to the combiner id:

.SetSeries(new[]
{
    new Series
    {
        Name = "Combiner",
        YAxis = 0,
        Data = new Data(powercombinerhistorys.Select(mm => new Point { X = mm.combiner_id,  Y = mm.current}).ToArray())
    }
});

and I still get an error. The error is: Unable to cast the type 'System.Int32' to type 'DotNet.Highcharts.Helpers.Number'. LINQ to Entities only supports casting Entity Data Model primitive types.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Drawing;
using DotNet.Highcharts;
using DotNet.Highcharts.Enums;
using DotNet.Highcharts.Helpers;
using DotNet.Highcharts.Options;
using Point = DotNet.Highcharts.Options.Point;
using AESSmart.Models;
using System.Data;
using System.Data.Entity;

namespace AESSmart.Controllers
{
    public class HighChartsTestController : Controller
    {
        private AESSmartEntities db = new AESSmartEntities();

        public ActionResult CombinerHistoryData()
        {
            var powercombinerhistorys = db.PowerCombinerHistorys.Include(p => p.combiner_);

            Highcharts chart = new Highcharts("chart")
            .InitChart(new Chart { DefaultSeriesType = ChartTypes.Column })
            .SetTitle(new Title { Text = "Combiner History" })
            .SetXAxis(new XAxis { Type = AxisTypes.Datetime })
            .SetYAxis(new YAxis
            {
                Min = 0,
                Title = new YAxisTitle { Text = "Current" }
            })
            .SetSeries(new[]
                       {
                           new Series
                           {
                               Name = "Combiner",
                               YAxis = 0,
                               Data = new Data(powercombinerhistorys.Select(x => new Point { X = GetTotalMilliseconds(x.recordTime),  Y = x.current}).ToArray())
                           }
                       });

            return View(chart);
        }
    }
}

解决方案

As I understand you need a chart to display all your values (temperature, voltage, current, etc.). Also I see in the model you have recordTime which can be your xAxis. Here is the example code:

Highcharts chart = new Highcharts("chart")
            .InitChart(new Chart { DefaultSeriesType = ChartTypes.Line })
            .SetTitle(new Title { Text = "Combiner History" })
            .SetXAxis(new XAxis { Type = AxisTypes.Datetime })
            .SetYAxis(new[]
                      {
                          new YAxis
                          {
                              Title = new YAxisTitle { Text = "Current" },
                              GridLineWidth = 1
                          },
                          new YAxis
                          {
                              Labels = new YAxisLabels { Formatter = "function() { return this.value +'°C'; }", },
                              Title = new YAxisTitle { Text = "Temperature" },
                              Opposite = true,
                              GridLineWidth = 0
                          },
                          new YAxis
                          {
                              Labels = new YAxisLabels { Formatter = "function() { return this.value +' V'; }" },
                              Title = new YAxisTitle { Text = "Voltage" },
                              Opposite = true,
                              GridLineWidth = 0
                          }
                      })
            .SetSeries(new[]
                       {
                           new Series
                           {
                               Name = "Current",
                               YAxis = 0,
                               Data = new Data(history.Select(x => new Point { X = GetTotalMilliseconds(x.recordTime), Y = x.current}).ToArray())
                           },
                           new Series
                           {
                               Name = "Temperature",
                               YAxis = 1,
                               Data = new Data(history.Select(x => new Point { X = GetTotalMilliseconds(x.recordTime), Y = x.temperature}).ToArray())
                           },
                           new Series
                           {
                               Name = "Voltage",
                               YAxis = 2,
                               Data = new Data(history.Select(x => new Point { X = GetTotalMilliseconds(x.recordTime), Y = x.voltage}).ToArray())
                           }
                       });

And the result is the following diagram:

The second chart which can be interesting for you is the column diagram which compare current values from two measurements with the recorded time. Here is the example code:

Highcharts chart = new Highcharts("chart")
            .InitChart(new Chart { DefaultSeriesType = ChartTypes.Column })
            .SetTitle(new Title { Text = "Combiner History" })
            .SetXAxis(new XAxis { Type = AxisTypes.Datetime })
            .SetYAxis(new YAxis
            {
                Min = 0,
                Title = new YAxisTitle { Text = "Current" }
            })
            .SetSeries(new[]
                       {
                           new Series
                           {
                               Name = "Combiner",
                               YAxis = 0,
                               Data = new Data(combinerhistories.Select(x => new Point { X = GetTotalMilliseconds(x.recordTime), Y = x.current}).ToArray())
                           },
                           new Series
                           {
                               Name = "String",
                               YAxis = 0,
                               Data = new Data(stringhistories.Select(x => new Point { X = GetTotalMilliseconds(x.recordTime), Y = x.current}).ToArray())
                           }
                       });

And here is the chart on the page:

I hope this is helpful for you.

这篇关于HighCharts - MVC 3数据库的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆