ASP.NET-webbladsye - The Chart Helper
The Chart Helper - Een van baie nuttige ASP.NET Web Helpers.
Die Chart Helper
In die vorige hoofstukke het jy geleer hoe om 'n ASP.NET "Helper" te gebruik.
Jy het geleer hoe om data in 'n rooster te vertoon deur die "WebGrid Helper" te gebruik.
Hierdie hoofstuk verduidelik hoe om data in grafiese vorm te vertoon, deur die "Chart Helper" te gebruik.
Die "Chart Helper" kan grafiekbeelde van verskillende tipes skep met baie formatering opsies en etikette. Dit kan standaardkaarte soos areakaarte, staafgrafieke, kolomgrafieke, lyngrafieke en sirkeldiagramme skep, tesame met meer gespesialiseerde kaarte soos voorraadkaarte.
Die data wat jy in 'n grafiek vertoon, kan van 'n skikking, vanaf 'n databasis of van data in 'n lêer wees.
Grafiek van 'n skikking
Die voorbeeld hieronder toon die kode wat nodig is om 'n grafiek van 'n verskeidenheid waardes te vertoon:
Voorbeeld
@{
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();
}
- nuwe grafiek skep 'n nuwe kaartvoorwerp en stel sy breedte en hoogte in
- die AddTitle- metode spesifiseer die grafiektitel
- die AddSeries- metode voeg data by die grafiek
- die chartType parameter definieer die tipe grafiek
- die xValue parameter definieer x-as name
- die yValues parameter definieer die y-as waardes
- die Write() metode vertoon die grafiek
Grafiek Van Databasis Data
Jy kan 'n databasisnavraag uitvoer en dan data uit die resultate gebruik om 'n grafiek te skep:
Voorbeeld
@{
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();
}
- var db = Databasis. Open maak die databasis oop (en ken die databasisobjek aan die veranderlike db toe)
- var dbdata = db.Query loop 'n databasisnavraag en stoor die resultaat in dbdata
- nuwe grafiek skep 'n grafiek nuwe voorwerp en stel sy breedte en hoogte
- die AddTitle- metode spesifiseer die grafiektitel
- die DataBindTable- metode bind die databron aan die grafiek
- die Write() metode vertoon die grafiek
'n Alternatief vir die gebruik van die DataBindTable-metode is om AddSeries te gebruik (Sien vorige voorbeeld). DataBindTable is makliker om te gebruik, maar AddSeries is meer buigsaam omdat jy die grafiek en data meer eksplisiet kan spesifiseer:
Voorbeeld
@{
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();
}
Grafiek van XML-data
Die derde opsie vir kartering is om 'n XML-lêer as die data vir die grafiek te gebruik:
Voorbeeld
@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();}
}
Grafiekvoorwerpverwysing
| Helper | Description |
|---|---|
| Chart(width, height [, template] [, templatePath]) | Initializes a chart. |
| Chart.AddLegend([title] [, name]) | Adds a legend to a chart. |
| Chart.AddSeries([name] [, chartType]
[, chartArea] [, axisLabel] [, legend] [, markerStep] [, xValue] [, xField] [, yValues] [, yFields] [, options]) |
Adds a series of values to the chart. |