JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; max-width: 600px; height: 400px; margin: 0 auto"></div>
<pre id="csv" style="display:none">CA,2012,2015,2014
Hors optique,53000,48000,48878
Optique,365000,353000,379762</pre>
JavaScript
$(function() {
$('#container').highcharts({
chart: {
type: 'bar'
},
title: {
text: 'Global temperature change'
},
subtitle: {
text: 'Data module: Show only last 20 years by limiting start row.'
},
data: {
csv: document.getElementById('csv').innerHTML,
itemDelimiter: ',',
lineDelimiter: '\n',
firstRowAsNames: true,
switchRowsAndColumns: 1
},
plotOptions: {
series: {
stacking: 'normal'
}
},
xAxis: {
allowDecimals: false,
type: 'category'
},
series: [{
name: 'Annual mean'
}]
}, function(chart) {
console.log(chart.series[0].data)
});
});