JSFiddle - React, Tailwind, and code Playground

by WoJWoJ

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/4.2.1/highcharts.js"></script>
<div id="container"></div>

JavaScript

var values1 = [];
var values2 = [];
for (i = 0; i < 20; i++) {
  if (i < 10) {
    values1.push([i, i * 10]);
  } else {
    values2.push([i, i * 10]);
  }
  values1.push(values2[0]); // connect both data sets
}

$('#container').highcharts({
  plotOptions: {
    series: {
      animation: false,
      dataLabels: {
        enabled: true,
        style: {
          fontWeight: 'bold'
        }
      }
    }
  },
  xAxis: {},
  series: [{
    data: values1
  }, {
    data: values2,
    dashStyle: 'Dash'
  }]
});