asp.net Grafik işleme örneği / chart kullanımı
Asp.net Chart kontrolünün kullanımı ile Grafik oluşturmayı gösteren bir örnek oluşturacağız. Chart kontrolü ile Grafik oluşturmak için kullanacağımız projemizde üniversite yemekhanesinde Öğrenci,personel,misafir ve akademisyenlerin yemek yedikleri günlerin sayılarını kullanarak bir örnek gerçekleştireceğiz.
1.Projemize Chart(Grafik) kontrolünü eklemek için Toolbox penceresini kullanacağız. Bunun için Toolbox Data bölümünden projemize Chart kontrolünü ekleyeceğiz.
- Chart kontrolünü ekledikten sonra aşağıdaki ayarlamayı yapacağız. Bunun için chart1 kontrolü üzerine bir kez tıkladıktan sonra Properties penceresinden Series özelliğine fotoğraftaki gibi tıklıyoruz.
- Daha sonra açılan pencerede aşağıdaki ayarı yapacağız. Bu bölümde Name özelliğine verdiğimiz isim önemli ben. Kod kısmında bu ismi kullanarak kodlarımızı yazacağız. grafikte öğrenci, personel,misafir ve akademisyenlerin her birine bir sütun olarak göstermek için açılan pencerede Add butonuna tıklayarak 4 tane sütun ekliyoruz ve bunları veri1, veri2, veri3 ve veri4 olarak adlandırdım.
- Bu işlemleri yaptıktan sonra karşımıza resimdeki gibi bir grafik çıkacak.
- Şimdi ise sayfamızın kod kısmına geçerek elle bir haftalık verinin nasıl eklendiğini görelim.
- Sayfayı çalıştırdığımızda grafiğin çalışması için kodlarımızı aspx.cs içerisinde Page_Load içerisinde yazmalıyız.
protected void Page_Load(object sender, EventArgs e)
{
Chart1.Series["veri1"].Points.AddXY("Pazartesi",25); //burada hem X hemde Y değerlerini verihoruz
Chart1.Series["veri1"].Points.AddXY("salı", 35);
Chart1.Series["veri1"].Points.AddXY("çarşamba", 45);
Chart1.Series["veri1"].Points.AddXY("prşembe", 55);
Chart1.Series["veri1"].Points.AddXY("cuma", 65);
Chart1.Series["veri2"].Points.Add(15); //veri birde X ve Y değerlerini verdiğimiz için diğer sütunlara sadece Y değerini atıyoruz.
Chart1.Series["veri2"].Points.Add(25);
Chart1.Series["veri2"].Points.Add(35);
Chart1.Series["veri2"].Points.Add(36);
Chart1.Series["veri2"].Points.Add(46);
Chart1.Series["veri3"].Points.Add(10);
Chart1.Series["veri3"].Points.Add(20);
Chart1.Series["veri3"].Points.Add(30);
Chart1.Series["veri3"].Points.Add(40);
Chart1.Series["veri3"].Points.Add(50);
Chart1.Series["veri4"].Points.Add(12);
Chart1.Series["veri4"].Points.Add(21);
Chart1.Series["veri4"].Points.Add(32);
Chart1.Series["veri4"].Points.Add(23);
Chart1.Series["veri4"].Points.Add(25);
}
- Bu kodları yazdıktan sonra karşımıza resimdeki grafik çıkacaktır.
- Şimdi ise Aynı işlemi veri tabanından çekerek gerçekleştirelim.
//Burada veri tabanından Net platformunda ORM (Object Relational Mapping) araçlarından biridir. ORM (Object Relational Mapping) ise veritabanı ile nesneye yönelik programlama (OOP) arasındaki ilişkiyi kuran teknolojidir. Yani Entity Framework, nesne tabanlı programlamada veritabanındaki tablolara uygun nesneler oluşturma tekniğini kulanıyoruz.
GrafikDBContext ctx = new GrafikDBContext();
protected void Page_Load(object sender, EventArgs e)
{
var getVeri = from v in ctx.tblAylikGirafs.OrderByDescending(x => x.id).Take(5) select v;
foreach (var i in getVeri)
{
Chart1.Series["veri1"].Points.AddXY(i.Tarih, i.ogr_Veri);
Chart1.Series["veri2"].Points.Add(Convert.ToInt32(i.pers_Veri));
Chart1.Series["veri3"].Points.Add(Convert.ToInt32(i.akedemis_Veri));
Chart1.Series["veri4"].Points.Add(Convert.ToInt32(i.misafir_Veri));
Chart1.Series["veri5"].Points.Add(Convert.ToInt32(i.burslu_Veri));
}
}
- Bu kodları yazdığımızda karşımıza aşağıdaki şekil çıkacaktır.
- Veri tabanında tablomuz aşağıdaki gibidir.
