Highcharts: как применить отступ между каждым столбцом на оси Y

Question

Я пытаюсь добавить больше промежутков между столбцами по оси Y в Highcharts.В настоящее время это выглядит так:

Я добавил полосу прокрутки по оси Y.Но полоса прокрутки не работает.Вместо этого столбцы на оси Y сдвинуты и выглядят загроможденными.Как я могу это исправить ?Я использую Highstocks API.Параметры диаграммы, которые я использую сейчас: -

$scope.mychart = new Highcharts.Chart({
    chart: {
        renderTo: 'RoadmapGanttChart'
    },
    title: {
        text: 'RoadMaps'
    },

    xAxis: {
        type: 'datetime'
    },

    yAxis: {
        categories: categories,
        tickInterval: 1,            
        tickPixelInterval: 200,
        labels: {
            useHTML: true,

            style: {
                color: '#525151',
                font: '12px Helvetica',
                fontWeight: 'bold',
                paddingTop: '200px',
                paddingBottom: '200px'
            },
           /* formatter: function() {
                if (tasks[this.value]) {
                    return tasks[this.value].name;
                }
            }*/
        },
        startOnTick: false,
        endOnTick: false,
        title: {
            text: 'Projects'
        },
        // minPadding: 0.2,
        // maxPadding: 0.2,
        fontSize:'15px',
        scrollbar: {
            enabled: true
        }

    },

    legend: {
        enabled: false
    },
    tooltip: {
        formatter: function() {
            return '<b>'+ $scope.filteredTasks[this.y].name + '</b><br/>' +
                Highcharts.dateFormat('%m-%d-%Y', this.point.options.from)  +
                ' - ' + Highcharts.dateFormat('%m-%d-%Y', this.point.options.to); 
        }
    },

    plotOptions: {
        line: {
            lineWidth: 10,
            marker: {
                enabled: false
            },
            dataLabels: {
                enabled: true,
                align: 'left',
                formatter: function() {
                    return this.point.options && this.point.options.label;
                }
            }
        }
    },

    series: $scope.filteredTasks
  });

Я новичок в разработке веб-интерфейсов.

Answer 1

Вы должны установить экстремумы по оси Y - полоса прокрутки будет настраиваться на них:

yAxis: {
  min: 0,
  max: 10,
  scrollbar: {
    enabled: true
  }
},

Демонстрация в реальном времени: http://jsfiddle.net/rm9mk52c/

Вы также можете попробовать использовать диапазон столбцов ряд (https://www.highcharts.com/demo/columnrange) введите инвертированный график. Я полагаю, что я могу представить ваши данные лучше, чем ряд линий.