Large Y-axis tickInterval in high charts does not work

Posted by ckovacs on Stack Overflow See other posts from Stack Overflow or by ckovacs
Published on 2014-05-29T21:36:10Z Indexed on 2014/05/30 9:26 UTC
Read the original article Hit count: 314

Filed under:
|

I have a chart at this JSFiddle to demonstrate a problem where our charts are not respecting the y-axis tick interval for large values:

http://jsfiddle.net/z2cDu/1/

var plots = {"usBytePlots":[[1362009600000,143663192997],[1362096000000,110184848742],[1362182400000,97694974247],[1362268800000,90764690805],[1362355200000,112436517747],[1362441600000,113563368701],[1362528000000,139579327454],[1362614400000,118406594506],[1362700800000,125366899935],[1362787200000,134189435596],[1362873600000,132873135854],[1362960000000,121002328604],[1363046400000,123138222001],[1363132800000,115667785553],[1363219200000,103746172138],[1363305600000,108602633473],[1363392000000,89133998142],[1363478400000,92170701458],[1363564800000,86696922873],[1363651200000,80980159054],[1363737600000,97604615694],[1363824000000,108011666339],[1363910400000,124419138381],[1363996800000,121704988344],[1364083200000,124337959109],[1364169600000,137495512348],[1364256000000,136017103319],[1364342400000,60867510427]],"dsBytePlots":[[1362009600000,1734982247336],[1362096000000,1471928923201],[1362182400000,1453869593201],[1362268800000,1411787942581],[1362355200000,1460252447519],[1362441600000,1595590020177],[1362528000000,1658007074783],[1362614400000,1411941908699],[1362700800000,1447659369450],[1362787200000,1643008799861],[1362873600000,1792357973023],[1362960000000,1575173242169],[1363046400000,1565139003978],[1363132800000,1549211975554],[1363219200000,1438411448469],[1363305600000,1380445413578],[1363392000000,1298319283929],[1363478400000,1194578344720],[1363564800000,1211409679299],[1363651200000,1142416351471],[1363737600000,1223822672626],[1363824000000,1267692136487],[1363910400000,1384335759541],[1363996800000,1577205919828],[1364083200000,1675715948928],[1364169600000,1517593781592],[1364256000000,1562183018457],[1364342400000,681007264598]],"aggregatedTotalBytes":43476367948896,"aggregatedUsBytes":3150320403841,"aggregatedDsBytes":40326047545055,"maxTotalBytes":328186292129,"maxTotalBitsPerSecond":30387619.641574074}
;

$('#container').highcharts({
    yAxis: {
        tickInterval: 53687091200 // 500 gigabytes. Maximum y-axis value is approx 1.8TB
    },

    series : [
      {
        color: 'rgba(80, 180, 77, 0.7)',
        type: 'areaspline',
        name : 'Downstream',
        data : plots.dsBytePlots,
        total: plots.aggregatedDsBytes
      },
      {
        color: 'rgba(33, 143, 197, 0.7)',
        type: 'areaspline',
        name : 'Upstream',
        data : plots.usBytePlots,
        total: plots.aggregatedUsBytes
      }]
});

In this example we are charting bandwidth utilization in bytes. The chart has a maximum value of about 1.8TB. We set the y-axis tick interval to exactly 500GB but the rendered y-axis ticks don't make any sense for the given interval.

© Stack Overflow or respective owner

Related posts about highcharts

Related posts about highstock