1

我正在使用 Angular 谷歌图表上的 ComboChart 开发分层柱形图。虽然我已经在两个不同的轴上分离了两个系列的条形图，能够在另一个前面找到一个条形图，就像需要的那样，我不能只改变一个系列的宽度。我想要像 amCharts 分层柱形图这样的结果：

分层柱形图示例

现在，图表看起来像：

当前图表 - Angular 谷歌图表

此外，如果有一种方法可以共享相同的 y 轴，同时保持一个条在另一个条之前，而不是 staking，那就太好了。

我一直用于角度谷歌图表选项的代码：

    this.options =
    {  
      colors: ['#1E90FF', '#f39800'], 
      hAxis: {
        title: 'haxisTitle',
        type: 'category'
      },
      vAxis:{
        title: 'Value',
        minValue: 0,
        format: this.numberFormat
      },
      seriesType: 'bars',
      bar: {1: {groupWidth: "30"}},
      series: 
        {
          0: {
            targetAxisIndex: 0
          },
          1: {
            targetAxisIndex: 1,
          }
        },        
      vAxes: {
        0: {
          title: 'Altered Value',
          label:'Altered Value',
          viewWindow: {  // <-- set view window
            min: 0,
            max: this.maxValue + 0.1*this.maxValue, // Sets the maximun value of altered or real value to the window size (both axis)
          },
          format: this.numberFormat,
          type: 'bars'     
        },
        1: {
          title: 'Real Value',
          label:'Real Value',
          viewWindow: {  // <-- set view window
            min: 0,
            max: this.maxValue + 0.1*this.maxValue,
          },
          format: this.numberFormat,
          type: 'bars'
        }    
      },
      aggregationTarget: 'auto',
      stackSeries: true,
      isStacked : true,
      explorer: {
        actions: ['dragToZoom', 'rightClickToReset'],
        keepInBounds: true,
        maxZoomIn: 4.0
      }
    };
  }

图表正确显示数据，唯一的问题是布局。

一些可能有帮助的参考：

Google Developers - 可视化：组合图 amCharts 分层柱形图 重叠条 - 堆栈溢出报价- 这里的结果是堆积条形图（我不想要的东西）

4

0 回答 0