設置Highchart柱子最大寬度（ 讓 highcharts支持maxPointWidth屬性）

咱們在設置圖表時候常常會動態設置數據列的寬度，可是若是數量較少的話,常常會比較難看，因而咱們會想到限制一個最大寬度。這段代碼應該適合你。

(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屬性裏增長這個,設置就能夠完成對最大寬度的支持了。

 

   plotOptions: {series: [{
  // .... data: data['series']['stars'], tooltip: { valueSuffix: ' 顆' }, maxPointWidth: 30, // 最大寬度 採用svg寬度 }]

或者設置

column: {
    cursor: 'pointer',
    pointPadding: 0.2,
    borderWidth: 0,
    //pointWidth: 30,
   maxPointWidth: 100 // 設置最大寬度

     }

        }