Maximum bar width in Highcharts column charts

后端 未结 8 1653
梦毁少年i
梦毁少年i 2021-02-18 14:20

I\'m using Highcharts to create some vertical bars (a.k.a. \"column charts\") a lot like here: highcharts.com/demo/column-basic

Thing is, sometimes there are 30 bars in

8条回答
  •  谎友^
    谎友^ (楼主)
    2021-02-18 14:41

    Ultimate solution is to wrap drawPoints and overwrite shaperArgs of each point, especially x-position and width:

    (function(H) { 
        var each = H.each;
        H.wrap(H.seriesTypes.column.prototype, 'drawPoints', function(proceed) {
            var series = this;
            if(series.data.length > 0 ){
                var width = series.barW > series.options.maxPointWidth ? series.options.maxPointWidth : series.barW;
                each(this.data, function(point) {
                    point.shapeArgs.x += (point.shapeArgs.width - width) / 2;
                    point.shapeArgs.width = width;
                });
            }
            proceed.call(this);
        })
    })(Highcharts)
    

    Use:

    $('#container').highcharts({
        chart: {
          type: 'column'
        },
        series: [{
            maxPointWidth: 50,
            data: [ ... ]
        }]
    });
    

    And live demo: http://jsfiddle.net/83M3T/1/

提交回复
热议问题