ASP.NET Web Pages - مساعد الرسم البياني

الرسم البياني - أحد مساعدي ASP.NET Web المفيدة.

مساعد الرسم البياني

في الفصل السابق، تعلمت كيفية استخدام "مساعد 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();
}

تشغيل المثال

new Chart إنشاء كائن رسم بياني جديد وضبط عرضه وارتفاعه.

AddTitle تحديد عنوان رسم البيانات.

AddSeries إضافة بيانات إلى رسم البيانات.

chartType تحديد نوع رسم البيانات.

xValue تحديد قيمة المحور العمودي.

yValues تحديد قيمة المحور الصحيح.

Write() يظهر هذا الطريقة رسم البيانات.

رسم بياني من قاعدة البيانات

يمكنك أولاً تشغيل استعلام قاعدة البيانات مرة واحدة ثم استخدام بيانات النتيجة لإنشاء رسم بياني:

مثال

@{ 
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.

new Chart إنشاء كائن رسم بياني جديد وضبط عرضه وارتفاعه.

AddTitle تحديد عنوان رسم البيانات.

DataBindTable تحديد مصدر البيانات على رسم البيانات.

Write() يظهر هذا الطريقة رسم البيانات.

البديل لمتغير 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();}
}

تشغيل المثال