JSFiddle - React, Tailwind, and code Playground

by AbhishekRohan

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>

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

JavaScript

var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'line'
        },
        title: {
            text: 'Dummy Data by Region'
        },
        xAxis: {
            categories: ['Africa', 'America', 'Asia']
        },
        yAxis: {
          plotLines:[{
                value:450,
                color: '#ff0000',
                width:2,
               // zIndex:4,
                label:{text:'goal',verticalAlign: 'bottom',
            textAlign: 'right',}
            }] 
        },
        series: [{
            name: 'Year 1800',
            data: [107, 31, 50]
        },
         {
                            name: 'Goal',
                    type: 'scatter',
                    marker: {
                enabled: true
                            },
                            data: [450]
                        } 
        ]
    });

chart.yAxis[0].addPlotLine({
  value: 35.5,
  color: 'green',
  width: 2,
  id: 'plot-line-1',
  label: {
    text: "Testing"
  }
});