You can place an animation on the pie chart

Question

You can place an animation on the pie chart

Navigation

#1 by (3 votes)

1

Is it possible to use some animation in google pie-chart? I put it that way, but it's not working:

var options = {
            title: 'Tickets por prazo',
            series: {
                0: {"color": '#57c8f2'},
                1: {"color": '#ff6c60'}
            },
            animation:{
                duration: 1500,
                startup: true
            }
        };

If you can help, thank you.

google-charts

asked by anonymous 01.09.2016 / 22:55

1 answer

How to change the Look and Feel of an application? Number of items aligned vertically according to div height

score 3 · Accepted Answer

You can highlight the information:

 google.setOnLoadCallback(drawChart);
  function drawChart() {

    var data = google.visualization.arrayToDataTable([
      ['Tarefas', 'Horas por dia'],
      ['Trabalho', 11],
      ['Comida', 2],
      ['Comunitário', 2],
      ['TV', 2],
      ['Dormir', 7]
    ]);

    var options = {
      title: 'Atividades',          
    };

    var chart = new google.visualization.PieChart(document.getElementById('piechart'));
    chart.draw(data, options);

    var counter = 0;

    var handler = setInterval(function(){ 
        counter = counter + 0.1
        options = {
          title: 'Atividades',           
          slices: { 1: {offset: counter},                       
                    3: {offset: counter},                       
                    5: {offset: counter},
          }
        };
        chart.draw(data, options);

        if (counter > 0.3) clearInterval(handler);
    }, 200);        
  }

JSFiddle

This "animation" is called Exploding a Slice

I suggest you take a look at the documentation: Pie Chart .