Charts (jqm1000)
De Wiki1000
(Différences entre les versions)
(Page créée avec « Ce support permet d'afficher des graphique Google chart dans une page de l'application. ===Méthode=== {|class="wikitable" |- !Méthode !Usage |- |$.mobApp.showChart(meth... ») |
(→Format de requête) |
||
| Ligne 22 : | Ligne 22 : | ||
Elle peut retourner soit un graphique, soit un ensemble de graphique. | Elle peut retourner soit un graphique, soit un ensemble de graphique. | ||
| + | |||
| + | {|class="wikitable" | ||
| + | |- | ||
| + | |chart | ||
| + | |Structure ou tableau de structure | ||
| + | |- | ||
| + | |title | ||
| + | |Titre du graphique | ||
| + | |- | ||
| + | |options | ||
| + | |Options Google du graphique. | ||
| + | |- | ||
| + | |cols | ||
| + | |Données du graphique (Colonnes) | ||
| + | |- | ||
| + | |rows | ||
| + | |Données du graphique (Lignes) | ||
| + | |} | ||
'''Exemple de structure JSON à retourner :''' | '''Exemple de structure JSON à retourner :''' | ||
Version du 27 février 2014 à 14:58
Ce support permet d'afficher des graphique Google chart dans une page de l'application.
Méthode
| Méthode | Usage |
|---|---|
| $.mobApp.showChart(method, req, options) | Execute une requête et affiche un ou plusieurs graphique(s) en fonction de la réponse |
| $.mobApp.showAChart($elt, data) | Affiche un graphique |
| $.fn.bindChart(options) | Rattache un gestionnaire d'évènement sur des éléments référençant un graphique |
Format de requête
La requête doit retourner les données du graphique au format Google.
Elle peut retourner soit un graphique, soit un ensemble de graphique.
| chart | Structure ou tableau de structure |
| title | Titre du graphique |
| options | Options Google du graphique. |
| cols | Données du graphique (Colonnes) |
| rows | Données du graphique (Lignes) |
Exemple de structure JSON à retourner :
{ "chart":{ "title":"Frais de Février (2014)", "options":{ "pieSliceText":"value" }, "cols":[ { "name":"Statut", "type":"string" }, { "name":"Montant", "type":"number" } ], "rows":[ [ "En attente1", 2736.29 ], [ "Comptabilisées", 385.56 ], [ "Refusées", 1164.61 ] ] } }
Exemple de code générant un graphique :
//Procedure getDashboard(req:TJson; var resp:TObject); Type ExpenseSumView = viewOf(TNoteFrais) aYear:Integer = year(nDate); aMonth:Integer = month(nDate); aAmount:Currency = sum(MontantRetenu); aUser:string = Salarie.Operateur.oidutilisateur; aStatus:Integer = Statut; end; var json:TJson; ls:TSelector; inst:ExpenseSumView; indx,idc:Integer; begin json := TJson.Create(''); resp := json; // json.chart.title := Format(_TP('Frais de %s (%d)'),[NameOfMonth(ThisMonth),ThisYear]); json.chart.options.pieSliceText := 'value'; json.chart.cols[0].name := _TP('Statut'); json.chart.cols[0].type := 'string'; json.chart.cols[1].name := _TP('Montant'); json.chart.cols[1].type := 'number'; // ls := ExpenseSumView.CreateSelector('(aUser=%1) and (aYear=%2) and (aMonth=%3)','-aYear,-aMonth',true,[GlbUserName,ThisYear,ThisMonth]); foreachP inst in ls.AsCursor index indx do begin case inst.aStatus of StatutNF_Valide : json.chart.rows[indx][0] := _TP('Validées'); StatutNF_Comptabilise : json.chart.rows[indx][0] := _TP('Comptabilisées'); StatutNF_Regle : json.chart.rows[indx][0] := _TP('Réglées'); StatutNF_Refuse : json.chart.rows[indx][0] := _TP('Refusées'); else json.chart.rows[indx][0] := _TP('En attente')+inttostr(inst.aStatus); end; json.chart.rows[indx][1] := inst.aAmount; end; end;
