Latest web development tutorials

ASP.NET Web Pages Bagan

Grafik pembantu - salah satu dari banyak ASP.NET berguna Helper Web.

grafik Helper

Pada bab sebelumnya, Anda belajar bagaimana menggunakan ASP.NET ini "penolong."

Seperti yang sudah dijelaskan bagaimana menggunakan "WebGrid penolong" untuk menampilkan data dalam kotak.

Bab ini menjelaskan cara menggunakan "Chart Helper" grafis yang ditampilkan data.

"Bagan Helper" dapat membuat berbagai jenis label dengan berbagai pilihan format dan grafik gambar. Hal ini dapat membuat grafik area, bar chart, grafik kolom, grafik garis, diagram lingkaran dan standar lainnya, dapat membuat bagan profesional lebih seperti grafik saham.

grafikgrafik

Data dapat ditampilkan dalam grafik dari sebuah array, data adalah database atau file.

Membuat grafik berdasarkan array

Contoh berikut menunjukkan kode yang diperlukan untuk memetakan data dari array:

contoh

@{
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Employees")
.AddSeries(chartType: "column",
xValue: new[] { "Peter", "Andrew", "Julie", "Mary", "Dave" },
yValues: new[] { "2", "6", "4", "5", "3" })
.Write();
}

Menjalankan contoh »

- New Chart membuat objek grafik baru dan mengatur lebar dan tinggi

- Metode AddTitle menentukan judul grafik

- AddSeries metode untuk meningkatkan data untuk grafik

- Parameter ChartType mendefinisikan jenis grafik

- Parameter NamaXvalue mendefinisikan sumbu x

- NamayValues parameter mendefinisikan sumbu y

- Write () metode untuk menampilkan grafik

Membuat grafik berdasarkan database

Anda dapat melakukan query database, dan kemudian menggunakan hasil query data untuk membuat grafik:

contoh

@{
var db = Database.Open("SmallBakery");
var dbdata = db.Query("SELECT Name, Price FROM Product");
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Product Sales")
.DataBindTable(dataSource: dbdata, xField: "Name")
.Write();
}

Menjalankan contoh »

- Var db = Database.Open membuka database (database objek ditugaskan ke db variabel)

- Var dbdata = db.Query melakukan query database dan menyimpan hasil di dbdata yang

- New Chart membuat objek grafik baru dan mengatur lebar dan tinggi

- Metode AddTitle menentukan judul grafik

- Metode DataBindTable untuk mengikat sumber data untuk grafik

- Write () metode untuk menampilkan grafik

Selain menggunakan luar metode DataBindTable, metode lain adalah dengan menggunakan AddSeries (lihat contoh sebelumnya). DataBindTable mudah untuk digunakan, tetapi AddSeries lebih fleksibel, karena Anda dapat lebih jelas menentukan grafik dan data:

contoh

@{
var db = Database.Open("SmallBakery");
var dbdata = db.Query("SELECT Name, Price FROM Product");
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Product Sales")
.AddSeries(chartType:"Pie",
xValue: dbdata, xField: "Name",
yValues: dbdata, yFields: "Price")
.Write();
}

Menjalankan contoh »

Membuat grafik berdasarkan data XML

Metode ketiga adalah untuk membuat grafik menggunakan file XML sebagai data grafik:

contoh

@using System.Data;

@{
var dataSet = new DataSet();
dataSet.ReadXmlSchema(Server.MapPath("data.xsd"));
dataSet.ReadXml(Server.MapPath("data.xml"));
var dataView = new DataView(dataSet.Tables[0]);
var myChart = new Chart(width: 600, height: 400)
.AddTitle("Sales Per Employee")
.AddSeries("Default", chartType: "Pie",
xValue: dataView, xField: "Name",
yValues: dataView, yFields: "Sales")
.Write();}
}

Menjalankan contoh »