Question

基本上我想同时使用带自定义条宽（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库的任何支持。因此，为此目的，当高图生成图表时，如果生成的图表栏宽度超过我的最大限制，我将其设置为我的最大限制，并将其设置为下限。

 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（）中，我使用了高图setSize（）方法来调整图表大小..

谢谢，如果有人可以帮我删除一个组之间的空格。

由于

Answer 1

我使用了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();
}

因此，如果在某个宽度上有一个条形，则会调整间距并将图形绘制得更小。

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

您必须根据数据结构和轴标题的大小调整spacingTop的计算。

highcharts使用自定义条宽度分组图表，没有pointPadding

1 个答案: