2017-09-05 56 views
0

我想根據我在控制器中選擇的一些標準,從時間線上顏色的一些酒吧,我想要的顏色。我在頁面呈現谷歌圖表的時間軸不識別顏色

{ 
    "cols": [ 
    { "id": "", "label": "Project Name", "pattern": "", "role": "", "type": "string" }, 
    { "id": "", "label": "Period", "pattern": "", "role": "", "type": "string" }, 
    { "id": "", "label": "Start", "pattern": "", "role": "", "type": "date" }, 
    { "id": "", "label": "End", "pattern": "", "role": "", "type": "date" }, 
    { "id": "", "label": "", "pattern": "", "role": "style", "type": "string"}], 
    "rows": [ 
    { "c": [{ "v": "test", "f": null},{"v": "Fesability", "f": null},{"v": 1504224000000,"f": null},{"v": 1504742400000,"f": null},{"v": "#45a128","f": null}]}, 
    { "c": [{ "v": "test", "f": null},{"v": "Conceptual", "f": null},{"v": 1504742400000,"f": null},{"v": 1505347200000,"f": null},{"v": "#45a128","f": null}]}] 
} 

和腳本:一個用作數據是下一個JSON的

<script> 
    google.charts.load('current', { 'packages': ['timeline'] }); 
    google.charts.setOnLoadCallback(drawChart); 

    function drawChart() { 
     var jsonData = $.ajax({ 
      url: '/Report/[email protected]', 
      dataType: "json", 
      async: false 
     }).responseText; 


     // Create our data table out of JSON data loaded from server. 
     var data = new google.visualization.DataTable(jsonData); 

     // Instantiate and draw our chart, passing in some options. 
     var chart = new google.visualization.Timeline(document.getElementById('timeline')); 

     chart.draw(data); 
    } 
</script> 

的問題是,我想它不上色吧。我也嘗試過'顏色:#435278',結果相同,不工作。

回答

0

訂單對於列來說很重要,所以Google Charts只有在它是第三個時纔會識別樣式列。我將json格式化爲這個,並且一切正常。新的JSON看起來是這樣的:

{ 
    "cols": [ 
    { "id": "", "label": "Project Name", "pattern": "", "role": "", "type": "string" }, 
    { "id": "", "label": "Period", "pattern": "", "role": "", "type": "string" }, 
    { "id": "", "label": "", "pattern": "", "role": "style", "type": "string"} 
    { "id": "", "label": "Start", "pattern": "", "role": "", "type": "date" }, 
    { "id": "", "label": "End", "pattern": "", "role": "", "type": "date" }], 
    "rows": [ 
    { "c": [{ "v": "test", "f": null},{"v": "Fesability", "f": null},{"v": "#45a128","f": null},{"v": 1504224000000,"f": null},{"v": 1504742400000,"f": null}]}, 
    { "c": [{ "v": "test", "f": null},{"v": "Conceptual", "f": null},{"v": "#45a128","f": null},{"v": 1504742400000,"f": null},{"v": 1505347200000,"f": null}]}] 

}