How to dynamically adjust dataGrouping and set variable time intervals for HighStock data (HighCharts) -


i having quite few problems getting highstock use datagrouping shows correct unit when needed, hit runtime errors.

background: loading in time series data varying granularity based on recency, metrics less 8 hours, granularity of data per minute, data 14 days, it's hour, , data beyond 14 days it's measured per day. assumed datagrouping used, having number of problems when explicitly changing grouping (see http://jsfiddle.net/xckaxaf2/8/ complete example):

chart.series[0].update({ datagrouping: { units: [ ['minute', [1]] ] } }); 

the issues having are:

  • if specify datagrouping of units: [ ['minute', [1]], ['hour', [1]], ['month', [1]] ], have no way of controlling when each type of grouping used. problem because if extremes set time before 1 minute interval 8 hours data , uses minute data incomplete, , equally default groupings not right when less hour. need explicit way of setting grouping.
  • if change datagroupings programatically 2 errors: uncaught typeerror: object not function(index):83, highcharts.stockchart.chart.events.redraw , uncaught typeerror: cannot read property 'length' of undefined, jquery-1.9.1.js:747 jquery.extend.grephighstock.js:259. can see error in jsfiddle above clicking on 24h or 1m.

does know how it's possible work around these issues , set datagrouping interval dynamically based on data being viewed within extremes?

i have raised issue @ https://github.com/highslide-software/highcharts.com/issues/4050

as solution/workaround, can wrap method responsible datagrouping, , set option there: http://jsfiddle.net/xckaxaf2/9/

(function (h) {     h.wrap(h.series.prototype, "processdata", function (c) {          var chart = this.chart,             dg = this.options.datagrouping,             currentunits = dg.units[0][0],             min = chart.xaxis[0].min,             targetunit = getunitfromrangestart(min);           if (currentunits !== targetunit) {             console.log('changing interval ' + currentunits + ' ' + targetunit);             /* change grouping charts other navigator */             dg.units = [                 [targetunit, [1]]             ];         }         c.call(this);      }); })(highcharts); 

just make sure have set datagrouping.forced option true. datagrouping used.


Comments

Popular posts from this blog

javascript - AngularJS custom datepicker directive -

javascript - jQuery date picker - Disable dates after the selection from the first date picker -