ASP.NET वेब पेज - चार्ट हेल्पर
चार्ट हेल्पर - कई उपयोगी ASP.NET वेब हेल्पर्स में से एक।
चार्ट हेल्पर
पिछले अध्यायों में, आपने सीखा कि ASP.NET "हेल्पर" का उपयोग कैसे किया जाता है।
आपने "वेबग्रिड हेल्पर" का उपयोग करके ग्रिड में डेटा प्रदर्शित करना सीखा।
यह अध्याय बताता है कि "चार्ट हेल्पर" का उपयोग करके डेटा को ग्राफिकल रूप में कैसे प्रदर्शित किया जाए।
"चार्ट हेल्पर" कई स्वरूपण विकल्पों और लेबल के साथ विभिन्न प्रकार की चार्ट छवियां बना सकता है। यह स्टॉक चार्ट जैसे अधिक विशिष्ट चार्ट के साथ-साथ क्षेत्र चार्ट, बार चार्ट, कॉलम चार्ट, लाइन चार्ट और पाई चार्ट जैसे मानक चार्ट बना सकता है।
आपके द्वारा चार्ट में प्रदर्शित किया जाने वाला डेटा किसी सरणी से, किसी डेटाबेस से, या किसी फ़ाइल के डेटा से हो सकता है।
एक सरणी से चार्ट
नीचे दिया गया उदाहरण मूल्यों की एक सरणी से चार्ट प्रदर्शित करने के लिए आवश्यक कोड दिखाता है:
उदाहरण
@{
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();
}
- नया चार्ट एक नया चार्ट ऑब्जेक्ट बनाता है और इसकी चौड़ाई और ऊंचाई निर्धारित करता है
- AddTitle विधि चार्ट शीर्षक निर्दिष्ट करती है
- AddSeries विधि चार्ट में डेटा जोड़ती है
- चार्ट टाइप पैरामीटर चार्ट के प्रकार को परिभाषित करता है
- xValue पैरामीटर x-अक्ष नामों को परिभाषित करता है
- yValues पैरामीटर y-अक्ष मानों को परिभाषित करता है
- लिखें () विधि चार्ट प्रदर्शित करती है
डेटाबेस डेटा से चार्ट
आप एक डेटाबेस क्वेरी चला सकते हैं और फिर चार्ट बनाने के लिए परिणामों से डेटा का उपयोग कर सकते हैं:
उदाहरण
@{
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 = Database.Open डेटाबेस को खोलता है (और डेटाबेस ऑब्जेक्ट को वेरिएबल db को असाइन करता है)
- var dbdata = db.Query एक डेटाबेस क्वेरी चलाता है और परिणाम को dbdata में संग्रहीत करता है
- नया चार्ट एक चार्ट नई वस्तु बनाता है और इसकी चौड़ाई और ऊंचाई निर्धारित करता है
- AddTitle विधि चार्ट शीर्षक निर्दिष्ट करती है
- DataBindTable विधि डेटा स्रोत को चार्ट से बांधती है
- लिखें () विधि चार्ट प्रदर्शित करती है
DataBindTable पद्धति का उपयोग करने का एक विकल्प AddSeries (पिछला उदाहरण देखें) का उपयोग करना है। DataBindTable का उपयोग करना आसान है, लेकिन AddSeries अधिक लचीला है क्योंकि आप चार्ट और डेटा को अधिक स्पष्ट रूप से निर्दिष्ट कर सकते हैं:
उदाहरण
@{
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();
}
एक्सएमएल डेटा से चार्ट
चार्टिंग के लिए तीसरा विकल्प चार्ट के डेटा के रूप में XML फ़ाइल का उपयोग करना है:
उदाहरण
@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();}
}
चार्ट वस्तु संदर्भ
| 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. |