Highcharts Demo

author(s): Torstein Hønsi

by Black Label

HTML

<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<div id="container"></div>

CSS

#container {
    max-width: 800px;
    min-width: 320px;
    height: 400px;
    width: 400px;
}

JavaScript

Highcharts.chart('container', {
  chart: {
    type: 'spline',
  },
  xAxis: {
    type: 'datetime',
    min: Date.UTC(2023, 6, 1),
    max: Date.UTC(2023, 6, 1, 3),
    scrollbar: {
      enabled: true
    }
  },
  yAxis: {
    opposite: true
  },
  plotOptions: {
    series: {
      pointInterval: 3600000,
      pointStart: Date.UTC(2023, 6, 1),
    }
  },
  series: [{
    name: 'Vik',
    data: [0, 0, 0.6, 0.9, 0.8, 0.2, 0, 0, 0, 0.1, 0.6, 0.7, 0.8, 0.6, 0.2, 0, 0.1, 0.3, 0.3, 0, 0.1]
  }]
});