2017-09-04 1 views
1

Je génère un graphique à l'aide du chargeur de données. Mes données JSON ressemblent à ceci.AmCharts Dynamic Stacked Column, ajouter urlField ou ID à JSON

{ 
     "Month": 1, 
     "District1": 2.6, 
     "District2": 5.7, 
     "District3": 6.2, 
     "District4": 7.3, 

    }, { 
     "Month": 2, 
     "District1": 4.6, 
     "District2": 5.7, 
     "District3": 2.2, 
     "District4": 6.3, 
     "District5": 4.3, 
     "District7": 1.3, 

    } 

Dans mon JavaScrit, j'utilise ce code pour générer des graphiques issus d'un fichier PHP.

for (var key in chart.dataProvider[ 0 ]) { 
      if (chart.dataProvider[ 0 ].hasOwnProperty(key) && key != chart.categoryField) { 

var graph = new AmCharts.AmGraph(); 
       graph.valueField = key; 
       graph.type = "column"; 
       graph.title = key; 
       graph.lineThickness = 0; 

       graph.urlField =????????????????????? 
       graph.urlTarget ="_blank"; 
       graph.labelColor = "#cccccc"; 
       graph.connect = false; 
       graph.fillAlphas = 0.8; 
       graph.balloonFunction = adjustBalloonText; 
       graph.labelText = key; 
       chart.addGraph(graph); 

      } 

     } 

Les données dynamique des papillons de nuit, il y a 15 objets certains seulement 12.

Je veux ajouter un lien vers chaque district ou id donc je peux générer de nouveaux graphique. Comment l'ajouter à la chaîne JSON. J'ai essayé de le faire avec des objets comme ça.

{ 
"Month":1 
"District1": {"value":1, "url":"url.php?id=1", "id":1} 
"District2": {"value":2, "url":"url.php?id=2", "id":2} 
} 

Je ne pouvais pas affecter un objet à graph.valueField = clé;

Est-ce que c'est possible? L'événement on click renvoie juste l'index du mois et non l'info sur le graphique "ID".

J'espère que quelqu'un peut m'aider à résoudre ce problème. J'ai essayé pendant des heures sans n'importe quelle chance.

Meilleures salutations

Martin

Répondre

1

Vous devez "aplatir" votre dataProvider, comme amCharts' urlField et valueField ne peut pas se référer à une clé dans un objet imbriqué. Ainsi, au lieu de:

{ 
    "Month":1 
    "District1": {"value":1, "url":"url.php?id=1", "id":1} 
    "District2": {"value":2, "url":"url.php?id=2", "id":2} 
} 

Essayez quelque chose de sortie comme ceci:

{ 

    "Month":1 

    "Dist1Value": 1, 
    "Dist1Url": "url.php?id=1", 
    "Dist1id": 1, 

    "Dist2Value": 2, 
    "Dist2Url": "url.php?id=2", 
    "Dist2id": 2 

} 

Je voudrais aussi changer votre boucle for key ... in à une boucle for normale à boucle sur les districts prédéfinis (je suppose que vous savez comment de nombreux districts peuvent être).

var amount_districts = 12; 

for(var i = 0; i < amount_districts.length; i++){ 

    // create a graph for each of our districts 

    var graph = new AmCharts.AmGraph(); 
    graph.type = "column"; 
    graph.title = "District " + (i+1); 
    graph.valueField = "Dist" + (i+1) + "Value"; 
    graph.UrlField = "Dist" + (i+1) + "Url"; 
    // ... etc 

    // finally, add this graph to the chart 
    chart.addGraph(graph); 

} 

Si cela se produit, il n'y a pas des éléments de données pour « District 10 », le graphique montre pas juste (cependant, il affichera dans la légende).