Siticone Logo
Siticone UI
DOCS
v2025.12.15
Docs Candlestick Chart

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

DataBind()
// 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.

Event Descriptions & Wiring
// 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.

C# - DataTable Binding
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.

C# - Object Binding
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

CandlestickThemePreset Enum
public enum CandlestickThemePreset
{
    Custom, 
    Financial, // Classic Green/Red
    Grayscale, 
    BlueRed, 
    Neon,      // Bright on Black
                // ... and many more
}