Gallery
JS Vol Bars
<%@ Page Language="C#" Description="dotnetCHARTING Component" %>
<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING" %>
<%@ Import Namespace="System.Drawing" %>
<script runat="server">
void Page_Load(Object sender, EventArgs e)
{
// Demonstrates Financial bars and volume chart area with JSC Navigator.
// Set the directory temp directory
Chart.TempDirectory = "temp";
Chart.Debug = true;
//Enable JSC
Chart.JS.Enabled = true;
// Enable Navigator
Chart.Navigator.Enabled = true;
Chart.YAxis.FormatString = "C0";
Chart.YAxis.Label.Text = "Price";
// Set the financial chart type
Chart.DefaultSeries.Type = SeriesTypeFinancial.Bar;
// Set he chart size.
Chart.Width = 600;
Chart.Height = 350;
SeriesCollection sc = getData();
// Add the random data.
Chart.SeriesCollection.Add(sc[0]);
ChartArea ca = new ChartArea(sc[1]);
Chart.ExtraChartAreas.Add(ca);
ca.YAxis.Label.Text = "Volume";
ca.HeightPercentage = 35;
}
private SeriesCollection getData()
{
SeriesCollection SC = new SeriesCollection();
Random myR = new Random();
for (int i = 0; i < 2; i++)
{
Series s = new Series();
if (i == 0)
{
s.Name = "X Company Price";
}
else
{
s.Name = "Volume";
s.Type = SeriesType.Bar;
}
double startPrice = 50;
DateTime startDT = new DateTime(2021, 1, 1);
for (int b = 1; b < 76; b++)
{
Element e = new Element();
e.XDateTime = startDT;
startDT = startDT.AddDays(1);
if (i == 0)
{
if (myR.Next(10) > 5)
startPrice += myR.Next(5);
else
startPrice -= myR.Next(3);
e.Close = startPrice;
e.Volume = myR.Next(100);
if (myR.Next(10) > 5)
e.Open = startPrice + myR.Next(6);
else
e.Open = startPrice - myR.Next(6);
if (e.Open > e.Close)
{
e.High = e.Open + myR.Next(6);
e.Low = e.Close - myR.Next(6);
}
else
{
e.High = e.Close + myR.Next(6);
e.Low = e.Open - myR.Next(6);
}
}
else
{
e.YValue = 1000000 + myR.Next(1000000);
}
s.Elements.Add(e);
}
SC.Add(s);
}
return (SC);
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Gallery Sample</title>
</head>
<body>
<div align="center">
<dotnet:Chart ID="Chart" runat="server" />
</div>
</body>
</html>
<%@ Page Language="vb" Description="dotnetCHARTING Component" %>
<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING" %>
<%@ Import Namespace="System.Drawing" %>
<script runat="server">
Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
' Demonstrates Financial bars and volume chart area with JSC Navigator.
' Set the directory temp directory
Chart.TempDirectory = "temp"
Chart.Debug = True
'Enable JSC
Chart.JS.Enabled = True
' Enable Navigator
Chart.Navigator.Enabled = True
Chart.YAxis.FormatString = "C0"
Chart.YAxis.Label.Text = "Price"
' Set the financial chart type
Chart.DefaultSeries.Type = SeriesTypeFinancial.Bar
' Set he chart size.
Chart.Width = 600
Chart.Height = 350
Dim sc As SeriesCollection = getData()
' Add the random data.
Chart.SeriesCollection.Add(sc(0))
Dim ca As ChartArea = New ChartArea(sc(1))
Chart.ExtraChartAreas.Add(ca)
ca.YAxis.Label.Text = "Volume"
ca.HeightPercentage = 35
End Sub
Private Function getData() As SeriesCollection
Dim SC As SeriesCollection = New SeriesCollection()
Dim myR As Random = New Random()
For i As Integer = 0 To 1
Dim s As Series = New Series()
If i = 0 Then
s.Name = "X Company Price"
Else
s.Name = "Volume"
s.Type = SeriesType.Bar
End If
Dim startPrice As Double = 50
Dim startDT As DateTime = New DateTime(2021, 1, 1)
For b As Integer = 1 To 75
Dim e As Element = New Element()
e.XDateTime = startDT
startDT = startDT.AddDays(1)
If i = 0 Then
If myR.Next(10) > 5 Then
startPrice += myR.Next(5)
Else
startPrice -= myR.Next(3)
End If
e.Close = startPrice
e.Volume = myR.Next(100)
If myR.Next(10) > 5 Then
e.Open = startPrice + myR.Next(6)
Else
e.Open = startPrice - myR.Next(6)
End If
If e.Open > e.Close Then
e.High = e.Open + myR.Next(6)
e.Low = e.Close - myR.Next(6)
Else
e.High = e.Close + myR.Next(6)
e.Low = e.Open - myR.Next(6)
End If
Else
e.YValue = 1000000 + myR.Next(1000000)
End If
s.Elements.Add(e)
Next b
SC.Add(s)
Next i
Return (SC)
End Function
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Gallery Sample</title>
</head>
<body>
<div align="center">
<dotnet:Chart ID="Chart" runat="server" />
</div>
</body>
</html>
- Sample FilenameGallery/qf3.aspx
- Version8.0
- Uses DatabaseNo