Highcharts Demo

author(s): Torstein Hønsi

by Black Label

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>

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

JavaScript

Highcharts.chart("container", {
  chart: {
    type: "line",
  },
  title: {
    text: "Monthly Data",
  },
  yAxis: [
    {
      opposite: true,
      tickPositions: [0, 1, 2],
      labels: {
        formatter: function () {
          const categories = ["Low", "Medium", "High"];
          return categories[this.value];
        },
      },
      title: {
        text: "Severity",
      },
    },
    {
      title: {
        text: "Measurment",
      },
    },
  ],
  series: [
    {
      yAxis: 0,
      name: "Severity",
      data: [0, 1, 0, 1, 0, 0, 0, 1, 1],
    },
    {
      yAxis: 1,
      name: "Measurment",
      data: [0, 5, 20, 5, 2, 5, 1],
    },
  ],
  tooltip: {
    shared: true,
    valueSuffix: "",
  },
})