SplineChart

Verileri noktalarla gösteren ve bu noktaları yumuşatılmış (kıvrımlı) eğrilerle birleştiren grafik nesnesidir. LineChart'a benzer; ama noktaları düz çizgilerle değil, yumuşak eğrilerle bağlar. Bir değerin zaman içindeki değişimini akıcı bir görünümle sunmak için kullanılır.

SplineChart, Chart nesnesinden türer ve kendine özel hiçbir özellik eklemez; yalnızca seri tipini eğri (ChartType.SplineSeries) olarak hazır getirir. Bu sayede Chart, AreaChart, BarChart, LineChart, PieChart, ScatterChart ile birebir aynı kod arayüzüne sahiptir.

Bu nesnenin bir değeri yoktur. Ekrana veri girişi yapmaz; Data ile verilen kayıtları, Charts ile tanımlanan serilere göre grafik olarak çizer.

Ne zaman kullanılır?

Bir ölçümün zaman içindeki seyrini (aylık satış, günlük başvuru sayısı, sıcaklık trendi) daha yumuşak ve akıcı bir görünümle göstermek için idealdir. Noktalar arasındaki geçişi düz çizgilerle göstermek istediğinizde LineChart, kategorileri yan yana karşılaştırmak istediğinizde BarChart, parçaların bütüne oranını göstermek istediğinizde PieChart daha uygundur.

Tasarımcı özellikleri

Bir SplineChart seçildiğinde Özellik Görüntüleyici sekmelere ayrılır.

General

Özellik	Açıklama
Name	Nesnenin koddaki adı (ör. SplineChart1). Koddan bu adla erişirsiniz.
Caption	Nesnenin başlık/etiket bilgisi (ControlCaption).

Data Source

Grafiğin çizeceği veriyi belirler. Veriyi ya elle (kod ile bir nesne atayarak) ya da bir veri kaynağına bağlayarak verirsiniz.

Özellik	Açıklama
Data	Grafiğe doğrudan atanan veri kümesi (tip: Object). Koddan hazırladığınız satır listesini buraya verirsiniz.
DataSource	Grafiğin bağlanacağı veri kaynağı (.mssqlds, .restds vb.). Kayıtlar buradan otomatik çekilir.

Behavior

Özellik	Tip	Açıklama
Charts	List<ChartItem>	Grafikteki eğri serilerinin listesi. Her ChartItem hangi alanı çizeceğini ve seri tipini belirtir.
ArgumentAxis	ChartArgumentAxis	Yatay eksen (X) ayarları. Genelde kategori ya da tarih bilgisini taşır.
ValueAxis	ChartValueAxis	Dikey eksen (Y) ayarları. Sayısal değerleri taşır.
Legend	ChartLegend	Açıklama kutusu (gösterge). Hangi eğrinin neyi temsil ettiğini gösterir.
Tooltip	ChartTooltip	Fareyle bir noktanın üzerine gelince çıkan bilgi balonu.
Hover	ChartHover	Fare üzerine gelince eğrinin vurgulanma davranışı.
Selection	ChartSelection	Eğri ya da nokta seçildiğindeki davranış.
Animation	ChartAnimation	Grafik çizilirken çalışan hareket efekti.
Stack	ChartStack	Birden çok seriyi üst üste yığma ayarı.
ZoomAndPan	ChartZoomAndPan	Grafikte yakınlaştırma ve kaydırma davranışı.
Rotate	Boolean	Grafiği yatay/dikey çevirir.
Loading	Boolean	Nesnenin yükleniyor durumunu (yükleniyor göstergesi) belirler.

Appearance

Özellik	Açıklama
Visible / Client Visible	Nesnenin görünürlüğü.
Enabled / Client Enabled	Nesnenin aktif olup olmadığı.
Title	Grafiğin başlığı. Tip MultiLanguageText'tir (çok dillidir); düz bir string değildir.
Style / ContainerStyle	Nesnenin ve kapsayıcısının stili.
CustomClassName	Nesneye eklenecek özel CSS sınıfı.
ContextMenuKey / ContextMenuColumnKey / ContextMenuTarget	Nesneye sağ tık menüsü bağlama ayarları (ContextMenuTarget: Container, None, Row, Column).

Alt nesneler

Charts, eksenler ve modüller yapılı nesnelerdir; koddan içlerine girip ayar yapabilirsiniz.

ChartItem (bir seri)

Üye	Tip	Açıklama
Type	ChartType	Seri tipi. SplineChart için ChartType.SplineSeries.
ArgumentField	String	X eksenine yazılacak alan adı (ör. kategori/tarih).
ValueField	String	Y eksenine yazılacak sayısal alan adı.
Name	String	Serinin gösterge (legend) adı.
Color	String	Serinin rengi (ör. "#3366ff").
ScaleName	String	Birden çok eksen kullanıldığında bağlanacağı eksen adı.
BarWidth	Nullable<Int32>	(Çubuk serileri için) çubuk genişliği.

ChartType değerleri: LineSeries, SplineSeries, BarSeries, ScatterSeries, AreaSeries, PieSeries.

ArgumentAxis / ValueAxis

Her ikisi de ChartPosition Position (Left / Top / Right / Bottom), String ScaleName, Boolean ShowGrid / ShowLabels / ShowLine / ShowTicks, Nullable<Int32> TickSize, Nullable<Int32> IndentFromAxis, Boolean Enabled üyelerini taşır.

Legend / Stack / ZoomAndPan

• Legend: ChartPosition Position, Boolean Enabled.
• Stack: List<String> Series (hangi serilerin üst üste yığılacağı), Boolean Enabled.
• ZoomAndPan: ChartInteraction InteractionWithArguments / InteractionWithValues (None / Pan / Zoom / Both), ChartZoomRegion ZoomRegionKey (Shift / Alt / Ctrl), Boolean Enabled.
• Tooltip / Hover / Selection / Animation: yalnızca Boolean Enabled taşıyan açık/kapalı modüllerdir.

Yöntemler (Methods)

Yöntem	Açıklama
Reload()	Data ve Charts ayarlandıktan sonra grafiği yeniden çizer. Veri değişiminden sonra çağrılması zorunludur.
OnDataSourceAddItem(object sender, DataSourceAddItemEventArgs e)	Veri kaynağına kayıt eklendiğinde çalışan gerçek veri-bağlama kancası.
GetProtectedData(bool isDisabledOrReadOnly)	Nesnenin korunan veri sözlüğünü döndürür.
GetDifferences(object otherObj)	İki nesne durumu arasındaki farkları döndürür.

Olaylar

dll-form.json'da SplineChart için olay listesi boştur. Tasarımcıda görebileceğiniz OnInit / OnLoad / OnRender gibi olaylar bu nesneye özgü değil, tüm görsel nesnelerde ortak olan çerçeve (framework) düzeyindeki yaşam döngüsü olaylarıdır. SplineChart bir değer taşımadığı için değer/metin değişim olayı yoktur.

Veriye bağlı tek gerçek kanca OnDataSourceAddItem yöntemidir; veri kaynağına kayıt eklendiğinde tetiklenir.

Kod örnekleri

Bir SplineChart'ı koddan kullanmanın asıl yolu serileri (Charts) tanımlayıp veriyi (Data) atadıktan sonra Reload() çağırmaktır. Sunucu örnekleri turuncu, istemci örnekleri kırmızı çerçevelidir.

Form kodu (C#, sunucu)

Form kodunda nesneye doğrudan adıyla erişirsiniz. Aşağıda koddan hazırlanan bir satır listesinden tek seri bir eğri grafik oluşturulur:

using System.Collections.Generic;
using Bimser.CSP.FormControls.Common;
using Bimser.CSP.FormControls.Controls;

// 1) Çizilecek satırlar (X = AY, Y = TUTAR)
var satirlar = new List<Dictionary<string, object>>
{
    new Dictionary<string, object> { { "AY", "Ocak" },  { "TUTAR", 1200 } },
    new Dictionary<string, object> { { "AY", "Şubat" }, { "TUTAR", 1850 } },
    new Dictionary<string, object> { { "AY", "Mart" },  { "TUTAR", 1600 } },
};

// 2) Seriyi tanımla (eğri seri)
SplineChart1.Charts = new List<ChartItem>
{
    new ChartItem
    {
        Type          = ChartType.SplineSeries,
        ArgumentField = "AY",
        ValueField    = "TUTAR",
        Name          = "Aylık Tutar",
        Color         = "#3366ff"
    }
};

// 3) Veriyi ata ve grafiği yeniden çiz
SplineChart1.Data = satirlar;
SplineChart1.Reload();

// Başlık MultiLanguageText'tir, düz string değildir:
SplineChart1.Title = new MultiLanguageText(
    new Dictionary<string, string> { { "tr-TR", "Aylık Başvuru Sayısı" } });

// Görünürlük / aktiflik
SplineChart1.Visible = true;
SplineChart1.Enabled = true;

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

Akış kodunda nesneye Document1.Controls["SplineChart1"] üzerinden erişirsiniz. Bu indeksleyici tipli SplineChart nesnesini değil, jenerik bir Control sapı (Bimser.Synergy.ServiceAPI.Models.Form.Control) döndürür. Bu sap yalnızca Text / Value / Type / Rows ve GetPropertyValue<T> üyelerini açar; Charts / Data / Reload gibi tipli SplineChart üyeleri bu saptan erişilemez ve sap SplineChart'a cast edilemez. Bu nedenle serileri ve veriyi atayıp grafiği yeniden çizmek (Charts / Data / Reload) yalnızca yukarıdaki Form (Controller) kodunda yapılır. Akış kodu grafikten yalnızca jenerik değer okur:

// Akış kodu yalnızca jenerik Control sapına erişir
Control grafik = Document1.Controls["SplineChart1"];

// Saptan okunabilecekler: Value / Text / Type / GetPropertyValue<T>
string tip = grafik.Type;
object deger = grafik.Value;

// Charts / Data / Reload bu saptan ERİŞİLEMEZ.
// Seri tanımı, veri ataması ve yeniden çizim Form (Controller) kodunda yapılır.

İstemci kodu (TypeScript, tarayıcı)

İstemci tarafında nesnelere this. ile erişilir ve özellik adları küçük harfle yazılır:

// Grafiği gizle / göster
this.SplineChart1.visible = false;
this.SplineChart1.visible = true;

// Aktif / pasif yap
this.SplineChart1.enabled = false;

Örnek: veri kaynağına bağlama ve eksen ayarı

Sabit bir sorgu yetiyorsa tasarımcıdan DataSource seçip serileri kod ile tanımlar, eksen biçimini ayarlarsınız:

SplineChart1.Charts = new List<ChartItem>
{
    new ChartItem { Type = ChartType.SplineSeries, ArgumentField = "TARIH", ValueField = "ADET" }
};

// X eksenini altta göster, etiket ve ızgarayı aç
SplineChart1.ArgumentAxis.Position   = ChartPosition.Bottom;
SplineChart1.ArgumentAxis.ShowLabels = true;
SplineChart1.ArgumentAxis.ShowGrid   = true;

SplineChart1.Reload();

Örnek: çok serili eğri + gösterge yerleşimi

Birden fazla eğriyi aynı grafikte gösterip göstergeyi sağa yerleştirebilirsiniz:

SplineChart1.Charts = new List<ChartItem>
{
    new ChartItem { Type = ChartType.SplineSeries, ArgumentField = "AY", ValueField = "PLAN",
                    Name = "Plan",   Color = "#3366ff" },
    new ChartItem { Type = ChartType.SplineSeries, ArgumentField = "AY", ValueField = "GERCEK",
                    Name = "Gerçek", Color = "#ff7043" }
};

SplineChart1.Legend.Enabled  = true;
SplineChart1.Legend.Position = ChartPosition.Right;

SplineChart1.Data = satirlar;
SplineChart1.Reload();

Örnek: büyük veride yakınlaştırma (ZoomAndPan)

Çok sayıda nokta çizdiren grafiklerde kullanıcının veriye yakınlaşmasını sağlayın:

SplineChart1.ZoomAndPan.Enabled                 = true;
SplineChart1.ZoomAndPan.InteractionWithArguments = ChartInteraction.Both;
SplineChart1.ZoomAndPan.ZoomRegionKey            = ChartZoomRegion.Shift;
SplineChart1.Reload();

Veriyi nereden bağlarım?

Grafiğin çizdiği veri DataSource (otomatik) ya da kod ile atanan Data üzerinden gelir. Hangi yolu seçerseniz seçin, serileri Charts listesinde tanımlamanız ve değişiklikten sonra Reload() çağırmanız gerekir; Reload() çağrılmazsa grafik yenilenmez.

İpuçları

• Yumuşatılmış eğri, az sayıda veri noktasında trendi daha akıcı gösterir; ancak ani sıçramaları olan verilerde eğri gerçek değeri yanıltıcı biçimde "yuvarlayabilir". Bu durumda LineChart daha doğru bir görünüm verir.
• Birden fazla eğriyi aynı grafikte göstermek için Charts listesine birden çok ChartItem ekleyin; her birine Name verip Legend'i açın.
• Title çok dillidir (MultiLanguageText); koddan new MultiLanguageText(new Dictionary<string,string>{{"tr-TR","..."}}) biçiminde atayın, düz string vermeyin.
• Çok sayıda kayıt çizdireceğiniz grafiklerde ZoomAndPan özelliğini açarak kullanıcının veriye yakınlaşmasını sağlayın.
• Akış kodunda Document1.Controls["SplineChart1"] jenerik bir Control sapı döndürür; bu sap SplineChart'a cast edilemez ve Charts / Data / Reload üyeleri buradan erişilemez. Seri/veri atama ve yeniden çizim Form (Controller) kodunda yapılır; akış kodu saptan yalnızca Value / Text / GetPropertyValue<T> okur.

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

General: Name, Caption

Data Source: Data, DataSource

Behavior: Charts, ArgumentAxis, ValueAxis, Legend, Tooltip, Hover, Selection, Animation, Stack, ZoomAndPan, Rotate, Loading

Appearance: Visible, Client Visible, Enabled, Client Enabled, Title, Style, ContainerStyle, CustomClassName, ContextMenuKey, ContextMenuColumnKey, ContextMenuTarget, ControlId, DefaultEnabled, DefaultClientEnabled

Yöntemler: Reload, OnDataSourceAddItem, GetProtectedData, GetDifferences

Olaylar: Bu nesnenin dump'ında olay yoktur. Tasarımcıda görünen OnInit / OnLoad / OnRender gibi olaylar çerçeve düzeyinde, tüm görsel nesnelerde ortaktır; SplineChart'a özgü değildir. Veriye bağlı tek gerçek kanca OnDataSourceAddItem yöntemidir.