AxisTick year = new AxisTick(); year.Label.Text = "%min"; Chart.XAxis.ExtraTicks.Add(year); Chart.JS.Settings.Add("xAxis.customTicks.2.value_pattern", "year");
// *DYNAMIC DATA NOTE* // This sample uses random data to populate the chart. To populate // a chart with database data see the following resources: // - Classic samples folder // - Help File > Data Tutorials // - Sample: features/DataEngine.aspx SeriesCollection mySC = getRandomData(); // Add the random data. Chart.SeriesCollection.Add(mySC);
} SeriesCollection getRandomData() { SeriesCollection SC = new SeriesCollection(); Random myR = new Random(1); DateTime dt = new DateTime(2016,1,1); for(int a = 1; a < 2; a++) { Series s = new Series(); s.Name = "Series " + a.ToString(); for(int b = 1; b < 13; b++) { Element e = new Element(); e.YValue = myR.Next(40, 80); e.XDateTime = dt = dt.AddMonths(3);
s.Elements.Add(e); } SC.Add(s); } return SC; } </script> <script type="text/javascript"> function qTickText(v){ return dateToQuarter(v[0]);} function dateToQuarter(d){ d = new Date(d); return 'Q'+(Math.floor(d.getMonth() / 3)+1); } </script> </head> <body> <div align="center"> <dotnet:Chart id="Chart" runat="server" Width="568px" Height="344px"> </dotnet:Chart> </div> </body> </html>
Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) ' This sample deomonstrates interval calendar pattern ranges on a time scale axis. Chart.Type = ChartType.Combo Chart.Size = "800x350" Chart.TempDirectory = "temp" Chart.Debug = False Chart.Title = "Apple iPhone sales (in million units)" Chart.JS.Enabled = True Chart.JS.AxisToZoom = "X" Chart.DefaultSeries.Type = SeriesType.Line
Dim month As AxisTick = New AxisTick() month.Label.Text = "%min" Chart.XAxis.ExtraTicks.Add(month) Chart.JS.Settings.Add("xAxis.customTicks.0.value_pattern", "month")
Dim quarter As AxisTick = New AxisTick() quarter.Label.Text = "js:qTickText" Chart.XAxis.ExtraTicks.Add(quarter) Chart.JS.Settings.Add("xAxis.customTicks.1.value_pattern", "quarter")
Dim year As AxisTick = New AxisTick() year.Label.Text = "%min" Chart.XAxis.ExtraTicks.Add(year) Chart.JS.Settings.Add("xAxis.customTicks.2.value_pattern", "year")
' *DYNAMIC DATA NOTE* ' This sample uses random data to populate the chart. To populate ' a chart with database data see the following resources: ' - Classic samples folder ' - Help File > Data Tutorials ' - Sample: features/DataEngine.aspx Dim mySC As SeriesCollection = getRandomData() ' Add the random data. Chart.SeriesCollection.Add(mySC)
End Sub Function getRandomData() As SeriesCollection Dim SC As SeriesCollection = New SeriesCollection() Dim myR As Random = New Random(1) Dim dt As DateTime = New DateTime(2016,1,1) For a As Integer = 1 To 1 Dim s As Series = New Series() s.Name = "Series " & a.ToString() For b As Integer = 1 To 12 Dim e As Element = New Element() e.YValue = myR.Next(40, 80) dt = dt.AddMonths(3) e.XDateTime = dt
s.Elements.Add(e) Next b SC.Add(s) Next a Return SC End Function </script> <script type="text/javascript"> function qTickText(v){ return dateToQuarter(v[0]);} function dateToQuarter(d){ d = new Date(d); return 'Q'+(Math.floor(d.getMonth() / 3)+1); } </script> </head> <body> <div align="center"> <dotnet:Chart id="Chart" runat="server" Width="568px" Height="344px"> </dotnet:Chart> </div> </body> </html>
Previous