HighCharts Database - MVC 3

I work with DotNet.Highcharts in Visual Studio 2010. I am creating an MVC 3 web application. I can get HighCharts to work by statically assigning data. I would like to be able to send data from a database to HighCharts for display.

Is it possible to create a class for data management, and then send the class to HighCharts? If so, can someone tell me how to do this? Also, if someone has a working draft that demonstrates this and is willing to share it, it will be awesome.

I saw someone post below class in another question. however, I don't know how to use it or send a class in a 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'm building a web application to display information from data collected through solar monitoring. Thus, it will be power, voltage, current, etc., grouped by combiner, inverter, etc. I believe that this is X and Y data. However, if it would be easier to code through an array of objects, then I am all for it. Hope this answers your question. The following are the model classes that I have for the data. I did not fully cope with them. I still need to add validation and change fields that reference other tables. To associate the combiner_id field in the power_string class with the id field in the power_combiner class, I would 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

Below is the code that I have. I'm having problems converting dates. GetTotalMilliseconds does not exist in the current context. Does this come from HighCharts scripts or is it from some other namespace that I need to include? Also, does it look like I'm using the data context correctly to assign data to a chart? I changed the value of x to the identifier of the combiner:

 .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 the error message. Error: Failed to enter type "System.Int32" for input "DotNet.Highcharts.Helpers.Number". LINQ to Entities only supports listing of Entity Data Model primitive data 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); } } } 
+4
source share
1 answer

As I understand it, you need a diagram to display all of your values ​​(temperature, voltage, current, etc.). I also see that in the model you have recordTime, which can be your xAxis. Here is a sample 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 will be the following chart: enter image description here

The second chart that may be of interest to you is the column chart, which compares the current values ​​from two dimensions with the recorded time. Here is a sample 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: enter image description here

I hope this will be helpful to you.

+4
source

Source: https://habr.com/ru/post/1400102/


All Articles