44348

trying to dynamically update Highchart column chart but series undefined

I am trying to update an existing highcharts column chart with new information from a service. I am trying to do this by using the setdata method on the series but the series in "undefined". I am very new to this type of programming so I have no ideal what I am doing wrong. Any help would be greatly appreciated. My Code is below:

$('#chart22').highcharts({ colors: ['#FBB369', '#7798BF'], chart: { type: 'column' }, title: { text: 'Some Data' }, xAxis: { categories: ['Cat1', 'Cat2'] }, yAxis: { title: { text: 'Amount' }, labels: { formatter: function() { return this.value / 1000000000 +'B'; } } }, credits: { enabled: false }, exporting: { enabled: false }, series: [{ name: 'Amount', data: [-3450000000.25, 3670000000.35] }] }); setInterval(function() { getData(); }, 30000); function getData(){ console.log("retrieving data from server "); var url = "http://localhost/someserver call"; $.getJSON (url, function (Data44) { var data = data44; //we are good here // update the series data chart22.series[0].setData(data); chart22.series.setData(data); //both give the error that series is undefined ???? }); }

Answer1:

You haven't created the variable chart22 so it's no surprise that properties are undefined.

Try this

var timerId = setInterval(function() { console.log("retrieving data from server "); var url = "http://localhost/someserver call"; $.getJSON(url, function(data) { $('#chart22').highcharts().series[0].setData(data); }); }, 30000);

The JSFiddle demo for Series.setData should have shown you exactly what to do.

Recommend

  • nokia Imaging SDK customize BlendFilter
  • FileStream is not marked as serializable, but the whole class is?
  • Storing image in dojo datagrid
  • How to add html placeholder to select2?
  • Using nativescript converters
  • How to get mouse position in chart-space
  • How to convert time String into NSDate?
  • Jackson JsonDeserialize not being called for @QueryParam
  • How can I alter the spacing for the Y-Axis Labels in MPAndroidchart?
  • Json.Net TypeNameHandling.Auto and Asp Web Api Controller gives unexpected behaviour
  • Sqlite query, compare datetime field with current date time
  • How to return XML from an ASP.NET 5 MVC 6 controller action
  • Powershell Decimal Format without comma
  • Serialize Date, Instant to ISO 8601 when using JSR310 java.time in spring
  • jqGrid - date & time format not being applied
  • UIdatepicker showing weekdays
  • how to convert JSONString to Javascript Object
  • boost::format vs sprintf
  • Cleave.js Phone CA
  • IF statement formatting best-practise, what's your style?
  • How to edit css for jquery datepicker prev/next buttons?
  • jqPlot date axis - bars drawn on wrong day?
  • How to solve “undefined reference to function” error?
  • Color time-series based on column values in pandas
  • Geom_jitter colour based on values
  • MS Access - How to change the linked table path by amend the table
  • OpenGL 3.3 on Mac OSX El Capitan with LWJGL
  • MongoDB in PHP using aggregate to group by _id is null not working
  • Display issues when we change from one jquery mobile page to another in firefox
  • Validaiting emails with Net.Mail MailAddress
  • MySQL WHERE-condition in procedure ignored
  • To display the title for the current loaction in map in iphone
  • Web-crawler for facebook in python
  • Compare two NSDates in iPhone
  • KeystoneJS: Relationships in Admin UI not updating
  • embed rChart in Markdown
  • How to get NHibernate ISession to cache entity not retrieved by primary key
  • How can I use `wmic` in a Windows PE script?
  • Unable to use reactive element in my shiny app
  • java string with new operator and a literal