Actualmente, la aplicación web contiene un gráfico spline de Highchart que es bastante fácil de convertir en un gráfico de áreas. Mi pregunta es doble:

A. Cómo actualizar el color del gráfico de área con valores que no están en el eje y, por lo que en mi ejemplo, 'recuento' estaría en el eje y, sin embargo, el color del gráfico de área estaría de acuerdo con el 'sentimiento'.

B. ¿Cómo se pueden establecer múltiples umbrales para diferentes rangos de valores en 'sentimiento' (supongo que a través de declaraciones if/else en Fetch API?)

¡Muchas gracias de antemano!

La estructura de datos se ve así:

 {'count': [14, 25, 23, 10], 'sentiment': [5, 4, 1, 3], 'halfhour': ['11-06-2021, 12:00','11-06-2021, 12:30', '11-06-2021, 13:00', '11-06-2021, 13:30']}

Código JS:

 <script> $(document).ready(function(){ lineChartOptions = { chart: { renderTo: 'chart-areaid', defaultSeriesType: 'spline' // change this to area-chart }, title: { text: '' }, xAxis: { type: 'datetime', categories: [] }, yAxis: { minPadding: 0.2, maxPadding: 0.2, title: {text: 'Value', margin: 80} }, series: [{ name: 'reddit_stream', animation: false, data: [] }] } const lineChart = Highcharts.chart('chart-areaid', lineChartOptions) setInterval(() => { fetch('/reddit_line_data') .then( resp => resp.json()) .then(data => { lineChart.update({ xAxis: { categories: data.halfhour}, series: [{ data: data.count}]}, true, false, false)}); }, 1000) </script>