JSFiddle - React, Tailwind, and code Playground
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>
<div id="container"></div>
JavaScript
Highcharts.chart('container', {
title: {
text: "Evolution du chiffre d'affaires des entreprises de sécurité de 1999 à juin 2016"
},
subtitle: {
text: 'Source: Insee'
},
yAxis: {
title: {
text: "Chiffre d'affaires"
}
},
legend: {
layout: 'horizontal',
align: 'center',
verticalAlign: 'bottom'
},
plotOptions: {
series: {
label: {
connectorAllowed: false
},
pointStart: 1999
}
},
series: [{
name: "En milliards d'euros",
data: [42.2, 48.31, 55.5, 63.6, 69.4, 73.2, 76.79, 83.2, 85, 95, 97.4, 99.6, 104.7, 111.1, 115.23, 120.1, 124.3, 130.31]
}],
responsive: {
rules: [{
condition: {
maxWidth: 500
},
chartOptions: {
legend: {
layout: 'horizontal',
align: 'center',
verticalAlign: 'bottom'
}
}
}]
}
});