title: Updating highcharts dynamically with json response
body: <p>I am trying to draw highcharts with the json response, however I can able to draw for the first time, but unable to update the series with new data </p>
  
  <pre><code>function get_chart(data) {
      //alert('hello..' + data);
  
          return {
              xAxis: {        
                  type: 'datetime',
                  labels: {
                      formatter: function() {
                          var monthStr = Highcharts.dateFormat('%b', this.value);
                          var firstLetter = monthStr.substring(0, 1);
                          return firstLetter;
                      }
                  }
              },
              title: {
                  text: data.measurementName
              },
              chart: {
                  height: 300,
                  width: 500,
                  type: 'column',
                  zoomType: 'x'
              },
              credits: {
                  enabled: false
              },
              plotOptions: {
                  series: {
                      cursor: 'pointer',
                      point: {
                          events: {
                              click: function() {
                                  console.log ('Category: '+ this.category +', value: '+ this.y);
                              }
                          }
                      }
                  }
              },
  
              series: [{
                      name: 'Hours',
                      data: (function() {
                          var chart = [{key:data.measurementName, values:[]}];
  
                          var i = 0;
                          if(typeof(data) == 'string')return chart;
  
                          for(n in data.values){
                              data.values[n].snapshot = new Date(data.values[n].snapshot);
                              data.values[n].value = parseInt(data.values[n].value);
                          }
  
                          chart[0].values = data.values.map(function(arrayObj){
                              return [arrayObj.value]
                          });
  
                          return  chart[0].values;
                      })()
                  }]
          };
      } 
  </code></pre>
  
  <p>and I am calling this function like</p>
  
  <pre><code>$scope.renderChart = function(measurement){
          $scope.showChart = false;
  
          restApp.getMeasurementForCompID(comp.id, measurement.id).then(function(data){
  
              console.log(data);
  
              $scope.example_chart = get_chart(data);
              console.log($scope.example_chart);
  
              $scope.showChart = true;
          });
  
      }
  </code></pre>
  
  <p>Here getMeasurementForCompID is another function which gets the data from database.
  What is the problem here? any help..</p>