2012-10-31 82 views
1

我使用的是帶有asp.net mvc3的dotnet高圖。我在向樣條圖添加多個系列時遇到問題。在asp.net中使用dotnet高圖將多個系列添加到樣條圖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); 
} 
+0

請注意:自2012年4月起,DotNetHighcharts尚未更新。這意味着HighCharts中的所有新功能都不包含在內。另請注意,HighStock支持在這個.NET包裝中不可用。您可能最適合推出自己的包裝。 – wergeld

回答

2

有在here例子。

假設,有一個像下面返回系列類:

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 }) 
相關問題