谷歌图表更改背景颜色

我看到这里StackOverflow上以前的一些问题/答案，但没有在这些答案中提供的代码似乎与我的图表工作：这里是我的代码：谷歌图表更改背景颜色

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
    google.load("visualization", "1.1", {packages:["bar"]}); 
    google.setOnLoadCallback(drawChart); 
    function drawChart() { 
    var data = google.visualization.arrayToDataTable([ 
     ['Month', 'Sales', 'Expenses'], 
     ['January', 200, 150], 
     ['February', 1170, 460], 
     ['March', 660, 1120], 
     ['April', 1030, 540], 
     ['May', 1030, 540], 
     ['June', 1030, 540] 
    ]); 

    var options = { 

      chart: { 
      title: 'Company Performance', 
      subtitle: 'Sales, Expenses, and Profit: May-August', 
      backgroundColor: '#fcfcfc', 
      } 

    }; 

    var chart = new google.charts.Bar(document.getElementById('columnchart_material')); 

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

的HTML DIV代码：

<div id="columnchart_material" style="width: 650px; height: 500px;"></div>

的事情是我想从白色背景改为浅灰色和我似乎无法使它通过声明的backgroundColor工作：“#fcfcfc” 内选择{}

是否有任何其他的方式来声明图表我想，也许我使用不能改变它的背景颜色的图表类型上的背景颜色。

我也试图指定的backgroundColor变量的函数（后面大括号{的backgroundColor颜色：“#fcfcfc”}。，但没有我的图表上工作，要么

任何帮助将是higly 。感谢谢谢

的jsfiddle：http://jsfiddle.net/mtypsnqy/

来源

2015-06-23 user3772

首先，您放置在backgroundColor: '#fcfcfc',错误的地方您已经定义了它的chart:{}里面，而你应该做的，要么以外的任何对象o。为r的chartArea像内：

var options = { 
    chart: { 
    title: 'Company Performance', 
    subtitle: 'Sales, Expenses, and Profit: May-August' 
    }, 
    backgroundColor: '#fcfcfc' 
};

，这将导致含有该图表你的整个DIV是深灰色或这样的：

var options = { 
    chart: { 
    title: 'Company Performance', 
    subtitle: 'Sales, Expenses, and Profit: May-August' 
    }, 
    chartArea:{ 
     backgroundColor: '#fcfcfc' 
    } 
};

这将导致只包含您的两个轴内的区域为红色。

最后，你对Bar Charts API page按照规定更改

chart.draw(data, options);

到

chart.draw(data, google.charts.Bar.convertOptions(options));

。

我给你做一个小提琴在打转转，看到了差距：Link

来源

2015-06-23 13:11:04

谢谢亨里克。其实我尝试了你提出的第一个选择，什么都没有发生。显然，我必须修改chart.draw（）函数才能使更改生效。 – user3772

这是我失踪的部分：chart.draw（data，google.charts.Bar.convertOptions（options））; ... 谢谢。 – Patrick

我看到了很多类似问题的答案，但没有包含'chart.draw（data，google.charts.Bar.convertOptions（options））;'这个技巧。谢谢 – achasinh

谷歌图表更改背景颜色

回答

相关问题