<\/div>\n

Veri taban\u0131nda ya da ba\u015fka yerlerde bar\u0131nd\u0131rd\u0131\u011f\u0131m\u0131z verilerin birbirleriyle ili\u015fkisi sonucu grafiksel raporlar veren bir nesnedir.Bir Chart kontrol\u00fcn\u00fcn kullan\u0131m\u0131na de\u011finmeden \u00f6nce, olu\u015fturaca\u011f\u0131m\u0131z grafik \u00fczerinde baz\u0131 i\u015flemleri ger\u00e7ekle\u015ftirmek ve \u00e7e\u015fitli \u00f6zellikleri de\u011fi\u015ftirmek i\u00e7in baz\u0131 ek metodlar\u0131 mevcuttur.<\/p>\n

AddTitle Metodu<\/em><\/strong><\/span>; Grafi\u011fin ba\u015fl\u0131\u011f\u0131n\u0131 belirtir.<\/span><\/li>\n
AddLegend Metodu<\/em><\/strong><\/span>; Grafik verileri hakk\u0131nda bilgi sunmam\u0131za yarar.<\/span><\/li>\n

AddSeries Metodu<\/em><\/strong><\/span>; Grafik \u00fczerindeki x ve y eksenlerinde g\u00f6r\u00fcnt\u00fclenecek olan de\u011ferleri belirtebiliriz.<\/span><\/li>\n<\/ul>\n
\u015eimdi sade bir Chart kontrol\u00fc kullanal\u0131m.<\/p>\n
\r\n@{\r\n var GrafikCiz = new Chart(500, 500);\r\n GrafikCiz.AddTitle("Gen\u00e7ay Y\u0131ld\u0131z Grafik").AddLegend("Gen\u00e7ay Y\u0131ld\u0131z").AddSeries("De\u011ferler", xValue: new[] { "Ahmet", "Necati", "Mustafa", "Gen\u00e7ay" }, yValues: new[] { "4", "6", "1", "23" }).Write();\r\n}\r\n<\/pre>\n
Yukar\u0131daki kod blo\u011funun olu\u015fturaca\u011f\u0131 grafik a\u015fa\u011f\u0131daki gibidir.
\n $\"Chart1\"$ <\/a><\/p>\n
Burada AddSeries metodunun kullan\u0131\u015f\u0131n\u0131 biraz inceleyelim.
\n $\"AddSeries\"$ <\/a>
\n“name” parametresiyle verilen de\u011ferlere isim verilir.
\n“ChartType” parametresiyle grafik t\u00fcr\u00fcn\u00fc belirtebiliriz.(Alaca\u011f\u0131 de\u011ferler; Bar, Area, Pie, Column, Line, Stock)<\/span>
\n“ChartArea” parametresiyle x ve y kordinatlar\u0131 belirlenir.
\n“.Write()” metodu ise, grari\u011fin belirtilen alana, verilen ayarlarla olu\u015fturulmas\u0131n\u0131 sa\u011flar.<\/p>\n
Dikkat !!! Olu\u015fturdu\u011fumuz grafik varsay\u0131lan olarak “jpeg” tabanl\u0131 g\u00f6r\u00fcnt\u00fclenmektedir.<\/em><\/strong><\/span><\/p>\n
\u015eimdi ise grafi\u011fimizde biraz de\u011fi\u015fiklik yapal\u0131m.<\/p>\n
\r\n@{\r\n var GrafikCiz = new Chart(500, 500);\r\n GrafikCiz.AddTitle("Gen\u00e7ay Y\u0131ld\u0131z Grafik").AddLegend("Gen\u00e7ay Y\u0131ld\u0131z").AddSeries("De\u011ferler", chartType: "Bar", xValue: new[] { "Ahmet", "Necati", "Mustafa", "Gen\u00e7ay" }, yValues: new[] { "4", "6", "1", "23" }).Write(format: "png");\r\n}\r\n<\/pre>\n
Dikkat ederseniz, AddSeries metodunun i\u00e7inde, “chartType” parametresinin de\u011feri “Bar” olarak de\u011fi\u015ftirildi.Haliyle grafi\u011fimizin \u015fekli a\u015fa\u011f\u0131daki gibi oldu.Ayr\u0131ca Write metodunun i\u00e7ine “format” parametresiyle “png” de\u011feri yaz\u0131lm\u0131\u015ft\u0131r ve grafik “png” tabanl\u0131 olu\u015fturulmu\u015ftur.
\n $\"Chart2\"$ <\/a><\/p>\n
Son olarak bir veri kayna\u011f\u0131ndan beslenen grafik olu\u015ftural\u0131m.
\nModel katman\u0131m\u0131zda “Insan.cs” ad\u0131nda bir s\u0131n\u0131f olu\u015fturuyoruz.<\/p>\n
\r\n public class Insan\r\n {\r\n public string Ad { get; set; }\r\n public int Yas { get; set; }\r\n }\r\n<\/pre>\n
Controller katman\u0131m\u0131zda Grafik ad\u0131nda bir Action metod olu\u015fturuyoruz.<\/p>\n
\r\n public ActionResult Grafik()\r\n {\r\n\r\n Insan i1 = new Insan { Ad = "Gen\u00e7ay", Yas = 21 };\r\n Insan i2 = new Insan { Ad = "Ahmet", Yas = 12 };\r\n Insan i3 = new Insan { Ad = "Mehmet", Yas = 53 };\r\n Insan i4 = new Insan { Ad = "Necati", Yas = 23 };\r\n Insan i5 = new Insan { Ad = "Mustafa", Yas = 56 };\r\n List<Insan> Insanlar = new List<Insan>() { i1, i2, i3, i4, i5 };\r\n ViewBag.Insanlar = Insanlar;\r\n\r\n return View();\r\n }\r\n<\/pre>\n
Grafik Action metodunun View katmandaki .cshtml sayfas\u0131nda a\u015fa\u011f\u0131daki kodlar\u0131 yazal\u0131m.<\/p>\n
\r\n@{\r\n var GrafikCiz = new Chart(500, 500);\r\n List<MvcApplication4.Models.Insan> Insanlar = ViewBag.Insanlar as List<MvcApplication4.Models.Insan>;\r\n if (Insanlar != null)\r\n {\r\n GrafikCiz.AddTitle("Gen\u00e7ay Y\u0131ld\u0131z Grafik")\r\n .AddLegend("Gen\u00e7ay Y\u0131ld\u0131z")\r\n .AddSeries(name: "\u0130nsanlar", chartType: "Line")\r\n .DataBindTable(Insanlar)\r\n .Write(format: "gif");\r\n }\r\n}\r\n<\/pre>\n
Burada dikkat ederseniz e\u011fer, DataBindTable metoduna, Insanlar koleksiyonunu veriyoruz.Bu metod sayesinde insanlar\u0131n analizi sonucu grafik olu\u015fturulacakt\u0131r.
\n $\"Chart3\"$ <\/a><\/p>\n
Makalemizi bitirmeden \u00f6nce son olarak Chart nesnemizin alaca\u011f\u0131, “ChartTime” parametresinden bahsetmek istiyorum.”ChartTime” parametresi ile grafi\u011fimize g\u00f6lge ve 3 boyut kazand\u0131rabiliriz.
\n“ChartTime” parametresi a\u015fa\u011f\u0131daki de\u011ferleri almaktad\u0131r.
\n“Blue, Green, Yellow, Vanilla, Vanilla3D”
\n\u00d6rnek kullan\u0131m\u0131 a\u015fa\u011f\u0131daki gibidir.<\/p>\n
\r\n@{\r\n var GrafikCiz = new Chart(500, 500, ChartTheme.Yellow);\r\n List<MvcApplication4.Models.Insan> Insanlar = ViewBag.Insanlar as List<MvcApplication4.Models.Insan>;\r\n if (Insanlar != null)\r\n {\r\n GrafikCiz.AddTitle("Gen\u00e7ay Y\u0131ld\u0131z Grafik")\r\n .AddLegend("Gen\u00e7ay Y\u0131ld\u0131z")\r\n .AddSeries(name: "\u0130nsanlar", chartType: "Line")\r\n .DataBindTable(Insanlar)\r\n .Write(format: "gif");\r\n }\r\n}\r\n<\/pre>\n
Bu makelemizinde sonuna gelmi\u015f bulunmaktay\u0131z.Art\u0131k MVC’de Chart nesnesini sorunsuz kullanabilir ve grafiksel sonu\u00e7lar\u0131n keyfini tadabilirsiniz.Bu nesne, Asp.NET Web Form mimarisinden ziyade MVC mimarisinde daha kullan\u0131\u015fl\u0131 ve esnek bir yap\u0131ya sahip.<\/p>\n
Sonraki yaz\u0131lar\u0131mda g\u00f6r\u00fc\u015fmek dile\u011fiyle..
\n\u0130yi \u00e7al\u0131\u015fmalar..<\/p>\n","protected":false},"excerpt":{"rendered":"
Veri taban\u0131nda ya da ba\u015fka yerlerde bar\u0131nd\u0131rd\u0131\u011f\u0131m\u0131z verilerin birbirleriyle ili\u015fkisi sonucu grafiksel raporlar veren bir nesnedir.Bir Chart kontrol\u00fcn\u00fcn kullan\u0131m\u0131na de\u011finmeden \u00f6nce, olu\u015fturaca\u011f\u0131m\u0131z grafik \u00fczerinde baz\u0131 i\u015flemleri ger\u00e7ekle\u015ftirmek ve \u00e7e\u015fitli \u00f6zellikleri de\u011fi\u015ftirmek i\u00e7in baz\u0131 ek...<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[345],"tags":[746,407,283,755],"class_list":["post-1570","post","type-post","status-publish","format-standard","hentry","category-mvc-4-0","tag-asp-net-mvc","tag-chart","tag-mvc","tag-mvc-4-0"],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/1570","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/comments?post=1570"}],"version-history":[{"count":0,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/1570\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/media?parent=1570"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/categories?post=1570"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/tags?post=1570"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}