如何在反應中更改選項谷歌圖表欄？

Question

我正在嘗試用谷歌圖表創建一個條形圖。 我正在研究選項字段，但我發現當chartType="Bar"時，正常的圖形選項不起作用。 它應該是chartType="BarChart"才能工作。 但是當我這樣做時，這個圖表將是水平的，我想要垂直的。 這是我的代碼，如何更改backgroundColor或使用選項？

<Chart
            width={550}
            height={350}
            chartType="Bar"
            loader={<div>Grafik Yükleniyor...</div>}
            data={[
                ['Year', '2019/12', '2020/12'],
                ['Karlılık', 1000, 400],
                ['Verimlilik', 1170, 460],
                ['Kaldıraç', 660, 1120],
                ['Özkaynak', 1030, 540],
              ]}
            options={{

                colors: ['#0b2573','#2f8226'],
                animation: {
                        duration: 2000,
                        easing: 'linear',
                        startup: true
                },
                backgroundColor: "transparent",
                    
                
                
            }}
            // For tests
            rootProps={{ 'data-testid': '2' }}
            />
            
        </Col>

Answer 1

我相信這就是你要找的。 您需要將圖表設置為“ColumnChart”而不是“Bar”。 此外，您將顏色設置為透明而不是實際的顏色值。

  <Chart
    width={550}
    height={350}
    chartType="ColumnChart"
    loader={<div>Grafik Yükleniyor...</div>}
    data={[
      ['Values', '2019/12', '2020/12'],
      ['Karlılık', 1000, 400],
      ['Verimlilik', 1170, 460],
      ['Kaldıraç', 660, 1120],
      ['Özkaynak', 1030, 540],
    ]}
    options={{
      title: 'Some Values',
      chartArea: { width: '50%' },
      hAxis: {
        title: 'Measures',
        minValue: 0,
      },
      vAxis: {
        title: 'Amount',
      },
      backgroundColor: '#E4E4E4',
    }}
    legendToggle
  />