Highcharts добавление меток / столбцов без данных

Question

У меня проблема с точками рисования Highcharts, к которым не прикреплены данные.Диаграмма представляет собой столбчатую диаграмму с разверткой, показывающую среднее «время» в неделю на верхнем уровне, с разверткой, отображающей фактическое значение для случая для выбранной недели.

Моя проблема заключается в следующем: при детализациивплоть до определенной недели случаи, которые не существуют, все еще отображаются на графике, если они существуют между двумя существующими идентификаторами случаев. e.

Рассмотрим данные, передаваемые за неделю 6: [[272, 25.07] [297, 500.54]], существуют только два случая: 272 и 297. Однако Highcharts дает мне следующее:

https://i.stack.imgur.com/MpABB.png

Это код самой диаграммы:

                Highcharts.chart('DrilldownChart', {
                chart: {
                    type: 'column'
                },
                title: {
                    text: ''
                },
                subtitle: {
                    text: ''
                },
                xAxis: {
                    type: "",
                    labels: {
                        rotation: 90
                    },
                },
                yAxis: {
                    title: {
                        text: ''
                    }

                },
                exporting: {
                    enabled: false
                },
                credits: {
                    enabled: false
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    column: {
                        minPointLength: 0
                    },
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: false,
                            format: '{point.y:.1f}',
                            rotation: 270
                        }
                    }
                },
                tooltip: {
                    pointFormat: '<span style="color:{#000}"></span>{point.y:.2f}<br/>'
                },

                series: MainDataArray,
                drilldown: {
                    series: DrilldownDataArray,
                }

            });

Кто-нибудь знает, как помешать рисованию меток / столбцов между точками с фактическими данными?

Спасибо!

Answer 1

Вам просто нужно преобразовать значения x из вашего массива в тип String, тогда они будут обрабатываться как имя категории вместо индексов категории.Чтобы преобразовать его, вы можете использовать функцию Array.map() следующим образом:

var drilldownSeries = [{
    id: 'One',
    data: [[272, 25.07], [297, 500.54]].map(elem => {
        return [elem[0].toString(), elem[1]]
    })
  }]

Однако перед этим, пожалуйста, убедитесь, что ваш xAxis.type установлен на 'category', потому что я заметил, что вв вашем коде есть пустая строка, присвоенная полю type.

Вот пример, показывающий, как достичь описанного эффекта: https://jsfiddle.net/8h03urrr/