Gallery

Gallery > Financial Charts

JS Navigator Chaikin

Demonstrates the use of Chaikin indicators with JS Navigator.

Download Show C# Code Show VB Code

<%@ Page Language="C#" Description="dotnetCHARTING Component" %>

<%@ Register TagPrefix="dotnet" Namespace="dotnetCHARTING" Assembly="dotnetCHARTING" %>
<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="System.Drawing.Drawing2D" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>.netCHARTING Sample</title>
<script runat="server">

void Page_Load(Object sender, EventArgs e)
{

// Demonstrates the use of Chaikin indicators with JS Navigator.
// These indicators measure to what degree on net an asset is being accumulated
// (i.e. brought) or distributed (i.e. sold) by the market as a whole.

// The Financial Chart
Chart.DefaultSeries.DefaultElement.Marker.Type = ElementMarkerType.None;
Chart.TempDirectory = "temp";
Chart.Debug = false;

Chart.Size = "640X700";

//Enable JSC
Chart.JS.Enabled = true;
// Enable Navigator
Chart.Navigator.Enabled = true;

Chart.XAxis.Scale = Scale.Time;

Chart.YAxis.Label.Text = "Price (USD)";
Chart.YAxis.FormatString = "currency";

DataEngine priceDataEngine = new DataEngine();
priceDataEngine.ChartObject = Chart;
priceDataEngine.ChartType = ChartType.Financial;
priceDataEngine.ConnectionString = ConfigurationManager.AppSettings["DNCConnectionString"];
priceDataEngine.DateGrouping = TimeInterval.Day;
priceDataEngine.StartDate = new DateTime(2022, 1, 1);
priceDataEngine.EndDate = new DateTime(2022, 4, 1);
priceDataEngine.SqlStatement = @"SELECT TransDate, HighPrice, LowPrice, OpenPrice, ClosePrice, Volume FROM FinancialCompany WHERE TransDate >= #STARTDATE# AND TransDate <= #ENDDATE# ORDER BY TransDate DESC";
priceDataEngine.DataFields = "xAxis=TransDate,High=HighPrice,Low=LowPrice,Open=OpenPrice,Close=ClosePrice,Volume=Volume";

SeriesCollection sc = priceDataEngine.GetSeries();
Series prices = null;
if (sc.Count > 0)
prices = sc[0];
else
return;

prices.Type = SeriesTypeFinancial.CandleStick;

CalendarPattern cp = new CalendarPattern(TimeInterval.Day, TimeInterval.Week, "0000001");
prices.Trim(cp, ElementValue.XDateTime);
prices.Name = "Prices";
Chart.SeriesCollection.Add(prices);

Chart.ChartAreaLayout.Mode = ChartAreaLayoutMode.Vertical;

// Create the second chart area
ChartArea volumeChartArea = new ChartArea();
volumeChartArea.YAxis.Label.Text = "Volume";
volumeChartArea.HeightPercentage = 20;
Chart.ExtraChartAreas.Add(volumeChartArea);

// Add a volume series to the chart area
DataEngine volumeDataEngine = new DataEngine();
volumeDataEngine.ConnectionString = ConfigurationManager.AppSettings["DNCConnectionString"];
volumeDataEngine.DateGrouping = TimeInterval.Days;
volumeDataEngine.StartDate = new DateTime(2022, 1, 1);
volumeDataEngine.EndDate = new DateTime(2022, 4, 1);
volumeDataEngine.SqlStatement = @"SELECT TransDate,Volume FROM FinancialCompany WHERE TransDate >= #STARTDATE# AND TransDate <= #ENDDATE# ORDER BY TransDate Desc";
volumeDataEngine.DataFields = "xAxis=TransDate,yAxis=Volume";

Series volumes = volumeDataEngine.GetSeries()[0];
volumes.Trim(cp, ElementValue.XDateTime);
volumes.Name = "Volume";
volumes.Type = SeriesType.Bar;
volumeChartArea.SeriesCollection.Add(volumes);

// Accumulate distribute chart area
ChartArea accDistributeChartArea = new ChartArea();
accDistributeChartArea.HeightPercentage = 15;
accDistributeChartArea.YAxis = new Axis();
accDistributeChartArea.YAxis.Label.Font = new Font("Arial", 9);
accDistributeChartArea.YAxis.Label.Text = "AccDist";
Chart.ExtraChartAreas.Add(accDistributeChartArea);

// The accumulation/distribution indicator illustrates the degree to which an
// asset is being accumulated or reduced by the market on a given day.
Series acDistribute = FinancialEngine.AcumulateDistributeOverPeriod(prices, 5);
acDistribute.Name = "AcumulateDistributeOver5 per";
acDistribute.Type = SeriesType.Spline;
acDistribute.DefaultElement.Color = Color.FromArgb(150, Color.Red);
accDistributeChartArea.SeriesCollection.Add(acDistribute);

// Chaikin Chart Area
ChartArea chaikinChartArea = new ChartArea();
chaikinChartArea.HeightPercentage = 15;
chaikinChartArea.YAxis = new Axis();
chaikinChartArea.YAxis.Label.Font = new Font("Arial", 7);
chaikinChartArea.YAxis.Label.Text = "ChaikinMoneyFlow";
Chart.ExtraChartAreas.Add(chaikinChartArea);

// Chaikin Money Flow - Chaikin Money Flow (CMF) is a volume weighted average of
//Accumulation/Distribution over a specified period, which is usually taken to be
// 21 days.
Series chMoneyFlowPeriod21 = FinancialEngine.ChaikinMoneyFlowOverPeriod(prices, 21);
chMoneyFlowPeriod21.Name = "ChaikinMoneyFlow21";
chMoneyFlowPeriod21.Type = SeriesType.Spline;
chMoneyFlowPeriod21.DefaultElement.Color = Color.FromArgb(150, Color.Green);
chaikinChartArea.SeriesCollection.Add(chMoneyFlowPeriod21);

// Oscillator Chart Area
ChartArea oscillatorChartArea = new ChartArea();
oscillatorChartArea.HeightPercentage = 15;
oscillatorChartArea.YAxis = new Axis();
chaikinChartArea.YAxis.Label.Font = new Font("Arial", 7);
oscillatorChartArea.YAxis.Label.Text = "ChaikinOsc";
Chart.ExtraChartAreas.Add(oscillatorChartArea);

// The Chaiken Oscillator financial indicator presents the information contained within the A/D
// indicator in the convenient form of an oscillator.
Series chOscillator = FinancialEngine.ChaikinOscillator(prices, 0.1);
chOscillator.Name = "ChaikinOscillator";
chOscillator.Type = SeriesType.Spline;
chOscillator.DefaultElement.Color = Color.FromArgb(250, Color.Orange);
oscillatorChartArea.SeriesCollection.Add(chOscillator);

}

</script>
</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" %>
<%@ Import Namespace="System.Drawing.Drawing2D" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>.netCHARTING Sample</title>
<script runat="server">

Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)

' Demonstrates the use of Chaikin indicators with JS Navigator.
' These indicators measure to what degree on net an asset is being accumulated
' (i.e. brought) or distributed (i.e. sold) by the market as a whole.

' The Financial Chart
Chart.DefaultSeries.DefaultElement.Marker.Type = ElementMarkerType.None
Chart.TempDirectory = "temp"
Chart.Debug = False

Chart.Size = "640X700"

'Enable JSC
Chart.JS.Enabled = True
' Enable Navigator
Chart.Navigator.Enabled = True

Chart.XAxis.Scale = Scale.Time

Chart.YAxis.Label.Text = "Price (USD)"
Chart.YAxis.FormatString = "currency"

Dim priceDataEngine As DataEngine = New DataEngine()
priceDataEngine.ChartObject = Chart
priceDataEngine.ChartType = ChartType.Financial
priceDataEngine.ConnectionString = ConfigurationManager.AppSettings("DNCConnectionString")
priceDataEngine.DateGrouping = TimeInterval.Day
priceDataEngine.StartDate = New DateTime(2022, 1, 1)
priceDataEngine.EndDate = New DateTime(2022, 4, 1)
priceDataEngine.SqlStatement = "SELECT TransDate, HighPrice, LowPrice, OpenPrice, ClosePrice, Volume FROM FinancialCompany WHERE TransDate >= #STARTDATE# AND TransDate <= #ENDDATE# ORDER BY TransDate DESC"
priceDataEngine.DataFields = "xAxis=TransDate,High=HighPrice,Low=LowPrice,Open=OpenPrice,Close=ClosePrice,Volume=Volume"

Dim sc As SeriesCollection = priceDataEngine.GetSeries()
Dim prices As Series = Nothing
If sc.Count > 0 Then
prices = sc(0)
Else
Return
End If

prices.Type = SeriesTypeFinancial.CandleStick

Dim cp As CalendarPattern = New CalendarPattern(TimeInterval.Day, TimeInterval.Week, "0000001")
prices.Trim(cp, ElementValue.XDateTime)
prices.Name = "Prices"
Chart.SeriesCollection.Add(prices)

Chart.ChartAreaLayout.Mode = ChartAreaLayoutMode.Vertical

' Create the second chart area
Dim volumeChartArea As ChartArea = New ChartArea()
volumeChartArea.YAxis.Label.Text = "Volume"
volumeChartArea.HeightPercentage = 20
Chart.ExtraChartAreas.Add(volumeChartArea)

' Add a volume series to the chart area
Dim volumeDataEngine As DataEngine = New DataEngine()
volumeDataEngine.ConnectionString = ConfigurationManager.AppSettings("DNCConnectionString")
volumeDataEngine.DateGrouping = TimeInterval.Days
volumeDataEngine.StartDate = New DateTime(2022, 1, 1)
volumeDataEngine.EndDate = New DateTime(2022, 4, 1)
volumeDataEngine.SqlStatement = "SELECT TransDate,Volume FROM FinancialCompany WHERE TransDate >= #STARTDATE# AND TransDate <= #ENDDATE# ORDER BY TransDate Desc"
volumeDataEngine.DataFields = "xAxis=TransDate,yAxis=Volume"

Dim volumes As Series = volumeDataEngine.GetSeries()(0)
volumes.Trim(cp, ElementValue.XDateTime)
volumes.Name = "Volume"
volumes.Type = SeriesType.Bar
volumeChartArea.SeriesCollection.Add(volumes)

' Accumulate distribute chart area
Dim accDistributeChartArea As ChartArea = New ChartArea()
accDistributeChartArea.HeightPercentage = 15
accDistributeChartArea.YAxis = New Axis()
accDistributeChartArea.YAxis.Label.Font = New Font("Arial", 9)
accDistributeChartArea.YAxis.Label.Text = "AccDist"
Chart.ExtraChartAreas.Add(accDistributeChartArea)

' The accumulation/distribution indicator illustrates the degree to which an
' asset is being accumulated or reduced by the market on a given day.
Dim acDistribute As Series = FinancialEngine.AcumulateDistributeOverPeriod(prices, 5)
acDistribute.Name = "AcumulateDistributeOver5 per"
acDistribute.Type = SeriesType.Spline
acDistribute.DefaultElement.Color = Color.FromArgb(150, Color.Red)
accDistributeChartArea.SeriesCollection.Add(acDistribute)

' Chaikin Chart Area
Dim chaikinChartArea As ChartArea = New ChartArea()
chaikinChartArea.HeightPercentage = 15
chaikinChartArea.YAxis = New Axis()
chaikinChartArea.YAxis.Label.Font = New Font("Arial", 7)
chaikinChartArea.YAxis.Label.Text = "ChaikinMoneyFlow"
Chart.ExtraChartAreas.Add(chaikinChartArea)

' Chaikin Money Flow - Chaikin Money Flow (CMF) is a volume weighted average of
'Accumulation/Distribution over a specified period, which is usually taken to be
' 21 days.
Dim chMoneyFlowPeriod21 As Series = FinancialEngine.ChaikinMoneyFlowOverPeriod(prices, 21)
chMoneyFlowPeriod21.Name = "ChaikinMoneyFlow21"
chMoneyFlowPeriod21.Type = SeriesType.Spline
chMoneyFlowPeriod21.DefaultElement.Color = Color.FromArgb(150, Color.Green)
chaikinChartArea.SeriesCollection.Add(chMoneyFlowPeriod21)

' Oscillator Chart Area
Dim oscillatorChartArea As ChartArea = New ChartArea()
oscillatorChartArea.HeightPercentage = 15
oscillatorChartArea.YAxis = New Axis()
chaikinChartArea.YAxis.Label.Font = New Font("Arial", 7)
oscillatorChartArea.YAxis.Label.Text = "ChaikinOsc"
Chart.ExtraChartAreas.Add(oscillatorChartArea)

' The Chaiken Oscillator financial indicator presents the information contained within the A/D
' indicator in the convenient form of an oscillator.
Dim chOscillator As Series = FinancialEngine.ChaikinOscillator(prices, 0.1)
chOscillator.Name = "ChaikinOscillator"
chOscillator.Type = SeriesType.Spline
chOscillator.DefaultElement.Color = Color.FromArgb(250, Color.Orange)
oscillatorChartArea.SeriesCollection.Add(chOscillator)

End Sub

</script>
</head>
<body>
<div align="center">
<dotnet:Chart ID="Chart" runat="server" />
</div>
</body>
</html>

Sample FilenameJsNavigatorChaikin.aspx
Version8.0
Uses DatabaseYes

JS Charting

Gallery

JS Navigator Chaikin