Javascript google PieChart animation load

Question

私はGoogle PieChartをやっています。このウェブサイトに表示されている円のような読み込み効果を持たせたいと思います。 enter link description here しかし、このウェブではGoogle以外のライブラリを使用しています。私はGoogleのソリューションを見つける必要があります。

これは私のコードです：ここでは

enter code here 

function cargarDonut(idElemento, color){ 
    google.charts.load("current", {packages:["corechart"]}); 
    google.charts.setOnLoadCallback(drawChart); 

function drawChart() { 
    var data = google.visualization.arrayToDataTable([ 
    ['Task', 'Hours per Day'], 
    ['Work',  11], 
    ['Eat',  2], 
    ]); 

    var options = { 
    chartArea:{top:'0%',width:'100%', height:'80%'}, 
    height: 240, 
    backgroundColor: 'transparent', 
    pieHole: 0.67, 
    legend: 'none', 
    pieSliceBorder: 100, 
    pieSliceText: 'none', 
    slices: { 2: {offset: 1}}, 

    colors: [ '#797879', color], 

    }; 

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


} 

} 

Answer 1

私はあなたのための一例をcraetedています。 https://jsfiddle.net/wecv3x8r/

function cargarDonut(idElemento, color){ 
    google.charts.load("current", {packages:["corechart"]}); 
    google.charts.setOnLoadCallback(drawChart); 

function drawChart() { 
    var data = google.visualization.arrayToDataTable([ 
    ['Task', 'Hours per Day'], 
    ['Work',  11], 
    ['Eat',  2], 
    ]); 

    var options = { 
    chartArea:{top:'0%',width:'100%', height:'80%'}, 
    height: 240, 
    backgroundColor: 'transparent', 
    pieHole: 0.67, 
    legend: 'none', 
    pieSliceBorder: 100, 
    pieSliceText: 'none', 
    slices: { 2: {offset: 1}}, 

    colors: [ '#797879', color], 

    }; 

    var chart = new 
google.visualization.PieChart(document.getElementById(idElemento)); 
chart.draw(data, options); 
// initial value 
    var percent = 0; 
    // start the animation loop 
    var handler = setInterval(function(){ 
     // values increment 
     percent += 1; 
     // apply new values 
     data.setValue(0, 1, percent); 
     data.setValue(1, 1, 100 - percent); 
     // update the pie 
     chart.draw(data, options); 
     // check if we have reached the desired value 
     if (percent > 74) 
      // stop the loop 
      clearInterval(handler); 
    }, 30); 

} 

}