如何使用谷歌图表api创建直方图？

Question

除了使用柱形图并正确命名之外,是否可以在谷歌图表API中创建直方图？

Answer 1

为了增加mattedgod的回答,柱形图可以现将间隔紧紧地握在一起的酒吧,使用选项创建:

bar:  {groupWidth:"100%"};

Answer 2

谷歌几天前推出了直方图:链接

Answer 3

Google Charts没有直方图,因为它只是一个可视化库,您必须修改柱形图以满足您的需求.但是,我怀疑你对柱形图不满意的原因是因为列间距,它看起来不像直方图.所以我先回答这个问题:

你能控制柱形图中列之间的间距吗？

不,不是在这个时候.请参阅Google Charts社区的这句话

API中没有支持控制条之间的间距.如果你愿意深入研究图表的SVG,你可能会破解它.

所以它是可行的但是需要你做一些额外的工作.您还可以使用chartArea配置选项,这将对列间距产生一些影响.

但是,原始问题实际上可能有不同的答案.

你能用柱形图创建一个类似直方图的图表吗？

虽然您无法控制柱形图中列组之间的间距,但您可以通过将列指定为不同的列,然后将每个列的颜色设置为配置选项中的相同颜色来将列几乎相互按下.

这是一个简单的3列直方图:

var data = google.visualization.arrayToDataTable([
    ['x', '1-10', '11-20', '21-30'],
    ['', 3, 5, 4]
  ]);

  // Create and draw the visualization.
  new google.visualization.ColumnChart(document.getElementById('visualization')).
      draw(data,
           {title:"My Histogram",
            width:600, height:400,
            hAxis: {title: null},
            colors: ['red','red','red'],
            legend: {position: 'none'}
           }
      );

请注意,您有1行,每列有3列,每列都有颜色'red'.这样做的缺点是你会沿着x轴失去标签,告诉你哪一列代表什么.同样,您将需要某种逻辑来构建此直方图,并以您希望的方式填充数据.

因此,长话短说是谷歌图表没有直方图,虽然可以使用柱形图,但您可以考虑查看不同的库.