When loading chart the dynamic data is not showing.?

Question

MyRequirement:

 

I have chart and i need to load data into dynamically. when static daata given it will showing chart but when it loading data from database it doesnot showing.

 

 

 

Please help me out:

 

I am adding my code:

 

getting values form db:

protected void Page_Load(object sender, EventArgs e)

{

if (!Page.IsPostBack) {

GetIncome();

}

}

[WebMethod]

[ScriptMethod]

public static List GetIncome()

{

Util getcon = new Util();

List chart = new List();

string useruniq = "150883940";

SqlConnection con = getcon.GetConnection();

string querystring ="select IncomeType,UserIncomeDetail_Amount from ft_UserIncomeDetail inner join Dim_IncomeType on ft_UserIncomeDetail.IncomeType_Id = Dim_IncomeType.IncomeType_id where MONTH(UserIncomeDetail_Date) = MONTH(GETDATE()) and ft_UserIncomeDetail.User_Uniq = '"+ useruniq + "'";

SqlCommand cmd = new SqlCommand(querystring, con);

cmd.CommandType = CommandType.Text;

SqlDataReader dr = cmd.ExecuteReader();

while (dr.Read())

{

chart.Add(new Chart

{

IncomeType = dr["IncomeType"].ToString(),

IncomeAmount = dr["UserIncomeDetail_Amount"].ToString()

});

}

//cmd.Parameters.Add("@Uuniq", SqlDbType.VarChar).Value = useruniq;

//SqlDataAdapter sda = new SqlDataAdapter(cmd);

//DataTable dt = new DataTable();

//sda.Fill(dt);

//System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();

//List> rows = new List>();

//Dictionary row;

//foreach (DataRow dr in dt.Rows)

//{

// row = new Dictionary();

// foreach (DataColumn col in dt.Columns)

// {

// row.Add(col.ColumnName, dr[col]);

// // row.Add(col.ColumnName, dr[col]);

// }

// rows.Add(row);

//}

//con.Close();

//return serializer.Serialize(rows);

con.Close();

return chart;

}

 

 

and js code:

$(document).ready(function () {

$.ajax({

type: 'POST',

contentType: 'application/json; charset=utf-8',

url: 'UserIncome1.aspx/GetIncome',

data: '{}',

dataType: 'json',

success: OnSuccess,

failure: function (response) {

alert(response.d);

}

});

});

function getRandomColor() {

var letters = '0123456789ABCDEF';

var color = '#';

for (var i = 0; i < 6; i++) {

color += letters[Math.floor(Math.random() * 16)];

}

return color;

}

function OnSuccess(response) {

// var table = $("#dvCustomers table").eq(0).clone(true);

var customers = response.d;

var arr = [];

var arr1 = [];

var inval = "";

var ic = "";

var inval1 = "";

$(customers).each(function () {

arr.push(this.IncomeType);

arr1.push(this.IncomeAmount);

inval+= '{value:';

inval+=this.IncomeAmount;

inval+=', name:';

inval+="'"+this.IncomeType+"'";

inval += '},';

inval1 += { value: this.IncomeAmount, name: this.IncomeType };

inval1 += ",";

ic+="'"+getRandomColor()+"',";

});

ic = ic.substring(0, ic.length - 1);

console.log(inval1);

if( $('#e_chart_3').length > 0 ){

var eChart_3 = echarts.init(document.getElementById('e_chart_3'));

var option3 = {

tooltip : {

trigger: 'item',

formatter: '{a}
{b} : {c} ({d}%)',

backgroundColor: 'rgba(33,33,33,1)',

borderRadius:0,

padding:10,

textStyle: {

color: '#fff',

fontStyle: 'normal',

fontWeight: 'normal',

fontFamily: 'Poppins, sans-serif',

fontSize: 12

}

},

legend: {

show:false

},

toolbox: {

show : false,

},

calculable : true,

itemStyle: {

normal: {

shadowBlur: 5,

shadowColor: 'rgba(0, 0, 0, 0.5)'

}

},

series : [

{

name:'Month Income',

type:'pie',

radius : '80%',

center : ['50%', '50%'],

roseType : 'radius',

color: [ic],

label: {

normal: {

fontFamily: 'Poppins, sans-serif',

fontSize: 12

}

},

data: [

inval

].sort(function (a, b) { return a.value - b.value; }),

},

],

animationType: 'scale',

animationEasing: 'elasticOut',

animationDelay: function (idx) {

return Math.random() * 1000;

}

};

eChart_3.setOption(option3);

eChart_3.resize();

}

console.log(inval);

console.log(ic);

eChart_3.setOption(option3);

eChart_3.resize();

}

 

 

but getting data from back end but when it putting data into js it's not getting