Добавление нескольких рядов в сплайн-диаграмму с использованием высоких диаграмм dotnet в asp.net mvc3

Я использую высокие диаграммы dotnet с asp.net mvc3. Я столкнулся с проблемой добавления нескольких серий в сплайн-диаграмму.

Этот код в основном обновляет диаграмму каждую секунду.

Это работает для одного ряда данных. Но мне нужно добавить несколько рядов данных.

Пожалуйста, помогите мне добавить несколько серий для этого кода.

заранее спасибо

public ActionResult SplineUpdateEachSecond()
{
     List<object> points = new List<object>(20);
     DateTime now = DateTime.Now;
     Random rand = new Random();
     for (int i = -19; i <= 0; i++)
          points.Add(new { X = now.AddSeconds(i), Y = rand.NextDouble() });

     Highcharts chart = new Highcharts("chart")
            .SetOptions(new GlobalOptions { Global = new Global { UseUTC = false } })
            .InitChart(new Chart
                       {
                           DefaultSeriesType = ChartTypes.Spline,
                           MarginRight = 10,
                           Events = new ChartEvents
                                    {
                                        Load = "ChartEventsLoad"
                                    }
                       })
            .AddJavascripFunction("ChartEventsLoad",
                                  @"// set up the updating of the chart each second
                                   var series = this.series[0];
                                   setInterval(function() {
                                      var x = (new Date()).getTime(), // current time
                                         y = Math.random();
                                      series.addPoint([x, y], true, true);
                                   }, 1000);")
            .SetTitle(new Title { Text = "Live random data" })
            .SetXAxis(new XAxis
                      {
                          Type = AxisTypes.Datetime,
                          TickPixelInterval = 150
                      })
            .SetYAxis(new YAxis
                      {
                          Title = new YAxisTitle { Text = "Value" },
                          PlotLines = new[]
                                      {
                                          new YAxisPlotLines
                                          {
                                              Value = 0,
                                              Width = 1,
                                              Color = ColorTranslator.FromHtml("#808080")
                                          }
                                      }
                      })
            .SetTooltip(new Tooltip { Formatter = "TooltipFormatter" })
            .AddJavascripFunction("TooltipFormatter",
                                  @"return '<b>'+ this.series.name +'</b><br/>'+
                                   Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'<br/>'+ 
                                   Highcharts.numberFormat(this.y, 2);")
            .SetLegend(new Legend { Enabled = false })
            .SetExporting(new Exporting { Enabled = false })
            .SetSeries(new Series
                       {
                           Name = "Random data",
                           Data = new Data(points.ToArray())
                       });

        return View(chart);
}

c# charts asp.net-mvc highcharts dotnethighcharts
person Bhairav Gooli    schedule 31.10.2012    source источник
comment
Просто примечание: DotNetHighcharts не обновлялся с апреля 2012 года. Это означает, что все новые функции HighCharts не включены. Также обратите внимание, что поддержка HighStock недоступна в этой оболочке .NET. Возможно, вам лучше всего свернуть свою собственную обертку.   -  person wergeld    schedule 31.10.2012

Ответы (1)


arrow_upward
2
arrow_downward

Примеры приведены здесь.

Предположим, что есть класс, который возвращает серию, как показано ниже:

public class ChartsData
{
     //public static Series Hestavollane
     //public static Series Voll 
}

Первая серия:

public static Series Hestavollane = new Series
                                    {
                                        Name = "Hestavollane",
                                        Data = new Data(new object[]
                                                       {
                                                            4.3, 5.1, 4.3, 5.2, 5.4, 4.7, 3.5, 4.1, 5.6, 7.4, 6.9, 7.1,
                                                            7.9, 7.9, 7.5, 6.7, 7.7, 7.7, 7.4, 7.0, 7.1, 5.8, 5.9, 7.4,
                                                            8.2, 8.5, 9.4, 8.1, 10.9, 10.4, 10.9, 12.4, 12.1, 9.5, 7.5,
                                                            7.1, 7.5, 8.1, 6.8, 3.4, 2.1, 1.9, 2.8, 2.9, 1.3, 4.4, 4.2,
                                                            3.0, 3.0
                                                       })
                                    };

Вторая серия:

public static Series Voll = new Series
                            {
                                Name = "Voll",
                                Data = new Data(new object[]
                                                {
                                                    0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.1, 0.0, 0.3, 0.0,
                                                    0.0, 0.4, 0.0, 0.1, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0,
                                                    0.0, 0.6, 1.2, 1.7, 0.7, 2.9, 4.1, 2.6, 3.7, 3.9, 1.7, 2.3,
                                                    3.0, 3.3, 4.8, 5.0, 4.8, 5.0, 3.2, 2.0, 0.9, 0.4, 0.3, 0.5, 0.4
                                                })
                            };

Применение к графику

.SetSeries(new[] { ChartsData.Hestavollane, ChartsData.Voll })
person AliRıza Adıyahşi    schedule 31.10.2012