Highcharts:如何消除系列和垂直轴之间的差距? [英] Highcharts : How to remove the gap between series and vertical axis?

查看:134
本文介绍了Highcharts:如何消除系列和垂直轴之间的差距?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

看起来Highcharts在1.系列行开始/系列行结束和第2行之间增加了一些间隔。



请参阅jsfiddle链接和下面的屏幕截图以获取更多详细信息。



我如何摆脱这个空间?我希望我的系列剧在剧情区域内从头到尾扩大,没有空白。使用更少数量的数据点可以实现吗? (例如,在我的例子中,每个系列只有4个数据点) 解决方案

pointPlacement



当pointPlacement为on时,该点不会创建X轴的任何填充。

  plotOptions:{
series:{
pointPlacement:'on '
}
},

小提琴演示


It seems like Highcharts is adding some spacing between the 1. series line start/series line end and the 2. vertical axis.

Please see the jsfiddle link and below screenshot for more details.

http://jsfiddle.net/8kbf2e1x/

Highcharts.chart('container', {

    title: {
        text: 'Solar Employment Growth by Sector, 2010-2016'
    },

    subtitle: {
        text: 'Source: thesolarfoundation.com'
    },

        xAxis: {
            categories: ['D1', 'D2', 'D3', 'D4']
    },

    yAxis: {
        title: {
            text: 'Number of Employees'
        }
    },
    legend: {
        layout: 'vertical',
        verticalAlign: 'bottom'
    },

    plotOptions: {
        series: {
        }
    },

    series: [{
        name: 'Installation',
        data: [43934, 52503, 57177, 69658]
    }, {
        name: 'Manufacturing',
        data: [24916, 24064, 29742, 29851]
    }, {
        name: 'Sales & Distribution',
        data: [11744, 17722, 16005, 19771]
    }, {
        name: 'Project Development',
        data: [null, null, 7988, 12169]
    }, {
        name: 'Other',
        data: [12908, 5948, 8105, 11248]
    }],

    responsive: {
        rules: [{
            condition: {
                maxWidth: 500
            },
            chartOptions: {
                legend: {
                    layout: 'horizontal',
                    align: 'center',
                    verticalAlign: 'bottom'
                }
            }
        }]
    }

});

How do I get rid of this spaces? I want my series lines to expand from ened to end within the plot area with no gaps. Is it achievable with smaller number of data points? (e.g. in my case every series has only 4 data points)

解决方案

check pointPlacement

when pointPlacement is "on", the point will not create any padding of the X axis.

 plotOptions: {
  series: {
    pointPlacement: 'on'
  }
},

Fiddle demo

这篇关于Highcharts:如何消除系列和垂直轴之间的差距?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆