Así es como se ve mi formato de fecha del archivo JSON: http://jsfiddle.net/6roz4ya8/
Me gustaría que mi gráfico muestre solo la hora y los minutos en el eje x en la vista normal (puedo recortar, solo cómo hacerlo en el gráfico alto), mientras que los minutos y segundos cuando se amplía. Entiendo que podríamos usar el posicionador de ticks cuando type="datetime". ¿Cómo hago lo mismo para 'categorías: dateFromJsonFile' (es decir, si uso la fecha en el eje x del archivo json)
Por ejemplo: si '2022-07-15T13:57:54.4919219+03:00', quiero que se muestre 13:57 en general (vista normal sin zoom) y 57:54 cuando se amplía
xAxis: { gridLineWidth: 1, //I need to set categories to timeData, as this timeData comes from Json // categories: timeData, type: "datetime", labels: { rotation: 270 }, }A continuación se muestra cómo quiero que sea. Muestra un intervalo de un minuto en vista normal, intervalo de 10 segundos en Zoom - https://jsfiddle.net/BlackLabel/7qj2cLea/
Puede usar la función de formatter para las etiquetas del eje x y devolver las horas y los minutos en caso de que el gráfico no esté ampliado y los minutos y segundos en el caso de que esté ampliado.
const formatTime = time => time > 9 ? time : '0' + time; Highcharts.chart('container', { ..., xAxis: { type: 'category', labels: { rotation: 270, formatter: function() { const date = new Date(this.value); if (this.chart.resetZoomButton) { return formatTime(date.getMinutes()) + ':' + formatTime(date.getSeconds()); } return formatTime(date.getHours()) + ':' + formatTime(date.getMinutes()); } }, } });Demostración en vivo: http://jsfiddle.net/BlackLabel/k7nywoad/
Referencia de la API: https://api.highcharts.com/highcharts/xAxis.labels.formatter