แผนภูมิหน้าเว็บ ASP.NET
ผู้ช่วยแผนภูมิ - หนึ่งในหลาย ๆ เว็บ Helper ASP.NET ประโยชน์
Helper แผนภูมิ
ในบทก่อนหน้านี้คุณได้เรียนรู้วิธีการใช้ ASP.NET ของ "ผู้ช่วย."
เป็นแล้วอธิบายวิธีการใช้ "ผู้ช่วย WebGrid" เพื่อแสดงข้อมูลในตาราง
บทนี้จะอธิบายวิธีการใช้ "ผัง Helper" กราฟแสดงข้อมูล
"ชาร์ 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 วิธีการของการเพิ่มข้อมูลไปยังแผนภูมิ
- พารามิเตอร์ ChartType กำหนดประเภทของแผนภูมิ
- พารามิเตอร์ชื่อ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 เป็นข้อมูลแผนภูมิ:
ตัวอย่าง
@{
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();}
}
เล่นอินสแตนซ์»