使用Google Charts API在面积图中对线条进行颜色更改

时间:2014-05-22 08:26:05

标签: javascript html charts

我有一个在Google Charts API中创建的折线图,现在我想以不同的方式更改LIne颜色和正文颜色,但是当我创建图表时我可以看到线条和正文颜色相同,请任何人都可以让我知道如何使用谷歌API更改颜色

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['',''],
          ['',27],
          ['',25],
          ['',60],
          ['',31],
          ['',25],        
          ['',39],        
          ['',25],
          ['',31],
          ['',26],
          ['',28],        
          ['',80],          
          ['',28],
          ['',27],
          ['',31],
          ['',27],        
          ['',29],        
          ['',26],
          ['',35],
          ['',70],
          ['',25]             
        ]);
        var options = {   
                backgroundColor: {
                    stroke: '#4322c0',
                    strokeWidth: 3},
                'is3D':true,
                series: {0:{color:'#DF013A',lineWidth:2}},
                colors:['#D8D8D8'],
                backgroundColor: "transparent",
                legend: {position: 'none'}
        };
        var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 300px; height: 300px;"></div>
  </body>
</html>
  <body>
    <div id="chart_div"></div>
  </body>
</html>

1 个答案:

答案 0 :(得分:0)

请参阅以下开发者文档以更改线序列颜色和背景颜色: