2013-10-17 167 views
2

我正在使用谷歌图表api(折线图),我想改变y轴颜色从黑色到灰色。
(相同的颜色作为网格线)谷歌图表y轴颜色

enter image description here

我的代码:

google.load("visualization", "1", { packages: ["corechart"] }); 
     google.setOnLoadCallback(drawChart); 

     var baseLineColor = '#a3d06e'; 
     var lineColor = '#717171'; 

     function drawChart() { 
      var dataTable = new google.visualization.DataTable(); 
      dataTable.addColumn('number', 'date'); 
      dataTable.addColumn('number', 'sale'); 
      dataTable.addRows([ 
      [1, 2], 
      [2, 3], 
      [3, 3], 
      [4, 4], 
      [5, 5] 
     ]); 

      var options = { 
       enableInteractivity: false, 
       tooltip: {trigger: 'none'}, 
       pointSize: 0, 
       legend: 'none', 
       chartArea:{width:'94%',height:'70%'}, 
       backgroundColor: '#6AB5D1', 
       series: { 0: { color: lineColor, pointSize: 5, lineWidth: 4 }}, 
       hAxis: { textPosition: 'none', gridlines: {color:"#CCCCCC"} }, 
       vAxis: { textPosition: 'none', baseline: 3, baselineColor: baseLineColor, gridlines: {color:"#CCCCCC"}} 

      }; 

      var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
      chart.draw(dataTable, options); 

我怎么能这样做?

回答

8

设置hAxis.baselineColor选项:

hAxis: { 
    textPosition: 'none', 
    gridlines: { 
     color: "#CCCCCC" 
    }, 
    baselineColor: '#CCCCCC' 
} 
2

你可以通过设置baselineColor和使用这些参数gridlineColor改变谷歌API的X和Y轴的颜色。

vAxis:{ 
     baselineColor: '#ccc', 
     gridlineColor: '#ccc', 
     }