JSFiddle - React, Tailwind, and code Playground

by pablojim

HTML

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

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

$(function() {
  $('#container').highcharts({
    chart: {
      type: 'column'
    },
    title: {
      text: 'Paddler Quiz Results'
    },
    legend: {
      enabled: false
    },
    xAxis: {
      categories: [
        "The Chosen Few",
        "Safety Paddler",
        "Solid Paddler",
        "Plucky Paddler",
        "Forward paddler",
        "Social Butterfly",
        "Swimmer!!"
      ],
    },
    yAxis: {
      min: 0,
      title: {
        text: 'Number of Respondees'
      }
    },
    series: [{
      name: 'Paddlers',
      data: [271,
        134,
        105,
        88,
        66,
        37,
        19
      ]

    }]
  });
});