صفحات ويب ASP.NET - مساعد التخطيط
مساعد التخطيط - واحد من العديد من مساعدي ويب ASP.NET المفيد.
مساعد التخطيط
في الفصول السابقة ، تعلمت كيفية استخدام "مساعد" ASP.NET.
لقد تعلمت كيفية عرض البيانات في شبكة باستخدام "WebGrid Helper".
يشرح هذا الفصل كيفية عرض البيانات في شكل رسومي باستخدام "مساعد التخطيط".
يمكن لـ "مساعد التخطيط" إنشاء صور مخططات من أنواع مختلفة مع العديد من خيارات التنسيق والتسميات. يمكنه إنشاء مخططات قياسية مثل مخططات المساحة والمخططات الشريطية والمخططات العمودية والمخططات الخطية والمخططات الدائرية ، إلى جانب مخططات أكثر تخصصًا مثل مخططات الأسهم.
يمكن أن تكون البيانات التي تعرضها في مخطط من مصفوفة أو من قاعدة بيانات أو من بيانات في ملف.
مخطط من صفيف
يوضح المثال أدناه الكود المطلوب لعرض مخطط من مجموعة من القيم:
مثال
@{
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
الخيار الثالث للمخططات هو استخدام ملف 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. |