BarChart

Verileri dikey ya da yatay çubuklarla gösteren grafik nesnesidir. Sayısal değerleri kategorilere göre karşılaştırmak için kullanılır. Bir veri kümesine (Data) bağlanır, hangi alanların çizileceğini bir seri listesiyle (Charts) tanımlar ve çubukları o veriyle çizer.

Bu nesnenin bir değeri yoktur. Kullanıcı veri giremez; nesne yalnızca kendisine verilen veriyi görsel olarak çizer. BarChart, ortak Chart nesnesinden türer; tek farkı serileri çubuk (BarSeries) tipinde sunmasıdır. Aynı yüzeyi LineChart, PieChart, AreaChart gibi diğer grafik nesneleri de paylaşır.

Ne zaman kullanılır?

Kategorilere göre sayısal karşılaştırma yapmak istediğinizde idealdir: aylara göre satış, departmanlara göre talep sayısı, ürünlere göre stok. Zaman içindeki sürekli değişimi göstermek için LineChart, bütüne oranı göstermek için PieChart daha uygundur.

Tasarımcı özellikleri

Bir BarChart seçildiğinde Özellik Görüntüleyici sekmelere ayrılır. BarChart bir görsel nesne olduğu için etiketi ve veri girişi yoktur; bunun yerine veri kaynağı, seriler, eksenler ve görünüm ayarları öne çıkar.

General

Özellik	Açıklama
Name	Nesnenin koddaki adı (ör. BarChart1). Koddan bu adla erişirsiniz.

Data Source

BarChart'ı çizmek için ona bir veri kümesi vermeniz gerekir. Veriyi tasarımcıdan bir veri kaynağına bağlayabilir ya da koddan atayabilirsiniz.

Özellik	Açıklama
DataSource	Grafiğin bağlandığı veri kaynağı (sorgu ya da liste). Çubukların kategori ve değerleri buradan gelir.
Data	Grafiğe doğrudan verilen veri kümesi (Object). Veri kaynağı yerine koddan satır listesi / nesne atamak için kullanılır.

Behavior

Özellik	Açıklama
Charts	Grafikteki serilerin listesi (List<ChartItem>). Her ChartItem bir veri alanını temsil eder; aynı grafikte birden çok seri gösterilebilir. Hangi alanın çizileceğini burada tanımlarsınız.
ArgumentAxis	Kategori (argüman) ekseninin ayarları (ChartArgumentAxis). Etiketler, çizgiler, ızgara ve konum buradan yönetilir.
ValueAxis	Değer ekseninin ayarları (ChartValueAxis). Sayısal ölçek, etiketler ve aralıklar buradan yönetilir.
Legend	Açıklama kutusunun (gösterge) ayarları (ChartLegend). Serilerin adlarını gösterir; Enabled ve Position buradan belirlenir.
Tooltip	Çubuğun üzerine gelince çıkan bilgi balonunun ayarları (ChartTooltip).
Hover	Çubuğun üzerine gelindiğinde uygulanacak vurgu davranışı (ChartHover).
Selection	Çubuk seçildiğinde uygulanacak davranış (ChartSelection).
Animation	Grafik çizilirken oynatılacak animasyon ayarları (ChartAnimation).
Stack	Serilerin üst üste yığılarak (stacked) gösterilmesi (ChartStack). Series listesi hangi serilerin birlikte yığılacağını belirler.
Rotate	Çubukları yatay duruma çevirir (Boolean). true yapılırsa çubuklar soldan sağa uzanır.
ZoomAndPan	Grafik üzerinde yakınlaştırma ve kaydırma davranışı (ChartZoomAndPan).

Appearance

Özellik	Açıklama
Title	Grafiğin üst başlığı. Tipi MultiLanguageText'tir (çok dilli); düz metin değil.
Caption	Nesnenin başlık / etiket bloğu (ControlCaption).
Visible / Client Visible	Nesnenin görünürlüğü.
Enabled / Client Enabled	Nesnenin aktif olup olmadığı.
Style / Container Style / Custom Class Name	Görünüm ve özel CSS ayarları.
Loading	Nesnenin yükleniyor durumunu gösterir. ShowLoading() / HideLoading() ile değişir.

Seri ve modül nesneleri

Çubukları gerçekten çizen şey Charts listesindeki ChartItem serileridir. Eksen ve gösterge ayarları da kendi nesneleri üzerinden yapılır.

ChartItem (bir seri)

Üye	Tip	Açıklama
Type	ChartType	Seri tipi. BarChart için BarSeries. Tüm değerler: LineSeries, SplineSeries, BarSeries, ScatterSeries, AreaSeries, PieSeries.
ArgumentField	String	Kategori (yatay) ekseninde kullanılacak alan adı.
ValueField	String	Çubuğun yüksekliğini belirleyen sayısal alan adı.
Name	String	Serinin gösterge (legend) adı.
Color	String	Serinin rengi (ör. "#3366ff").
ScaleName	String	Çoklu eksen kullanılırken serinin bağlandığı ölçek adı.
BarWidth	Nullable<Int32>	Çubuk genişliği.

Eksen, gösterge ve zoom modülleri

Nesne	Önemli üyeler
ChartArgumentAxis / ChartValueAxis	Position (ChartPosition: Left / Top / Right / Bottom), ShowGrid, ShowLabels, ShowLine, ShowTicks, TickSize, IndentFromAxis, ScaleName, Enabled.
ChartLegend	Enabled, Position (ChartPosition).
ChartStack	Enabled, Series (List<String>: birlikte yığılacak seri adları).
ChartZoomAndPan	InteractionWithArguments / InteractionWithValues (ChartInteraction: None / Pan / Zoom / Both), ZoomRegionKey (ChartZoomRegion: Shift / Alt / Ctrl).
ChartTooltip / ChartHover / ChartSelection / ChartAnimation	Her biri yalnızca Enabled taşır (modül açık / kapalı).

Olaylar

BarChart bir görsel nesne olduğu için kendine ait değer / metin olayı yoktur. Dolayısıyla OnValueChanged, OnTextChanged gibi olaylar bu nesnede bulunmaz. Sunucu / istemci olay listesi, tasarımcıda tanımladığınız genel olaylardan (ServerEvents / ClientEvents) oluşur.

Koddan kullanılabilen gerçek kancalar şunlardır:

Kanca	Ne zaman çalışır
OnDataSourceAddItem	Bağlı veri kaynağına bir öğe eklendiğinde. Veri bağlama sırasında devreye giren tek özel kancadır (DataSourceAddItemEventArgs).
OnClick / OnDoubleClick	Grafiğe tıklanınca / çift tıklanınca (VisualControl'dan gelir, MouseEventArgs).

Yaşam döngüsü olayları

OnInit / OnLoad / OnPreRender / OnRender / OnPropertyChanging / OnPropertyChanged yaşam döngüsü kancaları BaseControl'dan devralınır (BarChart -> Chart -> VisualControl -> BaseControl); bunlar ServerEvents üzerinden bağlanan adlandırılmış kancalardır. Yine de grafiği veri değiştiğinde tazelemek için olay beklemek yerine genellikle Data / Charts ataması yapıp Reload() çağırmak yeterlidir.

Kod örnekleri

BarChart'a üç yerden erişebilirsiniz. Sunucu örnekleri turuncu, istemci örnekleri kırmızı çerçevelidir. Bu nesnenin değeri olmadığı için .Value yerine Charts (seri tanımı) + Data (satırlar) + Reload() üçlüsünü kullanırsınız.

Form kodu (C#, sunucu)

Grafiği koddan çizmek için önce serileri tanımlayın, sonra veriyi atayın ve Reload() çağırın:

// 1) Seriyi tanımla: hangi alan çubuk olarak çizilecek
BarChart1.Charts = new List<ChartItem>
{
    new ChartItem
    {
        Type          = ChartType.BarSeries,
        ArgumentField = "AY",          // kategori (yatay) ekseni
        ValueField    = "TUTAR",       // çubuk yüksekliği
        Name          = "Aylık Satış",
        Color         = "#3366ff"
    }
};

// 2) Veriyi ver (satır kümesi)
BarChart1.Data = aylikSatislar;

// 3) Grafiği tazele
BarChart1.Reload();

Başlık çok dilli (MultiLanguageText) olduğu için düz string atanamaz:

// Başlık (çok dilli)
BarChart1.Title = new MultiLanguageText(
    new Dictionary<string, string> { { "tr-TR", "Aylık Satış" } });

// Çubukları yatay yap
BarChart1.Rotate = true;

// Görünüm
BarChart1.Visible = true;

Birden çok seriyi aynı argüman alanı üzerinde yığmak için (stacked):

BarChart1.Charts = new List<ChartItem>
{
    new ChartItem { Type = ChartType.BarSeries, ArgumentField = "AY",
                    ValueField = "ONAYLANAN", Name = "Onaylanan", Color = "#3366ff" },
    new ChartItem { Type = ChartType.BarSeries, ArgumentField = "AY",
                    ValueField = "BEKLEYEN",  Name = "Bekleyen",  Color = "#ff9933" }
};

// İki seriyi üst üste yığ
BarChart1.Stack.Enabled = true;
BarChart1.Stack.Series  = new List<string> { "Onaylanan", "Bekleyen" };

// Göstergeyi sağa al
BarChart1.Legend.Enabled  = true;
BarChart1.Legend.Position = ChartPosition.Right;

BarChart1.Data = aylikDurum;
BarChart1.Reload();

Akış (Flow) kodu (C#, sunucu)

Akış kodunda nesneye Document1.Controls["BarChart1"] ile erişirsiniz. Bu indeksleyici tipli BarChart nesnesini değil, jenerik bir Control sapı döndürür; bu sap yalnızca .Value / .Text / .Type / .Rows ve GetPropertyValue<T>() üyelerini sunar. Charts, Data, Reload() gibi BarChart'a özel üyelere bu sap üzerinden erişilemez ve sap tipli BarChart'a dönüştürülemez (cast geçersizdir).

// Akış kodunda yalnızca jenerik değer okunur (cast yok)
var grafikSapi = Document1.Controls["BarChart1"];
string tip     = grafikSapi.Type;
object deger   = grafikSapi.Value;

Serileri tanımlamak (Charts), veri atamak (Data) ve grafiği tazelemek (Reload()) yukarıdaki Form kodu örneğinde olduğu gibi form (Controller) kodunda yapılır; akış kodu grafiğin serilerini ve verisini doğrudan değiştiremez.

İstemci kodu (TypeScript, tarayıcı)

İstemci tarafında nesnelere this. ile erişilir:

this.BarChart1.visible = true;
this.BarChart1.enabled = true;

Yararlı yöntemler

BarChart, Chart ve VisualControl zincirinden şu yöntemleri devralır:

Yöntem	Açıklama
Reload()	Grafiği Data / Charts ayarlarına göre yeniden çizer. Veri değiştirdikten sonra çağrılır.
ShowLoading() / HideLoading() / ToggleLoading()	Loading durumunu açar / kapatır. Asenkron veri yüklerken grafiği "yükleniyor" göstermek için.
Show() / Hide()	Nesneyi gösterir / gizler.
ScrollTo()	Sayfayı nesneye kaydırır.
FireClick()	Tıklama olayını koddan tetikler.

// Asenkron veri çekerken grafiği yükleniyor göster
BarChart1.ShowLoading();
BarChart1.Data = await VeriCek();
BarChart1.Reload();
BarChart1.HideLoading();

Veriyi nereden bağlamalı?

Sabit bir sorgu yetiyorsa tasarımcıdan DataSource bağlamak en pratik yoldur. Veri çalışma anında hesaplanıyorsa (ör. kullanıcıya göre değişen bir liste) koddan Data'ya atayıp Reload() çağırın. Yalnızca Data atamak yetmez; çubukların çizilmesi için Charts listesinde en az bir ChartItem tanımlı olmalıdır.

İpuçları

• Çubukların çizilebilmesi için Charts listesinde her seri için bir ChartItem (Type = ChartType.BarSeries, ArgumentField, ValueField) tanımlamak zorunludur; tek başına Data ataması çubuk üretmez.
• Aynı grafikte birkaç değeri karşılaştırmak için Charts listesine birden çok ChartItem ekleyin.
• Çok sayıda kategori varsa Rotate = true ile çubukları yataya çevirmek etiketlerin okunmasını kolaylaştırır.
• Serileri üst üste toplam olarak göstermek istediğinizde Stack.Enabled = true yapıp Stack.Series ile yığılacak seri adlarını verin.
• Title çok dillidir; düz string yerine new MultiLanguageText(...) ile atayın.

Tüm tasarımcı özellikleri (tam liste)

General: Name

Data Source: DataSource, Data

Behavior: Charts (List<ChartItem>), ArgumentAxis, ValueAxis, Legend, Tooltip, Hover, Selection, Animation, Stack, Rotate, ZoomAndPan

Appearance: Title (MultiLanguageText), Caption, Style, ContainerStyle, CustomClassName, ControlId, Visible, Client Visible, Enabled, Client Enabled, DefaultEnabled, DefaultClientEnabled, Loading, ContextMenuKey, ContextMenuColumnKey, ContextMenuTarget

Yöntemler: Reload(), Show(), Hide(), ShowLoading(), HideLoading(), ToggleLoading(), ScrollTo(), FireClick(), OnDataSourceAddItem(sender, DataSourceAddItemEventArgs), OnClick(sender, MouseEventArgs), OnDoubleClick(sender, MouseEventArgs)

Olaylar: Adlandırılmış değer / metin olayı yoktur. Yaşam döngüsü kancaları (OnInit, OnLoad, OnPreRender, OnRender, OnPropertyChanging, OnPropertyChanged) BaseControl'dan devralınır; ayrıca genel ServerEvents / ClientEvents (List<EventItem>), veri kancası OnDataSourceAddItem ve tıklama kancaları OnClick / OnDoubleClick bulunur.