Comment fournir plusieurs champs de valeurs au diagramme à secteurs de diagramme d'animations animées?

Question

Je veux afficher plus d'une valeur dans la balloonText du Animated Time-Line Pie Chart

Voici le code:

function pushvalue(curyear,curmonth,monvalue,state,statecount){ 
array.push({year: curyear, month: curmonth, count: monvalue, state: state, statecount: statecount}); 
} 

var monthNames = ["January", "February","March", "April", "May", "June","July", "August", "September", "October", "November", "December”]; 
var currentYear = 1997; 
var array = []; 

for (var i = 0; i < 4; ++i) { 
for (var j = 0; j < 12; ++j) { 
pushvalue(currentYear + i, monthNames[j],count[j],state[j],statecount[j]); 
} 
} 

var chartData = {}; 
for (var i = 0; i < array.length; ++i) { 
    if (!chartData[array[i].year]) { 
    chartData[array[i].year] = []; 
    } 
    chartData[array[i].year].push({"Month": array[i].month, "Count": array[i].count, “State”: array[i].state, “StateCount”: array[i].statecount }); 
} 

var currentYear = 1997; 
var chart = AmCharts.makeChart("chartdiv", { 
    "type": "pie", 
    "theme": "light", 
    "dataProvider": [], 
    "valueField": "Count", 
    “valueField1”: “State”, 
    “valueField2”: “StateCount”, 
    "titleField": "Month", 
    "startDuration": 0, 
    "innerRadius": 80, 
    "pullOutRadius": 20, 
    "marginTop": 30, 
“balloonText”: “Completed [[value2]] for [[value1]] states in [[title]] month”, 
“labelText”: “[[title]] - [[value]]”, 
    "titles": [{ 
    "text": "Test chart" 
    }], 
    "allLabels": [{ 
    "y": "54%", 
    "align": "center", 
    "size": 25, 
    "bold": true, 
    "text": "1995", 
    "color": "#555" 
    }, { 
    "y": "49%", 
    "align": "center", 
    "size": 15, 
    "text": "Year", 
    "color": "#555" 
    }], 
    "listeners": [ { 
    "event": "init", 
    "method": function(e) { 
     var chart = e.chart; 

    function getCurrentData() { 
    var data = chartData[currentYear]; 
    currentYear++; 
    if (currentYear > 2000) 
     currentYear = 1997; 
    return data; 
    } 

    function loop() { 
    chart.allLabels[0].text = currentYear; 
    var data = getCurrentData(); 
    chart.animateData(data, { 
     duration: 1000, 
     complete: function() { 
     setTimeout(loop, 3000); 
     } 
    }); 
    } 

    loop(); 
} 
    } ], 
    }); 

Je veux que le ValueField, valueField1 & valueField2 à afficher dans la balloonText et labelText alors que le Charges de camembert.

Mais le graphique apparaît vide lors du chargement car il ne lit pas valueField1 & valueField2. Je comprends que je fais une erreur lors de l'affectation de valueField1 & valueField2. Quelqu'un peut-il m'aider à résoudre le problème et Puis-je savoir comment afficher les valeurs de graphique dans chartData.state et chartData.statecount?

Merci!

PS c'est une continuation pour How to provide data to Animated time-line pie amcharts? Les valeurs attribuées à

for (var i = 0; i < 4; ++i) { 
for (var j = 0; j < 12; ++j) { 
pushvalue(currentYear + i,monthNames[j],count[j],state[j],statecount[j]); 
} 
} 

Ne sont pas de code prod réel.

Answer 1

Vous ne pouvez pas définir plusieurs valueFields dans un graphique circulaire, mais vous pouvez référencer les champs par nom par [[shortcodes]], à savoir [[State]] et [[StateCount]] comme indiqué dans la documentation balloonText et labelText (Souligné par):

Les balises suivantes peuvent être utilisées: [[valeur]], [[titre]], [[pourcentages]], [[description]] ou tout autre nom de champ de votre fournisseur de données.

Votre balloonText devrait ressembler à ceci:

"balloonText": "Completed [[State]] for [[StateCount]] states in [[title]] month",

Ajustez votre labelText en conséquence.

Demo