Интервал между горизонтальными полосами в Highcharts - PullRequest
0 голосов
/ 12 октября 2018

В конфигурации Highcharts для горизонтальной гистограммы я не могу изменить расстояние между двумя столбцами.

Обратите внимание на maxPointWidth: 8

{
                chart: {
                    type: 'bar'
                },
                title: {
                    text: ''
                },
                xAxis: {
                    categories: ['Document', 'Image', 'Audio', 'CAD', 'Zip'],
                    title: {
                        text: 'File Type',
                        align: 'high',
                        offset: 0,
                        rotation: 0,
                        y: -10,
                        x: -15
                    },
                    lineColor: 'transparent',
                    minorTickLength: 0,
                    tickLength: 0,
                    labels: {
                        style: {

                        }
                    }
                },
                yAxis: {
                    opposite: true,
                    title: {
                        text: '# Files',
                        align: 'middle',
                        style: {
                            /* TODO: Modify styles to accommodate the bars header */
                            color: '#000000'
                        }
                    },
                    tickInterval: 2,
                    gridLineColor: 'transparent',
                    labels: {
                        enabled: false
                    }
                },
                tooltip: {
                    valueSuffix: ' millions'
                },
                plotOptions: {
                    bar: {
                        dataLabels: {
                            enabled: true
                        }
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -40,
                    y: 80,
                    floating: true,
                    borderWidth: 1,
                    backgroundColor: ('#FFFFFF'),
                    shadow: true,
                    enabled: false
                },
                credits: {
                    enabled: false
                },
                series: [{
                    name: '',
                    data: [56, 30, 15, 11, 5],
                    maxPointWidth: 8
                }],
                colors: this.colors || defaultColors
            }

Вот рабочая скрипка JS: https://stackblitz.com/edit/highcharts-angular-drilldown?file=app%2Fapp.component.ts

Я хочу уменьшить расстояние между столбцами и надписью и сохранить максимальную ширину maxPointWidth. введите описание изображения здесь

1 Ответ

0 голосов
/ 12 октября 2018

Чтобы уменьшить расстояние между барами, уменьшите график height:

chart: {
    type: 'bar',
    height: 200
}

Демонстрационная версия: http://jsfiddle.net/BlackLabel/msph2uca/

API: https://api.highcharts.com/highcharts/chart.height

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...