微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在反应中更改选项 Google Charts Bar?

如何解决如何在反应中更改选项 Google Charts Bar?

我正在尝试使用 Google 图表来创建条形图。我正在研究选项字段,但我发现当 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>

解决方法

我相信这就是您要找的。您需要将图表设置为“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
  />

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。