您的位置:首页 > 其它

利用jqchart制作图表

2016-09-26 16:50 351 查看
这个是使用jqchart做的。。。

function jqChart()
{
if($("#startTime").val()>$("#endTime").val()||($("#startTime").val()>getNowFormatDate("month")&&$("#startTime").val()>getNowFormatDate()))
{
layer.msg("请输入正确时间");
return;
}
var BeginTime =$("#startTime").val();
var EndTime = $("#endTime").val();
var OptionType=$('input[name="optiontype"]:checked').val();
$.ajax({
url: '/WebUI_Index.aspx?method=GetData',
type: 'POST',
data: { BeginTime: BeginTime, EndTime: EndTime,OptionType:OptionType},
dataType: "json",
cache: false,
async: false,
success: function (data) {
var dataJson=[[],[],[],[]];
for(var i=0;i<data.length;i++)
{
var chObj = data[i];
for (var j = 0; j < chObj.length; j++) {
dataJson[i].push([chObj[j].time,chObj[j].amount]);
}
}
$('#jqChart').jqChart({
title: { text: '资金总览' },
tooltips: { type: 'shared' },
animation: { duration: 1 },
series: [
{
type: 'line',
title: '已付款',
strokeStyle: '#418CF0',
lineWidth: 2,
data: dataJson[0]
},
{
type: 'line',
title: '已收款',
strokeStyle: '#FCB441',
lineWidth: 2,
data: dataJson[1]
},
{
type: 'line',
title: '应付款',
strokeStyle: '#0094ff',
lineWidth: 2,
data: dataJson[2]
},
{
type: 'line',
title: '应收款',
strokeStyle: '#b9b9b9',
lineWidth: 2,
data: dataJson[3]
}
]
});
},
error: function (jqXHR, textStatus, errorThrown) {
layer.msg(jqXHR.responseText);
}
});
}


Dictionary<string, object> result = new Dictionary<string, object>();
List<Data> data = new List<Data>();
result.Add("access", getData_exec(all_amount));
result.Add("pay", GetList(GetTable(sql_pay), OptionType, day));
result.Add("received", GetList(GetTable(sql_received), OptionType, day));
result.Add("payable", GetList(GetTable(sql_payable), OptionType, day));
result.Add("receivable", GetList(GetTable(sql_receivable), OptionType, day));
string access = result["access"].ToString();
List<statistics> pay = result["pay"] as List<statistics>;
List<statistics> received = result["received"] as List<statistics>;
List<statistics> payable = result["payable"] as List<statistics>;
List<statistics> receivable = result["receivable"] as List<statistics>;
ArrayList arrList = new ArrayList();
arrList.Add(pay);
arrList.Add(received);
arrList.Add(payable);
arrList.Add(receivable);
JavaScriptSerializer jss = new JavaScriptSerializer();
string str = jss.Serialize(arrList);
HttpContext.Current.Response.Clear();
HttpContext.Current.Response.Write(str);
HttpContext.Current.Response.End();


最终效果图例:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: