javascript 如何使谷歌饼图api背景透明
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9974483/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make google pie chart api background transparent
提问by Django Anonymous
this is the google code for pie char apt:
这是饼图 apt 的谷歌代码：
<script type="text/javascript">
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Topping');
data.addColumn('number', 'Slices');
data.addRows([
['Mushrooms', 3],
['Onions', 1],
['Olives', 1],
['Zucchini', 1],
['Pepperoni', 2]
]);
var options = {backgroundColor: '#676767',
'width':400,
'height':300};
var chart = new google.visualization.PieChart(document.getElementById('priority_customers_report'));
chart.draw(data, options);
}
</script>
Here the backgroundColor: '#676767'gives us the color now I want it to be transparent, how can I do that?
这里backgroundColor: '#676767'给了我们颜色，现在我希望它是透明的，我该怎么做？
And how to set the text in bottom? As it's not clear in Google Documentation, really tough to understand.
以及如何在底部设置文本？由于在 Google 文档中不清楚，因此很难理解。
This is related to the Simple Pie Chart of Google
回答by MrCode
The transparent background can be set with:
透明背景可以设置为：
var options = {backgroundColor: 'transparent',
'width':400,
'height':300};
You can also set the title there:
您还可以在那里设置标题：
var options = {backgroundColor: 'transparent',
'width':400,
'height':300,
'title' : 'My Chart'};
Edit:To set the right hand items to show at the bottom use:
编辑：要将右手项目设置为显示在底部，请使用：
var options = {backgroundColor: 'transparent',
'width':400,
'height':300,
'title' : 'My Chart'
legend : { position : 'bottom' }
};
The list of possible options are here.
可能的选项列表在这里。
回答by Django Anonymous
I got the answerbackgroundColor: '#676767'with backgroundColor: {fill: 'transparent'}and it will do the needful.
我得到了答案backgroundColor: '#676767'，backgroundColor: {fill: 'transparent'}它会做必要的事情。
This will not work on IE as IE does not support Transparency, still we can add color of our choice by writing this code:-
这在 IE 上不起作用，因为 IE 不支持透明，但我们仍然可以通过编写以下代码来添加我们选择的颜色：-
With a bit of help from jQuery:
在 jQuery 的帮助下：
// check for IE
if ($.browser.msie) {
options2['backgroundColor'] = {fill: <color>};
}
else {
options2['backgroundColor'] = {fill: 'transparent'};
}
Still i am unable to set the position in bottom....
我仍然无法在底部设置位置....
回答by Arnoud Philip
In IE, using jQuery, you can do the following to set the chart's background to transparent:
在 IE 中，使用 jQuery，您可以执行以下操作将图表的背景设置为透明：
$('#vis iframe').attr('allowTransparency', 'true');
$('#vis iframe').contents().find('body').css('background', 'transparent');
where #visis the id of the div where the chart is at.
其中#vis是其中图表是在div的ID。
