Estoy tratando de usar este gráfico para mostrar mis datos: https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/spline-irregular-time
Mis datos se ven así en el backend:
Mi gráfico se ve así
Observe que la fecha en el eje x es incorrecta y la fecha en la etiqueta siempre dice 1 Jan para todos los puntos de datos. ¿Cómo arreglo esto para que la fecha en la etiqueta y el eje x sean correctos? Aquí está mi código JS
var credit = '<?php echo (isset($credit))?$credit:0; ?>' Highcharts.chart('transactionId', { chart: { type: 'spline' }, title: { text: 'Snow depth at Vikjafjellet, Norway' }, subtitle: { text: 'Irregular time data in Highcharts JS' }, xAxis: { type: 'datetime', dateTimeLabelFormats: { // don't display the dummy year month: '%e. %b', year: '%b' }, title: { text: 'Date' } }, yAxis: { title: { text: 'Snow depth (m)' }, min: 0 }, tooltip: { headerFormat: '<b>{series.name}</b><br>', pointFormat: '{point.x:%e. %b}: {point.y:.2f} m' }, plotOptions: { series: { marker: { enabled: true } } }, colors: ['#6CF', '#39F', '#06C', '#036', '#000'], // Define the data points. All series have a dummy year // of 1970/71 in order to be compared on the same x axis. Note // that in JavaScript, months start at 0 for January, 1 for February etc. series: [{ name: "Winter 2016-2017", data: JSON.parse(credit) }], responsive: { rules: [{ condition: { maxWidth: 500 }, chartOptions: { plotOptions: { series: { marker: { radius: 2.5 } } } } }] } });El problema es el formato de fecha 2020-12-13 . Pasar una cadena de fecha directamente no funciona. Debe convertir al formato Date.UTC (año, mes, día). Entonces, su matriz de crédito debería verse así cuando pase a la configuración del gráfico.
credit = [ [Date.UTC(2020, 12, 13), 5000], [Date.UTC(2020, 12, 19), 50000], ... ]