echarts ajax样例,Echarts 和 Ajax

1、json

public JsonResult Return_Title(string RelGuid)

{

Base_Model base_Model = new Base_Model();

if (string.Format("{0}", RelGuid) != "")

{

base_Model = new Base_Dal().GetDetailByCE("EchartsBase_003", "RelGuid", RelGuid);

}

JsonResult jr_TextStyle = Return_TextStyle(base_Model.CE13);

JsonResult json = new JsonResult();

json.Data = new

{

show = base_Model.CE01,

text = base_Model.CE02,

left = base_Model.CE03,

top = base_Model.CE04,

right = base_Model.CE05,

bottom = base_Model.CE06,

x = base_Model.CE07,

y = base_Model.CE08,

backgroundColor = base_Model.CE09,

borderColor = base_Model.CE10,

borderWidth = base_Model.CE11,

borderRadius = base_Model.CE12,

textStyle = jr_TextStyle,

};

return json;

//JavaScriptSerializer js = new JavaScriptSerializer();

//string treeStr = js.Serialize(json.Data);

//return Content(treeStr);

}

var myChart = echarts.init(document.getElementById('@divModel.CE01'));

var dataarr = {};

$.ajax({

async: false, //这句必须加

method: 'post',

url: 'Return_Title',

data: { "RelGuid": '@divModel.RowGuid' },

dataType: "json",

success: function (data) {

dataarr = data;

}

});

option = {

title: dataarr,

xAxis: {

type: 'category',

data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']

},

yAxis: {

type: 'value'

},

series: [{

data: [820, 932, 901, 934, 1290, 1330, 1320],

type: 'line'

}]

};

//myChart.showLoading(); //数据加载完之前先显示一段简单的loading动画

// 使用刚指定的配置项和数据显示图表。

myChart.setOption(option);

2、String

public ActionResult Return_Title(string RelGuid)

{

Base_Model base_Model = new Base_Model();

if (string.Format("{0}", RelGuid) != "")

{

base_Model = new Base_Dal().GetDetailByCE("EchartsBase_003", "RelGuid", RelGuid);

}

JsonResult jr_TextStyle = Return_TextStyle(base_Model.CE13);

JsonResult json = new JsonResult();

json.Data = new

{

show = base_Model.CE01,

text = base_Model.CE02,

left = base_Model.CE03,

top = base_Model.CE04,

right = base_Model.CE05,

bottom = base_Model.CE06,

x = base_Model.CE07,

y = base_Model.CE08,

backgroundColor = base_Model.CE09,

borderColor = base_Model.CE10,

borderWidth = base_Model.CE11,

borderRadius = base_Model.CE12,

textStyle = jr_TextStyle,

};

//return json;

JavaScriptSerializer js = new JavaScriptSerializer();

string treeStr = js.Serialize(json.Data);

return Content(treeStr);

}

var myChart = echarts.init(document.getElementById('@divModel.CE01'));

var dataarr = {};

$.ajax({

async: false, //这句必须加

method: 'post',

url: 'Return_Title',

data: { "RelGuid": '@divModel.RowGuid' },

dataType: "text",

success: function (data) {

dataarr = data;

}

});

option = {

title: JSON.parse(dataarr),

xAxis: {

type: 'category',

data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']

},

yAxis: {

type: 'value'

},

series: [{

data: [820, 932, 901, 934, 1290, 1330, 1320],

type: 'line'

}]

};

//myChart.showLoading(); //数据加载完之前先显示一段简单的loading动画

// 使用刚指定的配置项和数据显示图表。

myChart.setOption(option);