Siticone Candlestick Chart
The SiticoneCandlestickChart is a specialized financial data visualization control.
It renders High-Low-Open-Close (OHLC) data structures typically used for analyzing stock price movements, currency pairings, or other volatile data over time.
Data Binding
To render a valid candlestick chart, you must bind five specific data points: Date (X-Axis), Open, High, Low, and Close prices.
| Property | Type | Description & Usage Example |
|---|---|---|
DataSource |
object |
chart.DataSource = myStockData;
The data source containing the financial records. Accepts DataTable, List<T>, etc.
|
XMember |
string | chart.XMember = "TradeDate"; The property name for the date/time of the candle. |
OpenMember |
string | chart.OpenMember = "OpeningPrice"; The property name for the opening price. |
HighMember |
string | chart.HighMember = "DailyHigh"; The property name for the highest price reached during the period. |
LowMember |
string | chart.LowMember = "DailyLow"; The property name for the lowest price reached during the period. |
CloseMember |
string | chart.CloseMember = "ClosingPrice"; The property name for the closing price. |
Appearance & Theming
Customize the visual representation of Bullish (price up) and Bearish (price down) candles.
| Property | Type | Description & Usage Example |
|---|---|---|
Theme |
CandlestickThemePreset |
chart.Theme = CandlestickThemePreset.Financial;
Applies a preset theme. Options include Financial (classic green/red), Neon, Grayscale, etc.
|
BullishColor |
Color | chart.BullishColor = Color.LimeGreen; The color of the candle body when the Close price is higher than the Open price. |
BearishColor |
Color | chart.BearishColor = Color.Red; The color of the candle body when the Close price is lower than the Open price. |
WickColor |
Color | chart.WickColor = Color.White; The color of the vertical lines (shadows) extending from the candle body to the High/Low points. |
GridColor |
Color | chart.GridColor = Color.DimGray; The color of the background grid lines. |
Behavior & Interaction
Control chart interactivity and animations.
| Property | Type | Description & Usage Example |
|---|---|---|
EnableAnimations |
bool | chart.EnableAnimations = true; If true, candles animate (grow vertically) when data is loaded. |
EnableHighlight |
bool | chart.EnableHighlight = true; Highlights the candle under the mouse cursor by brightening its color. |
EnableTooltips |
bool | chart.EnableTooltips = true; Shows a tooltip containing Date, Open, High, Low, and Close values on hover. |
Public Methods
// Forces the chart to process the DataSource and render the candles.
// Must be called after setting the DataSource or changing mapping properties.
candlestickChart.DataBind();
Events
Handle user interactions with specific candles.
// 1. CandleClick Event
// Fires when a user clicks a specific candle.
chart.CandleClick += (s, e) =>
{
MessageBox.Show($"Date: {e.Date:d}\nClose: {e.Close}");
};
// 2. CandleHover Event
// Fires when the mouse enters a candle's area.
chart.CandleHover += (s, e) =>
{
statusLabel.Text = $"High: {e.High} | Low: {e.Low}";
};
// 3. DataLoaded Event
// Fires after data processing is complete.
chart.DataLoaded += (s, e) =>
{
Console.WriteLine($"Loaded {e.CandleCount} candles.");
};
Detailed Usage Examples
Example 1: Binding to a DataTable
Binding standard financial data stored in a DataTable.
private void LoadStockData()
{
DataTable dt = new DataTable();
dt.Columns.Add("TradeDate", typeof(DateTime));
dt.Columns.Add("Open", typeof(double));
dt.Columns.Add("High", typeof(double));
dt.Columns.Add("Low", typeof(double));
dt.Columns.Add("Close", typeof(double));
// Add sample data rows...
dt.Rows.Add(DateTime.Today, 150.00, 155.50, 149.00, 153.20);
dt.Rows.Add(DateTime.Today.AddDays(1), 153.20, 160.00, 152.00, 158.50);
candlestickChart.DataSource = dt;
// Map columns
candlestickChart.XMember = "TradeDate";
candlestickChart.OpenMember = "Open";
candlestickChart.HighMember = "High";
candlestickChart.LowMember = "Low";
candlestickChart.CloseMember = "Close";
candlestickChart.Theme = CandlestickThemePreset.Financial;
candlestickChart.DataBind();
}
Example 2: Binding to a List of Objects
Using a strong-typed list of stock quote objects.
public class StockQuote
{
public DateTime Date { get; set; }
public double O { get; set; } // Open
public double H { get; set; } // High
public double L { get; set; } // Low
public double C { get; set; } // Close
}
private void LoadQuotes()
{
var quotes = new List<StockQuote>
{
new StockQuote { Date = DateTime.Now, O=100, H=110, L=95, C=105 },
new StockQuote { Date = DateTime.Now.AddDays(1), O=105, H=108, L=102, C=102 }
};
candlestickChart.DataSource = quotes;
candlestickChart.XMember = "Date";
candlestickChart.OpenMember = "O";
candlestickChart.HighMember = "H";
candlestickChart.LowMember = "L";
candlestickChart.CloseMember = "C";
// Custom Styling (Neon Theme)
candlestickChart.Theme = CandlestickThemePreset.Neon;
candlestickChart.DataBind();
}
Enumerations
public enum CandlestickThemePreset
{
Custom,
Financial, // Classic Green/Red
Grayscale,
BlueRed,
Neon, // Bright on Black
// ... and many more
}