JSFiddle - React, Tailwind, and code Playground

author(s): Torstein Hønsi

by asemahle

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>

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

CSS

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

JavaScript

Highcharts.chart('container', {

    title: {
        text: 'Formatter Demo'
    },

    subtitle: {
        text: 'Y axis formatted for percent'
    },
    
    yAxis: {
        labels: {
            formatter: function () {
                var label = this.axis.defaultLabelFormatter.call(this);
                return label * 100 + '%'
            }
        }
    },

    series: [{
        data: [0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9],
        type: 'column'
    }]

});