javascript - How to bind data from Controler to chartjs line chart to create it as dynamic? -

i using chart.js create chart data recive using linq query in controler , return values json far have tried , isnt getting values of json, here have tried far:-

this controller:-

 [httppost]     public jsonresult monthlyturnover(string info)     {         var list = (from c in nmsdc.datasends                     c.userid == session["userid"].tostring() && c.rcommission != null && c.dt.month == datetime.now.month                     group c new { c.userid, c.dt.date } g1                     orderby g1.key.date descending                     select new monthlyturnoverchart                     {                         amount = g1.sum(item => item.value),                         nooftransaction = (int)g1.count(),                         //date = g1.key.date.toshortdatestring()                     }).tolist();         return json(list, jsonrequestbehavior.allowget);     } 

and view , javascript follows:-

<div class="col-md-6" style="margin-left: 2em;">    <!-- line chart -->    <div class="box box-primary">      <div class="box-header with-border">        <h3 class="box-title">monthly turnover</h3>        <div class="box-tools pull-right">          <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>          </button>        </div>      </div>      <div class="box-body">        <div class="chart">          <canvas id="linechart" height="200" width="200"></canvas>        </div>      </div>      <!-- /.box-body -->    </div>    <!-- /.box -->  </div>

now javascript wrote:-

$(function() {    var path = window.location.href;    if (path == "http://localhost:55261/retailer") {      var info = $("#lbllogininfo").val();      alert(info);      $.ajax({        type: "post",        url: '/retailer/monthlyturnover',        data: json.stringify({          info: info        }),        datatype: 'json',        contenttype: 'application/json',        success: function(list) { << < ---------------the problem here          getting values            [[object][object], [object][object], [object][object], [object][object]] ------ >>              alert("all data recivcd :" + list);          var alldata = $.each(list, function(data) {            alldata = "'" + data.amount + "'";          });          var lbl = alldata[0];          var dataset1 = alldata[1];          var dataset2 = alldata[2];              var cdata = {            labels: lbl,            datasets: [{              label: "my first dataset",              fillcolor: "rgba(220,220,220,0.2)",              strokecolor: "rgba(220,220,220,1)",              pointcolor: "rgba(220,220,220,1)",              pointstrokecolor: "#fff",              pointhighlightfill: "#fff",              pointhighlightstroke: "rgba(220,220,220,1)",              data: dataset1            }, {              label: "my second dataset",              fillcolor: "rgba(151,187,205,0.2)",              strokecolor: "rgba(151,187,205,1)",              pointcolor: "rgba(151,187,205,1)",              pointstrokecolor: "#fff",              pointhighlightfill: "#fff",              pointhighlightstroke: "rgba(151,187,205,1)",              data: dataset2            }]            };          alert("alldata: " + alldata);          alert("chart data: " + list);          chart.defaults.global.responsive = true;          var ctx = $("#linechart").get(0).getcontext('2d');          var linechart = new chart(ctx).line(cdata, {            beziercurve: false          });        },        error: function(data) {          alert("chart error: " + data);        }      });    }  });

and model follows:

public class monthlyturnoverchart {     public decimal amount { get; set; }     public nullable<int> nooftransaction { get; set; }     public string date { get; set; } } 

you have use sort of loop.

please note property case may differ on side due settings on json serializer

var dataset1 = new array(); var dataset2 = new array();  (var = 0; < list.length; i++) {   dataset1.push(list[i].amount);   dataset2.push(list[i].nooftransaction); } 

dataset1 :

[amount1, amount2, amount3, amount4, amount5]

dataset2 :

[nooftransaction1, nooftransaction2, nooftransaction3, nooftransaction4, nooftransaction5]