如何使用google chart api創建直方圖？

除了使用柱形圖，並適當地命名是有可能創建在谷歌圖表API直方圖？如何使用google chart api創建直方圖？

2012-03-22 Usman Ismail

除了化妝品的差異，在直方圖您將定義每個條爲數值範圍，然後的任何值都將落入在該範圍內將由1遞增欄的計實際上的差別是在數據輸入的形式。對於直方圖，我應該能夠定義條寬（即間隔10），然後發送一個數字流。 – 2012-06-13 12:58:46

谷歌圖表沒有一個柱狀圖，因爲它僅僅是一個可視化庫，你將不得不修改Column Chart，以滿足您的需求。但是，我懷疑你對柱形圖不滿意的原因是因爲列間距，它看起來不像直方圖。所以我會先回答這個問題：

你可以控制列圖表中的列之間的間距嗎？

不，現在還沒有。請參閱Google Charts Community的報價

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軸上的標籤上輸了，告訴你哪一列代表了什麼。同樣，你將不得不有一些邏輯來構造這個直方圖，並按照你想要的方式填充數據。

所以長話短說，谷歌圖表沒有直方圖，雖然它是可能與柱狀圖，你可能會考慮尋找一個不同的圖書館。

來源

2012-06-13 15:59:18

as @ ic3在他的回答中聲明，他們現在擁有它https://developers.google.com/chart/interactive/docs/gallery/histogram – 2014-02-27 16:41:33

爲了增加mattedgod的回答，圖表可以現在的酒吧中創建列緊密排列在一起，使用選項：

bar: {groupWidth:"100%"};

來源

2012-12-02 22:01:29 mercator

谷歌前推出幾天的柱狀圖：link

來源

2013-11-27 15:59:37 ic3

您可以充實一點，也許包括一個例子嗎？（在這種情況下不是完全必要的，但確實會提供一個更具吸引力的答案） – Shog9 2013-12-26 23:24:47

單擊鏈接以查看示例，是您所需要的。吻。 – ic3 2013-12-28 08:57:24

如何使用google chart api創建直方圖？

回答

相關問題