pillinetwork hesabınızla giriş yapın.

asp.net Fusion Charts ile grafik tablo görüntüleme (C#)

bu yazımda asp.net ile yapılmış web sitemize flasg grafik tablolar eklemeyi anlatacağım... karşıdan bakınca zor gibi görünmesine rağmen oldukça kolay bir işlem...
öncelikle fusion chartsı bilgisayarımıza indiriyoruz...

fusion charts
fusion charts

sonrasında Contents klasörü içindeki Style.css alıp kendi projemizdeki css klasörüne, JSClass içindeki FusionCharts.js dosyasını projemizdeki js klasörüne ekliyoruz...

ben örnek olarak ziyaretçi istatistiği sistemi yaptım:

öncelikle

ben veritabanı yapısından bahsetmek istiyorum
tblSayac tablomuz aşağıdaki gibidir

------------------------- ID | sayac | gun
------------------------- 1 | 5 | 04.04.2009

dikkat gun alanı tarih olmasına rağmen access te not alan tipine sahiptir.
aşağıda tarihi alıp stringe çevirip veritabanına kaydedicez bunun sebebi ise saat değeri olmadan tarihi gönderebilmektir.

default.aspx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="flashchart._Default" %>



<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>FusionCharts Free Documentation</title>

<link rel="stylesheet" href="css/Style.css" type="text/css" />

<script language="JavaScript" src="js/FusionCharts.js"></script>

</head>



<body>



<form id="ist" runat="server">

    <div id="chartdiv"> 

        FusionCharts. </div> 

        <script type="text/javascript">

		   var chart = new FusionCharts("charts/FCF_Line.swf", "ChartId", "600", "350");

		   chart.setDataURL("sayacXML.aspx");		   

		   chart.render("chartdiv");

		</script>

</form>



</body>

default.aspx.cs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;



namespace flashchart

{

    public partial class _Default : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            icerik.icerik icerikreff = new icerik.icerik();

            icerikreff.ziyaretGuncelle();

        }

    }

}

sayacXML.aspx

1
2
3
4
5
6
7
8
9
 
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="sayacXML.aspx.cs" Inherits="flashchart.sayacXML" %>



<graph caption=' ' subcaption=' ' xAxisName='Gunler' yAxisMinValue='0' yAxisName='Ziyaret' decimalPrecision='0' formatNumberScale='0' numberPrefix=' ' showNames='1' showValues='0'  showAlternateHGridColor='1' AlternateHGridColor='ff5904' divLineColor='ff5904' divLineAlpha='20' alternateHGridAlpha='5' >

        <asp:Repeater ID="Repeater1" runat="server">

            <ItemTemplate>

                   <set name='<%# DataBinder.Eval(Container.DataItem, "gun") %>' value='<%# DataBinder.Eval(Container.DataItem, "sayac") %>' hovertext='<%# DataBinder.Eval(Container.DataItem, "gun") %>'></set>

            </ItemTemplate>

        </asp:Repeater>

</graph>

sayacXml.aspx.cs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 
using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;



namespace flashchart

{

    public partial class sayacXML : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {   

            icerik.icerik icerikReff = new icerik.icerik();

            DataTable dtVisit = new DataTable();



            Request.ContentType = "text/xml";

            

            dtVisit = icerikReff.ziyaretler();

            Repeater1.DataSource = dtVisit;

            Repeater1.DataBind();

        }

    }

}

icerik class ı

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
DataTable dataTableReff = new DataTable();

        OleDbConnection connectionReff = new OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=|DataDirectory|\\ist.mdb;User Id=admin;Password=;");

        OleDbDataAdapter dataAdapterReff;

        OleDbCommand commandReff;



      public void ziyaretEkle()

        {

            OleDbParameter[] parameter = { 

                                            new OleDbParameter("@sayi", OleDbType.Integer),

                                            new OleDbParameter("@gun", OleDbType.VarChar)

                                            };



            parameter[0].Value = 1;

            parameter[1].Value = DateTime.Today.ToString().Substring(0,10);



            runProcedure("INSERT INTO tblSayac(sayac, gun) VALUES (@sayi, @gun)",parameter);

        }



        public void ziyaretGuncelle()

        {

            DataTable dtSayi = new DataTable();

            dtSayi = runProcedure("Select sayac FROM tblSayac WHERE gun = '" + DateTime.Today.ToString().Substring(0,10) + "'");

            



            if (dtSayi.Rows.Count > 0)

            {

                int sayi = Convert.ToInt32(dtSayi.Rows[0][0]);

                sayi = sayi + 1;

                OleDbParameter[] parameter = { 

                                            new OleDbParameter("@sayi", OleDbType.Integer)

                                            };



                parameter[0].Value = sayi;

                runProcedure("UPDATE tblSayac SET sayac = @sayac WHERE gun = '" + DateTime.Today.ToString().Substring(0, 10) + "'",parameter);

            }

            else

            {

                ziyaretEkle();

            }

        }



        public DataTable ziyaretler()

        {

            DataTable dtZiy = new DataTable();

            dtZiy = runProcedure("SELECT TOP 7 sayac, gun FROM tblSayac");

            return dtZiy;

        }

yazıyoruz...

ziyaretGuncelle() fonksiyonumuz o gün içerisinde herhangi bir kayıt eklenmişmi bakıyor varsa ziyaret sayısını 1 arttırıyor yoksa o gün ait bir ziyaretEkle() fonksiyonuyla kayıt açıyor... ziyaretler fonksiyonu iste en son 7 günün kayıtlarını bize getiriyor...

veritabanına kayıt fonksiyonlarını kalıtım ile başka bir classtan aldığım için sadece fonksiyonları yazıyorum :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
public DataTable runProcedure(string sqlString)

        {

            dataTableReff.Reset();

            commandReff = new OleDbCommand(sqlString, connectionReff);

            dataAdapterReff = new OleDbDataAdapter(commandReff);

            connectionReff.Open();

            dataAdapterReff.Fill(dataTableReff);

            connectionReff.Close();



            return dataTableReff;

        }



        public void runProcedure(string sqlString, OleDbParameter[] parameter)

        {

            commandReff = new OleDbCommand(sqlString, connectionReff);



            connectionReff.Open();

            for (int i = 0; i < parameter.Length; i++)

            {

                commandReff.Parameters.Add(parameter[i]);

            }



            int etkilenenKayit = commandReff.ExecuteNonQuery();

            connectionReff.Close();



            commandReff.Parameters.Clear();

        }

evet bir yazımızın da sonuna geldik indirmiş olduğunuz rar dosyasında çok daha fazla grafik tablo örneği bulunmakta ben sadece basit olarak nasıl yapılacapğını anlattım... kolay gelsin...

/* Etiketler: , , */
/* mmacit yazdı. 05 Temmuz 2009 00:22. 4 yorum var */

Yorumlar

Öncelikle paylaşımın için emeğine sağlık. Bende birşeyler eklemek istiyorum. FusionCharts dökümantasyonunda da belirttiği gibi bütün grafiklerin ayrı ayrı XML dosyaları var. Her XML dosyası içerisinde "graph", "Dataset", "Set", "Value" tagleri mevcut. Bir class yapısı içerisinde bu parametleri database den gelen bilgilerle dinamik olarak doldurursak ve son olarak ouşan XML dosyasını RenderChart fonksiyonuna gönderirsek. String döndüren renderchart fonksiyonunu c# componentlerinden biri olan literal'e eşitlediğimiz zaman bütün FusionCharts grafiklerine kolayca ulaşabiliriz. ( Bu örnekte XML' in dolması için databesedeki ziyaretçi bilgilerinin güncel olması gerekmektedir.)

/* canertong | 06 Temmuz 2009 08:07 */

@canertog yorumun ve yaptığın ekleme için teşekkür ederim... eminiimki örneği kullanan arkadaşlar için faydalı olacaktır...

/* mmacit | 06 Temmuz 2009 09:43 */

teşekkürler :)

/* queennothing | 11 Temmuz 2009 00:35 */

teşekkürler....

/* neon38 | 16 Kasım 2009 18:15 */

üye olunpillinetwork sitelerine yorum ekleyebilmek ve daha fazlası için, üye olun ya da giriş yapın.

Bu Yazıyı Tutanlar

laroux
queennothing
mmacit
canertong
Bu yazıyı rapor et. Kural dışı içeriğe rastladığınızda editörlerimize rapor ederek müdahale edilmesini sağlayabilirsiniz. (Hangi durumlarda rapor edebilirim?)

Bu site

Nokta ve pilli ortak yapımı olan kodaman.org hep birlikte içerik üretip gelirini yazarları ile paylaştığımız kolektif bir kod yazarları blogudur. Siz de katılabilirsiniz.

pilliilan

Bu siteye ilan vermek 7ytl/gün'den başlayan fiyatlarla

son yorumlar

devamı »

arama

pillinetwork