Junaid Syed

Junaid Syed

  • 1.6k
  • 485
  • 107k

How can i append series data into highcharts in jquery

May 9 2018 12:48 AM
Hi iam trying to append the dynamic data to highchart in series.And iam using column chart my code in jquery is some thing like this
 
  1. <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>  
  2.   
  3. function GetEmpDetails() {  
  4.         $.ajax({  
  5.             type: "POST",  
  6.             url: "../Home/GetData",  
  7.             data: JSON.stringify({ abc: abc }),  
  8.             contentType: "application/json; charset=utf-8",  
  9.             dataType: "json",  
  10.             success: function (result) {  
  11.                 console.log(result);  
  12.                 for (x in result) {  
  13.                     var dataobject = new Object();  
  14.                     dataobject.salary = result[x].SALARY;  
  15.                     dataobject.name = result[x].NAME;  
  16.                     obj.push(dataobject);  
  17.                 }  
  18.                 visitorData(obj);  
  19.             }  
  20.   
  21.                 });  
  22.     }  
  23.   
  24.    function visitorData(obj) {  
  25.   
  26.   
  27.         Highcharts.chart('container', {  
  28.             chart: {  
  29.                 type: 'column'  
  30.             },  
  31.             title: {  
  32.                 text: 'Salary per Month'  
  33.             },  
  34.             subtitle: {  
  35.                 text: ''  
  36.             },  
  37.             xAxis: {  
  38.                 type: 'category',  
  39.                 categories: obj.NAME  
  40.             },  
  41.             yAxis: {  
  42.                 title: {  
  43.                     text: 'Total Work Done'  
  44.                 }  
  45.   
  46.             },  
  47.             legend: {  
  48.                 enabled: false  
  49.             },  
  50.             plotOptions: {  
  51.                 series: {  
  52.                     borderWidth: 0,  
  53.                     dataLabels: {  
  54.                         enabled: true,  
  55.                         format: '{point.y:.1f}%'  
  56.                     }  
  57.                 }  
  58.             },  
  59.   
  60.             tooltip: {  
  61.                 headerFormat: '<span style="font-size:11px">{series.name}</span><br>',  
  62.                 pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'  
  63.             },  
  64.   
  65.   
  66.             "series": [  
  67.                 {  
  68.                     "name""Browsers",  
  69.                     "colorByPoint"true,  
  70.                     "data": [  
  71.                             {  
  72.                                 "name": obj.names,  
  73.                                 "y": obj.salaries,  
  74.                             }  
  75.                     ]  
  76.                       
  77.                 }  
  78.             ]  
  79.         })  
  80.     } 
 if you see in above example in ajax call iam getting the dynamic data in RESULT in sucess message.Finally iam filtering the data and getting the 2 columns for X axis and Y axis data is getting perfectly but iam sturct at how to append in series in data.Iam getting the data in console in visitorData() like this
 
 
 
 Please help me...Thank you in advance
 
 

Answers (1)