Basic Line

Single series line chart with detailed options properties.

by Umair Rafiq

HTML

<script src="http://highcharts.com/js/testing.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>

<script src="https://code.highcharts.com/modules/accessibility.js"></script>
<div id="container" style="height:400px"></div>

JavaScript

var chart = new Highcharts.Chart({
    chart: {
        renderTo:'container',
        defaultSeriesType:'area'
    },
    xAxis:{
        type: 'datetime',
        labels: {
          rotation: -45,
          align: 'right'
        }
    },
    yAxis:{
        title:{
            text:'Kbps'
        },
        labels: {
          formatter: function() {
            return Math.abs(this.value) 
          }
        }
    },
    series: [
      {
        data: [ [1320674882000,183879],[1320675482000,182078],[1320676082000,175979],[1320676683000,178447],[1320677283000,178633],[1320677883000,178019],[1320678483000,176602],[1320679084000,178960],[1320679684000,181241],[1320680285000,182810] ]
      },
      {
        data: [ [1320674882000,-125449],[1320675482000,-131582],[1320676082000,-126499],[1320676683000,-128104],[1320677283000,-122671],[1320677883000,-129555],[1320678483000,-182048],[1320679084000,-221704],[1320679684000,-198801],[1320680285000,-184042] ]
      }
    ]
});