如何为图表网格设置固定宽度,而不包括标签?固定宽度应在列之间,列和边缘沿边缘之间。标签区域必须是动态的。
列之间的宽度-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
您可以在图表的配置中更改pointPadding
或groupPadding
。
如果上述没有帮助,请提供小提琴。