Wykres Helper - Jedno z wielu przydatnych pomocników ASP.NET Web.
Wykres Helper
W poprzednich rozdziałach, nauczyłeś się, jak korzystać z ASP.NET "Helper" .
Nauczyłeś się, jak do wyświetlania danych w siatce za pomocą "WebGrid Helper" .
W tym rozdziale opisano sposób wyświetlania danych w formie graficznej, korzystając z "Chart Helper" .
"Chart Helper" może tworzyć obrazy różnych typów wykresów z wielu opcji formatowania i etykiety. Można tworzyć standardowe wykresy, takie jak wykresy strefy, wykresy słupkowe, wykresy kolumnowe, wykresy liniowe i wykresy kołowe, wraz z bardziej specjalistycznych wykresów, takich jak wykresy giełdowe.
Dane wyświetlać na wykresie może być z tablicy, z bazy danych lub z danymi w pliku.
Wykres z tablicy
Poniższy przykład przedstawia kod potrzebne do wyświetlenia wykresu z tablicy wartości:
Przykład
@{
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();
} Uruchomić przykład » - new Chart tworzy nowy obiekt wykresu i ustawia jego szerokość i wysokość
- w AddTitle metody podano tytułem wykres
- w AddSeries metoda dodaje dane do wykresu
- w chartType parametr określa typ wykresu
- w xValue parametr definiuje nazwy oś X
- w yValues parametru określa wartość oś y
- w Write() metoda wyświetla wykres
Wykres Z danych bazy danych
Można wykonać zapytanie do bazy danych, a następnie użyć danych z wynikami utworzyć wykres:
Przykład
@{
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();
} Uruchomić przykład » - var db = Database.Open otwiera bazę danych (i przypisuje obiektu bazy danych do zmiennej db)
- var dbdata = db.Query biegnie zapytania do bazy danych i zapisuje wynik w dbdata
- new Chart tworzy wykres nowy obiekt i ustawia jego szerokość i wysokość
- w AddTitle metody podano tytułem wykres
- w DataBindTable metoda wiąże źródło danych do wykresu
- w Write() metoda wyświetla wykres
Alternatywą do stosowania sposobu DataBindTable jest użycie AddSeries (patrz poprzedni przykład). DataBindTable jest łatwiejszy w użyciu, ale AddSeries jest bardziej elastyczny, ponieważ można określić wykres i dane bardziej wyraźnie:
Przykład
@{
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();
} Uruchomić przykład » Wykres Z danych XML
Trzecią opcją dla wykresów jest użycie pliku XML jako danych do wykresu:
Przykład
@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();}
} Uruchomić przykład »