Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 107,904

HOME > ASP.NET > ASP.NET Data Control > ASP.NET Chart - asp:Chart



Clound SSD Virtual Server

ASP.NET Chart - asp:Chart

ASP.NET & Chart เป็น Control ของในกลุ่มของ Data Control บน Framework 3.5 และ 4.0 ขึ้นไป ที่เข้ามาช่วยในการสร้างกราฟ ซึ่งสามารถใช้ Control Charts นี้สร้างกราฟได้อย่างง่ายดาย และสะดวกมากเลยทีเดียว และยังมีรูปแบบกราฟ รวมทั้งฟีเจอร์ให้เลือกใช้อีกมากมาย

สำหรับ .NET 3.5 จะต้องดาวน์โหลด Microsoft Chart Controls Add-on for Microsoft Visual Studio 2008 ด้วยครับ


ASP.NET & Chart

Framework : 3,4

สำหรับตัวอย่างนี้สามารถใช้ได้ทั้งภาษา VB.NET และ C#


เริ่มจากการ New Project ขึ้นมาใหม่ บน Visual Studio 2008 หรือสูงกว่านี้


ASP.NET & Chart

ทำการคลิกที่ Control ชื่อ Chart แล้วจากไปยังในส่วนของ Web Form


ASP.NET & Chart

สามารถเลือก Chart Type หรือสร้าง Data Source ขึ้นมาใหม่ โดยคลิกที่ New data source...


ASP.NET & Chart

ตัวอย่างนี้จะลองทดสอบ Chart จาก Access Database เลือก AccessDataSource


ASP.NET & Chart

เลือกไฟล์ ของ Microsoft Access (*.mdb)


ASP.NET & Chart

เลือก Table หรือจะเขียน Query เพิ่มก็ขึ้นอยู่กับความต้องการ








ASP.NET & Chart

ทดสอบการ Query จาก Table และเลือก Finish


ASP.NET & Chart

เลือก Chart Type พร้อมทั้งชื่อฟิวด์ข้อมูลสำหรับ แกน X และ แกน Y


ASP.NET & Chart

ทดสอบการทำงานก็จะได้ผลลัพธ์ดังรูปตัวอย่าง


โค้ดตัวอย่างสำหรับพัฒนาด้วยภาษา VB.NET

MyCharts.aspx

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="MyCharts.aspx.vb" Inherits="MyCharts" %>

<%@ Register assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" namespace="System.Web.UI.DataVisualization.Charting" tagprefix="asp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>ThaiCreate.Com Tutorial</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
        <asp:Chart ID="Chart1" runat="server" DataSourceID="myDataSource">
            <series>
                <asp:Series Name="Series1" ChartType="StackedColumn" XValueMember="Name" 
                    YValueMembers="Used">
                </asp:Series>
            </series>
            <chartareas>
                <asp:ChartArea Name="ChartArea1">
                </asp:ChartArea>
            </chartareas>
        </asp:Chart>
    
        <asp:AccessDataSource ID="myDataSource" runat="server" 
            DataFile="~/App_Data/mydatabase.mdb" SelectCommand="SELECT * FROM [customer]">
        </asp:AccessDataSource>
    
    </div>
    </form>
</body>
</html>



หรือจะต้องสร้างเขียน Code ในส่วนของ Code-Behind


AccessCharts.aspx

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="AccessCharts.aspx.vb" Inherits="AccessCharts" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>ThaiCreate.Com Tutorial</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
            <asp:Chart ID="Chart1" runat="server">
            <series>
                <asp:Series Name="Series1" />
            </series>
            <chartareas>
                <asp:ChartArea Name="ChartArea1" />
            </chartareas>
        </asp:Chart>
    </div>
    </form>
</body>
</html>



AccessCharts.aspx.vb

Imports System.Data
Imports System.Data.OleDb
Imports System.Web.UI.DataVisualization.Charting
Partial Class AccessCharts
    Inherits System.Web.UI.Page

    Dim objConn As OleDbConnection
    Dim objCmd As OleDbCommand

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

        Dim dt As New DataTable
        Dim strConnString As String
        Dim dtAdapter As OleDbDataAdapter

        strConnString = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & _
        Server.MapPath("App_Data/mydatabase.mdb") & ";Jet OLEDB:Database Password=;"
        objConn = New System.Data.OleDb.OleDbConnection(strConnString)
        objConn.Open()

        Dim strSQL As String
        strSQL = "SELECT * FROM customer"

        dtAdapter = New System.Data.OleDb.OleDbDataAdapter(strSQL, objConn)
        dtAdapter.Fill(dt)

        '*** BindData to Charts ***'
        Me.Chart1.DataSource = dt
        Me.Chart1.Series("Series1").ChartType = SeriesChartType.Column
        Me.Chart1.Series("Series1")("DrawingStyle") = "Emboss"
        Me.Chart1.Series("Series1").XValueMember = "Name"
        Me.Chart1.Series("Series1").YValueMembers = "Used"
        Me.Chart1.Series("Series1").IsValueShownAsLabel = True
        Me.Chart1.DataBind()

		dtAdapter = Nothing
        objConn.Close()
        objConn = Nothing

    End Sub

End Class



Screenshot

ASP.NET & Chart








   
Share


ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท


ลองใช้ค้นหาข้อมูล


   


Bookmark.   
       
  By : ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ)
  Score Rating :  
  Create/Update Date : 2010-07-04 22:23:44 / 2017-03-28 21:55:16
  Download : Download  ASP.NET Chart - asp:Chart
 Sponsored Links / Related

 
ASP.NET Data Control
Rating :

 
ASP.NET SqlDataSource - asp:SqlDataSource
Rating :

 
ASP.NET AccessDataSource - asp:AccessDataSource
Rating :

 
ASP.NET ObjectDataSource - asp:ObjectDataSource
Rating :

 
ASP.NET XmlDataSource - asp:XmlDataSource
Rating :

 
ASP.NET SiteMapDataSource - asp:SiteMapDataSource
Rating :

 
ASP.NET ReportViewer - rsweb:ReportViewer
Rating :

 
ASP.NET DataPager - asp:DataPager
Rating :

 
ASP.NET LinqDataSource - asp:LinqDataSource
Rating :

 
ASP.NET QueryExtender - asp:QueryExtender
Rating :

 
ASP.NET EntityDataSource - asp:EntityDataSource
Rating :


ThaiCreate.Com Forum


Comunity Forum Free Web Script
Jobs Freelance Free Uploads
Free Web Hosting Free Tools

สอน PHP ผ่าน Youtube ฟรี
สอน Android การเขียนโปรแกรม Android
สอน Windows Phone การเขียนโปรแกรม Windows Phone 7 และ 8
สอน iOS การเขียนโปรแกรม iPhone, iPad
สอน Java การเขียนโปรแกรม ภาษา Java
สอน Java GUI การเขียนโปรแกรม ภาษา Java GUI
สอน JSP การเขียนโปรแกรม ภาษา Java
สอน jQuery การเขียนโปรแกรม ภาษา jQuery
สอน .Net การเขียนโปรแกรม ภาษา .Net
Free Tutorial
สอน Google Maps Api
สอน Windows Service
สอน Entity Framework
สอน Android
สอน Java เขียน Java
Java GUI Swing
สอน JSP (Web App)
iOS (iPhone,iPad)
Windows Phone
Windows Azure
Windows Store
Laravel Framework
Yii PHP Framework
สอน jQuery
สอน jQuery กับ Ajax
สอน PHP OOP (Vdo)
Ajax Tutorials
SQL Tutorials
สอน SQL (Part 2)
JavaScript Tutorial
Javascript Tips
VBScript Tutorial
VBScript Validation
Microsoft Access
MySQL Tutorials
-- Stored Procedure
MariaDB Database
SQL Server Tutorial
SQL Server 2005
SQL Server 2008
SQL Server 2012
-- Stored Procedure
Oracle Database
-- Stored Procedure
SVN (Subversion)
แนวทางการทำ SEO
ปรับแต่งเว็บให้โหลดเร็ว


สุดยอด Source Code V2.0
 

แจ้งชำระเงิน/โอนเงิน
 

Hit Link
   







Load balance : Server 04
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2019 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 , 08-9968-0655 อัตราราคา คลิกที่นี่