高脑.如何为图表网格设置固定宽度,而不包括标签



如何为图表网格设置固定宽度,而不包括标签?固定宽度应在列之间,列和边缘沿边缘之间。标签区域必须是动态的。

列之间的宽度-24px。列宽-28PX。边缘和列之间的宽度-12px。

网格宽度-104px。

https://snag.gy/8twgxt.jpg

http://jsfiddle.net/2481ht7l/15/

我试图通过CSS设置" G"标签的宽度,无效。

<g class="highcharts-grid highcharts-yaxis-grid"></g>

load事件中您可以使用计算的marginRight属性更新图表,然后将pointPadding调整为所需的维度:

chart: {
    ...,
    type: 'column',
    marginRight: 0,
    marginLeft: 0,
    events: {
        load: function() {
            if (this.chartWidth < 104) {
                this.setSize(104);
            } else {
                this.update({
                    chart: {
                        marginRight: this.chartWidth - 104
                    }
                }, true, false, false);
            }
        }
    }
},
plotOptions: {
    series: {
        grouping: false,
        groupPadding: 0,
        pointPadding: 0.23
    }
}

实时演示: http://jsfiddle.net/blacklabel/kzdlyp1g/

API参考:

https://api.highcharts.com/highcharts/chart.marginright

https://api.highcharts.com/class-reference/highcharts.chart#update

https://api.highcharts.com/class-reference/highcharts.chart#setsize

您可以在图表的配置中更改pointPaddinggroupPadding

如果上述没有帮助,请提供小提琴。

最新更新