How to dynamically add Series of data to line chart using high chart

Question

The data from webservice is got from BindTrend method and it is parsed to Json object before binding to the chart: My code is as follows:

 var plot;
    var itemdata = [];
    var chart;
    var data = [];
 $(document).ready(function () {

            $.ajax({
            type: "POST",
            url: "ChartBinder.asmx/BindTrend",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {           
               var newJ = $.parseJSON(msg.d);               
                DrawTrend(newJ);
            },
            error: function (msg) {
                alert("Error");
            }
        });    
    })   

    function DrawTrend(plot) {
       for (i = 0; i < plot.length; i++) {
        var x = {}
        x.id=plot[i].Name;
        x.name = plot[i].Name;
        x.data = [plot[i].Value];
        itemdata.push(x);
        }
              chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'line',
                marginRight: 130,
                marginBottom: 25
            },
            series: itemdata
        });
    }

Please note when I hardcode the values 'x.data=[1,2,3....]' , I am able to get the chart. Kindly help.

Answer 1

From what you mentioned in the comment, looks like your plot[i].Value is an array of Strings , it should be array of numbers/floats. You can do the conversion in javascript as follows. Also no need to add [ & ] around the value explicitly, a JS array has it in it by default.

   for (i = 0; i < plot.length; i++) {
        var x = {}
        x.id=plot[i].Name;
        x.name = plot[i].Name;

        //plot[i].Value = ["3121", "21211", "3121", "21211", "21000", "9872", "83402", "83402", "28302", "109523", "2832", "9523"];

        var stringArr=plot[i].Value;
        var floatArr=[];
        for(var j=0;j<stringArr.length;j++){
           dobleArr.push(parseFloat(stringArr[j]);
        }
        x.data=floatArr;

        itemdata.push(x);
   }

I would suggest going through Highcharts returning error 14 as well

Answer 2

is that because you declare x in 'for' ?

 var x = {}
 function DrawTrend(plot) {
       for (i = 0; i < plot.length; i++) {

        x.id=plot[i].Name;
        x.name = plot[i].Name;
        x.data = [plot[i].Value];
        itemdata.push(x);
        }