1.柱状图
后台代码
public void getBar()
{
DataTable dt1 = null;
var result1 = new object();
string sqlstring1 = "select description as categoryList1,sales from testEChart where type='bar'";
dt1 = DbHelperSQL.Query(sqlstring1);
List<string> categoryList1 = new List<string>();
List<object> seriesList1 = new List<object>();
foreach (DataRow dr in dt1.Rows)
{
categoryList1.Add(dr[0].ToString());
seriesList1.Add(dr[1]);
}
var obj = new
{
category = categoryList1,
series = seriesList1,
};
ContextResponse(obj);
}
前台代码
/*************************************************柱状图************************************************/ var myChart = echarts.init(document.getElementById('main')); // 指定图表的配置项和数据 var option = { title: { text: '数据库连接测试' }, tooltip: {}, legend: { data: ["销量"] }, xAxis: { //url: "../AjaxTools/Chart.ashx?method=getData", type: 'category', data: null }, yAxis: {}, series: [{ name: '销量', type: 'bar', data: null }] }; myChart.setOption(option); var options = myChart.getOption(); $.ajax({ type: "post", async: false, //同步执行 url: "../AjaxTools/Chart.ashx?method=getBar", dataType: "json"$(document).ready(function () {