Highcharts Demo

author(s): Torstein Hønsi

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container"></div>

JavaScript

Highcharts.chart('container', {
  title: {
    text: 'Borehole Water Level'
  },
  options: {
    tooltip: {
      /*formatter: function() {
        var tooltip = '<b><u>' + boreholename + '</u></b>';
        $.each(this.points, function() {
          tooltip += '<br/><strong>Date : </strong>' + BaseService.formatDate(this.x);
          tooltip += '<br/><strong>' + this.series.name + ': </strong>' + this.y + 'm'
        });
        return tooltip
      },*/
      shared: !0
    }
  },
  xAxis: {
    type: 'datetime',
    dateTimeLabelFormats: {
      month: '%e. %b',
      year: '%b'
    }
  },
  yAxis: [{
    title: {
      text: 'Depth [m]'
    }
  }, {
    opposite: !0,
    linkedTo: 0,
    title: {
      text: 'Level above sea [m]'
    },
    labels: {
      formatter: function() {
        return +this.value + 1300;
      }
    }
  }],
  series: [{
    name: 'Water Level depth',
    data: [1, 2, 3, 4, 5, 6],
  }]
});