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/accessibility.js"></script>
<script src="/js/dark-unica.js"></script>
<script>
Highcharts.getJSON(
'https://www.pogodakrotoszyn.pl/tempdata.json',
function(data) {
var minTemp = Math.min(...data.temp);
var maxTemp = Math.max(...data.temp);
Highcharts.chart('temperatura', {
chart: {
backgroundColor: 'rgba(40,40,40,1)',
events: {
load: function() {
const chart = this;
this.series.forEach(series => {
const min = series.dataMin,
max = series.dataMax;
series.points.forEach(point => {
if (point.y === min || point.y === max) {
point.update({
dataLabels: {
enabled: true,
formatter: function() {
return this.y + '°C';
},
style: {
color: 'white',
fontSize: '16px'
}
}
});
}
});
});
}
}
},
title: {
text: ' '
},
xAxis: {
type: 'datetime',
labels: {
style: {
color: 'white'
...