我们在设置图表时刻常常会动态设置数据列的宽度,然则假如数目较少的话,常常会比较丢脸,因而我们会想到限定一个最大宽度。这段代码应当合适你。
(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);
添加完代码后,在你的Highcharts
属性里增添这个,设置就能够完成对最大宽度的支撑了。
series: [{
// ....
data: data['series']['stars'],
tooltip: {
valueSuffix: ' 颗'
},
maxPointWidth: 30, // 最大宽度 采纳svg宽度
}]