A
A
Alexey M.2015-05-18 09:51:40
Google
Alexey M., 2015-05-18 09:51:40

How to remove padding before and after pie chart (Google Pie Chart)?

Good afternoon!
Can you please tell me how to remove the padding before and after the pie chart? I use google tools to build graphs and charts: developers.google.com
Screenshot of how it looks like for me now:
d1fcb13844b345e4a11abbcc7ffd11dd.png
Generated code:

<script src="https://www.google.com/jsapi "></script>
<script>
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
 var data = google.visualization.arrayToDataTable([
  ['Результат', 'Процент сборок'],
  ['Успех', 61.15],
  ['Провал', 38.85]
 ]);
 var options = {
  title: 'Результаты для Main, %',
  pieHole: 0.5,
  pieSliceTextStyle: {
  color: 'black',
  position: 'center'
  }, 
  slices: {
            0: { color: '#90EE90' },
            1: { color: '#FA8072' }
          }
 };
 var chart = new google.visualization.PieChart(document.getElementById('Main'));
  chart.draw(data, options);
}
</script>

<script src="https://www.google.com/jsapi "></script>
<script>
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
 var data = google.visualization.arrayToDataTable([
  ['Результат', 'Процент сборок'],
  ['Успех', 95.65],
  ['Провал', 4.35]
 ]);
 var options = {
  title: 'Результаты для Release, %',
  pieHole: 0.5,
  pieSliceTextStyle: {
  color: 'black',
  position: 'center'
  }, 
  slices: {
            0: { color: '#90EE90' },
            1: { color: '#FA8072' }
          }
 };
 var chart = new google.visualization.PieChart(document.getElementById('Release'));
  chart.draw(data, options);
}
</script>

<table border="0">
<tr>
<td><div id="Main" style="width: 500px; height: 400px;">96 %</div></td>
<td><div id="Release" style="width: 500px; height: 400px;">96 %</div></td> 
</tr>
</table>

It does not look very good yet, editing the height and width of the cells only changes the width and height of the charts themselves, and the indents remain. Where to look? Can the source code be downloaded from Google and directly indicated? Well, I didn’t figure it out either, where is the place in it that is responsible for the indents? I'm not strong in scripts ...
And in general, maybe there is a working code for this: a pie chart
It's very beautiful, I will always have 2 options and it would be cool if the percentage of only the majority was shown in the center, Google doesn't work like that =(

Answer the question

In order to leave comments, you need to log in

2 answer(s)
A
Alexey M., 2015-05-18
@lnl

The question is closed, the drop-down block is used!

M
mshashin89, 2019-07-19
@mshashin89

This helped me, though on a different type of diagram, but I think it will work here too):

var options = {
chartArea: {top:0, height:'100%'},
}

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question