將標簽添加到Google圖表

Question

我一直試圖獲取一個圖表，以沿水平軸為列顯示不同的標簽。

我用過：

cols: [{id: '1', label: '00', type: 'number'},
    {id: '2', label: '01', type: 'number'},
    {id: '3', label: '02', type: 'number'}], 
// etc...

底部的數字應該表示小時，我需要它們從'00'開始到'23'結束。 有沒有辦法屏蔽它們/用指定的值替換？

這是目前的圖表：

但這似乎不起作用:(

順便說一句：我不能以“ 00”的形式通過數組發送它們，因為會發生這種情況： 未捕獲的錯誤：不是有效的2D數組，即使我將其更改為字符串，因為網格線不起作用，因為兩個值都必須是相同的類型。 啊啊

另外，目前它們是1-22時的數字，也應該是1-23- 為何缺少最后一個值？

編輯

這是JsFiddle： http : //jsfiddle.net/3AeC5/1/

數據傳入：

var data = google.visualization.arrayToDataTable();

從一個函數傳入：

 $.getJSON('charts_ajax.php',{'a' : "<?=$value?>" }, function(data){
  if(data){
      initGoogleChart(data,"<?=$key?>","<?=$value?>");
  }else {
      console.log("There is no data coming back");   
  }
 });

data的值為json_encode（$ chartData）並返回：

 [
    [0, 372],
    [1, 212],
    [2, 234],
    [3, 400],
    [4, 732],
    [5, 1940],
    [6, 3672],
    [7, 4744],
    [8, 4174],
    [9, 3506],
    [10, 3602],
    [11, 3774],
    [12, 3742],
    [13, 3863],
    [14, 4329],
    [15, 4054],
    [16, 3073],
    [17, 3456],
    [18, 3620],
    [19, 3484],
    [20, 3595],
    [21, 2488],
    [22, 1466],
    [23, 656]
]

$ chartData的var_dump為：

    array(24)           {
                  [0]=>
                  array(2)           {
                                        [0]=>
                                        int(0)
                                        [1]=>
                                        int(372)
                  }
                  [1]=>
                  array(2)           {
                                        [0]=>
                                        int(1)
                                        [1]=>
                                        int(212)
                  }
                  [2]=>
                  array(2)           {
                                        [0]=>
                                        int(2)
                                        [1]=>
                                        int(234)
                  }
                  [3]=>
                  array(2)           {
                                        [0]=>
                                        int(3)
                                        [1]=>
                                        int(400)
                  }
                  [4]=>
                  array(2)           {
                                        [0]=>
                                        int(4)
                                        [1]=>
                                        int(732)
                  }
                  [5]=>
                  array(2)           {
                                        [0]=>
                                        int(5)
                                        [1]=>
                                        int(1940)
                  }
                  [6]=>
                  array(2)           {
                                        [0]=>
                                        int(6)
                                        [1]=>
                                        int(3672)
                  }
                  [7]=>
                  array(2)           {
                                        [0]=>
                                        int(7)
                                        [1]=>
                                        int(4744)
                  }
                  [8]=>
                  array(2)           {
                                        [0]=>
                                        int(8)
                                        [1]=>
                                        int(4174)
                  }
                  [9]=>
                  array(2)           {
                                        [0]=>
                                        int(9)
                                        [1]=>
                                        int(3506)
                  }
                  [10]=>
                  array(2)           {
                                        [0]=>
                                        int(10)
                                        [1]=>
                                        int(3602)
                  }
                  [11]=>
                  array(2)           {
                                        [0]=>
                                        int(11)
                                        [1]=>
                                        int(3774)
                  }
                  [12]=>
                  array(2)           {
                                        [0]=>
                                        int(12)
                                        [1]=>
                                        int(3742)
                  }
                  [13]=>
                  array(2)           {
                                        [0]=>
                                        int(13)
                                        [1]=>
                                        int(3863)
                  }
                  [14]=>
                  array(2)           {
                                        [0]=>
                                        int(14)
                                        [1]=>
                                        int(4329)
                  }
                  [15]=>
                  array(2)           {
                                        [0]=>
                                        int(15)
                                        [1]=>
                                        int(4054)
                  }
                  [16]=>
                  array(2)           {
                                        [0]=>
                                        int(16)
                                        [1]=>
                                        int(3073)
                  }
                  [17]=>
                  array(2)           {
                                        [0]=>
                                        int(17)
                                        [1]=>
                                        int(3456)
                  }
                  [18]=>
                  array(2)           {
                                        [0]=>
                                        int(18)
                                        [1]=>
                                        int(3620)
                  }
                  [19]=>
                  array(2)           {
                                        [0]=>
                                        int(19)
                                        [1]=>
                                        int(3484)
                  }
                  [20]=>
                  array(2)           {
                                        [0]=>
                                        int(20)
                                        [1]=>
                                        int(3595)
                  }
                  [21]=>
                  array(2)           {
                                        [0]=>
                                        int(21)
                                        [1]=>
                                        int(2488)
                  }
                  [22]=>
                  array(2)           {
                                        [0]=>
                                        int(22)
                                        [1]=>
                                        int(1466)
                  }
                  [23]=>
                  array(2)           {
                                        [0]=>
                                        int(23)
                                        [1]=>
                                        int(656)
                  }

}

Answer 1

您這里有少量問題。 首先，要傳遞給arrayToDataTable構造函數的行不包含列標簽行作為第一行，因此使用行[ arrayToDataTable ]創建列標簽。 您要么需要包含列標簽行，要么將true作為第二個參數傳遞給arrayToDataTable構造函數：

// either this:
var data = google.visualization.arrayToDataTable([
    ['X', 'Y'],
    // data rows
]);
// or this:
var data = google.visualization.arrayToDataTable([
    // data rows
], true);

其次，如果您想獲得前導零，則hAxis.format選項是錯誤的。 將其設置為'00'而不是'####' 。 第三，您的chartArea太寬，並且切斷了圖表上的最后一個標簽。 通過將chartArea.width設置為810而不是'100%' ，在“ 23”標簽的末尾留一點空間以繪制標簽（在圖表末尾留10個像素）。

請在此處查看這些修復程序： http : //jsfiddle.net/asgallant/3AeC5/2/