Der Chart-Helper - Ein von vielen nützlichen ASP.NET Web-Helfern.
Der Chart-Helper
In den vorangegangenen Kapiteln haben Sie erfahren , wie Sie eine ASP.NET verwenden "Helper" .
Sie haben gelernt , wie Daten in einem Raster , um die Verwendung anzuzeigen "WebGrid Helper" .
Dieses Kapitel beschreibt , wie die Daten in grafischer Form angezeigt werden , die unter Verwendung von "Chart Helper" .
Der "Chart Helper" kann Diagramm Bilder von verschiedenen Typen mit vielen Formatierungsoptionen und Etiketten erstellen. Es können Standard-Charts wie Flächendiagramme, Balkendiagramme, Säulendiagramme, Liniendiagramme und Kreisdiagramme erstellen, zusammen mit spezialisierteren Charts wie Charts.
Die Daten, die Sie in einem Diagramm anzeigen können aus einem Array sein, aus einer Datenbank oder von Daten in einer Datei.
Diagramm aus einem Array
Das folgende Beispiel zeigt den Code benötigt ein Diagramm aus einem Array von Werten angezeigt werden:
Beispiel
@{
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();
} Führen Sie zB » - new Chart erstellt ein neues Diagramm - Objekt und stellt seine Breite und Höhe
- die AddTitle Methode gibt den Diagrammtitel
- die AddSeries Methode fügt Daten auf der Karte
- der chartType Parameter definiert den Typ des Diagramms
- der xValue Parameter definiert Namen X-Achse
- der yValues - yValues Parameter definiert die y-Achsen - Werte
- die Write() Methode zeigt das Diagramm
Diagramm von Datenbankdaten
Sie können eine Datenbank-Abfrage ausführen und dann Daten aus den Ergebnissen verwenden, um ein Diagramm zu erstellen:
Beispiel
@{
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();
} Führen Sie zB » - var db = Database.Open öffnet die Datenbank (und ordnet das Datenbankobjekt auf die Variable db)
- var dbdata = db.Query betreibt eine Datenbank - Abfrage und speichert das Ergebnis in dbdata
- new Chart erstellt ein Diagramm neues Objekt und setzt seine Breite und Höhe
- die AddTitle Methode gibt den Diagrammtitel
- die DataBindTable Verfahren bindet die Datenquelle zu dem Chart
- die Write() Methode zeigt das Diagramm
Eine alternative Methode, die DataBindTable zu verwenden ist AddSeries zu verwenden (siehe vorheriges Beispiel). DataBindTable ist einfacher zu bedienen, aber AddSeries ist flexibler, da Sie das Diagramm und Daten mehr explizit angeben:
Beispiel
@{
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();
} Führen Sie zB » Diagramm aus XML-Daten
Die dritte Option für Charting ist eine XML-Datei, wie die Daten für das Diagramm zu verwenden:
Beispiel
@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();}
} Führen Sie zB »