2017-10-16 1 views
0

Ich möchte in der balloontext der hier Animated Time-Line Pie ChartWie können Animated Amcharts-Timeline-Tortendiagrammen mehrere Value-Felder bereitstellen?

mehr als eine Werte anzuzeigen ist der 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(); 
} 
    } ], 
    }); 

ich die Valuefield wollen, valueField1 & valueField2 im balloonText und Labeltext, während die angezeigt werden Kreisdiagramm lädt.

Aber das Diagramm erscheint leer beim Laden, da es nicht WertField1 liest & valueField2. Ich verstehe, dass ich einen Fehler bei der Zuweisung von valueField1 & valueField2 mache. Kann mir jemand helfen, es zu reparieren und Darf ich wissen, wie man das Diagramm Werte in chartData.state und chartData.statecount darstellt?

Vielen Dank!

PS ist dies eine Fortsetzung für How to provide data to Animated time-line pie amcharts? zugewiesenen Werte in

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]); 
} 
} 

ist kein tatsächlicher Code prod.

Antwort

0

Sie können nicht mehrere valueFields in einem Kreisdiagramm eingestellt, aber Sie können die Felder namentlich durch [[shortcodes]], dh [[State]] und [[StateCount]] wie angegeben in der balloonText und labelText Dokumentation (Hervorhebung von mir) Referenz:

Die folgenden Tags können verwendet werden: [[Wert]], [[Titel]], [[Prozent]], [[Beschreibung]] oder ein anderer Feldname von Ihrem Datenanbieter.

Ihre balloonText sollte wie folgt aussehen:

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

Passen Sie Ihren Labeltext entsprechend.

Demo

+0

Ich weiß nie, dass amchart die kurzen Codes in balloonText und Labeltext akzeptiert. Das funktioniert perfekt! Vielen Dank @xorspark –

Verwandte Themen