0

基本上我想同时使用带有自定义条宽（pointWidth）的pointPadding。但我不能，这是我的问题：

在显示分组图表时，我想要一个在一组的条形图中没有填充的图表。为此，我使用了 pointPadding:"0" 它向我展示了完全正确的图表。喜欢：

 if(chart_json.chart.defaultSeriesType=='column'){
          if(chart_json.xAxis.categories.length >= 1 ){

        chart_json.plotOptions.column.groupPadding = "0.05";
          chart_json.plotOptions.column.pointPadding = "0.00";

          }  
      }

      var chart=new Highcharts.Chart(chart_json,startupObj.startupFunction);
      chartObjArray.push(chart);

但是当我设置我的自定义宽度时，它会在一组的条之间添加一些空格。

实际上我想对条形宽度设置最大和最小限制，但我找不到 Highchart 库的任何支持。因此，为此目的，当 highchart 生成图表时，如果生成的图表栏宽度超过我的最大限制，我将其设置为我的最大限制，下限相同。

 if(chart_json.chart.defaultSeriesType=='column'){
          if(chart_json.xAxis.categories.length >= 1 ){

              chart_json.plotOptions.column.groupPadding = "0.05";
              chart_json.plotOptions.column.pointPadding = "0.00";

          }  
      }

      var chart=new Highcharts.Chart(chart_json,startupObj.startupFunction);
      chartObjArray.push(chart);

    //set bar width
    if(chart_json.chart.defaultSeriesType=='column' || chart_json.chart.defaultSeriesType=='bar'){
        setChartBarMaxMinWidth(chart,chart_json);
    }

setChartContainerWidth(chart_json,chart);

//// * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** ////////// /////////

function setChartBarMaxMinWidth(chart,json){

var maximumBarWidth=70;
var minimumBarWidth=15;

chart_json=eval('('+json.chart_json+')');

for(var j=0;j<chart.series.length;j++){
    var series=chart.series[j];
    if (series.data[0].pointWidth  >  maximumBarWidth) {
        chart.series[j].options.pointWidth = maximumBarWidth;
        isMaxMin='MAX';
    }

    if (series.data[0].pointWidth  <  minimumBarWidth) {
        chart.series[j].options.pointWidth = minimumBarWidth;
        isMaxMin='MIN';
    }

};

function setChartContainerWidth(chartOptions,chart){  
          // calculate # of bars
          var numberOfBars=seriesGroupLength*categoriesLength;
          // calculate container width
          // var containerWidth=numberOfBars*43;

          // get chart bar width


          var containerWidth=numberOfBars*barWidth;


          chart.setSize($(container).width(),$(container).height());

};

在 setChartContainerWidth() 中，我使用了 highchart setSize() 方法来调整图表大小。

感谢有人可以帮助我删除一组酒吧之间的空格。

谢谢

4

1 回答 1

0

我使用了 spacingTop 属性来强制设置最大 pointWidth：

if (series[0].data[0].pointWidth > maximumBarWidth) {
     this.options.chart.spacingTop = this.options.chart.height - (maximumBarWidth * series.length) - 30;
     this.isDirtyBox = true;
     this.redraw();
}

因此，如果有一个 Bar 超过一定宽度，则间距将被调整并且图表被绘制得更小。

这不会改变容器的大小，但会将条形保持在一定大小以下，并且您的 pointPadding 和 groupPadding 不会受到影响。

您将不得不根据您的数据结构和轴标题的大小调整间距顶部的计算。

于 2013-10-30T16:31:12.830 回答