【问题标题】:Google BarChart set width of bars?谷歌条形图设置条形的宽度?
【发布时间】:2011-10-05 20:00:27
【问题描述】:

我正在使用 Google 的 javascript 可视化库生成条形图。我想让图表中的条形比现在更宽,但是我在文档中找不到任何内容来说明如何配置每个数据集的条形宽度。

有什么帮助吗?

【问题讨论】:

    标签: google-visualization bar-chart


    【解决方案1】:

    试试下面的格式,这样图表就会看起来不错,虽然它没有修复,但这解决了我们的问题。

    options: {
      titlePosition: "none",
      bar: { groupWidth: "50%" }
      // ...
    }
    
    data.push([" ", "t1","t2","t3","t4"]); // headings
    data.push([" ", 0, 0, 0, 0]); // dummy bar so graph will display good
    // push you actual data here
    data.push([" ", 0, 0, 0, 0]); // dummy bar so graph will display good
    

    【讨论】:

      【解决方案2】:

      有同样的问题,想我会为后代发帖。 bar.groupWidth 似乎是设置它的方法。

      https://developers.google.com/chart/interactive/docs/gallery/barchart

      例如:

       var options = {
              title: "Density of Precious Metals, in g/cm^3",
              width: 600,
              height: 400,
              bar: {groupWidth: "95%"},
              legend: { position: "none" },
            };
       var chart = new google.visualization.BarChart(document.getElementById("barchart_values"));
       chart.draw(view, options);
      

      【讨论】:

      • bar: {groupWidth: "95%"} 例如
      • 不错的发现,但是在设置小条之后,如何将它们之间的空间设置得更小?
      • @nclsvh 不知道有任何 API 方法可以做到这一点,抱歉 :(
      • 此 bar.groupWidth 值是否被视为最小值、最大值或固定量?我的图表每天有一个条形图。所以在第 1 天,条形图填满了图表的整个宽度。随着时间的流逝,越来越多的酒吧进来,它们缩小以适应,并开始看起来像酒吧。我使用 bar.groupWidth 将其设置为 50 像素,现在看起来不错,但是一旦条形图的宽度超过了每个 50 像素宽,条形图仍会自动缩小其宽度吗?我希望有一个 bar.maxWidth 选项。
      • @l008com 似乎有一些逻辑可以防止条大于分配给它们的空间,无论您将宽度设置为多少。检查这个小提琴:jsfiddle.net/8zp1fasb