Java mind: Graphique sous une application Android

Il existe plusieurs API permettant d’ajouter des graphiques à une application Android. Nous avons la possibilité d’utiliser des API utilisées ordinairement dans des applications Java mais il existe des librairies propres à l’OS Android apportant plus de fonctionnalités.

Vous trouverez des librairies payantes

Et des librairies libre d’utilisation (licence LGPL ou Apache 2.0)

AFreeChart : projet basé sur la librairie Java JFreeChart, licence LGPL
AChartEngine : licence Apache 2.0
kiChart librairie libre d’utilisation offrant un nombre limité de graphiques (licence ???)
AndroidPlot licence LGPL
ChartDroid : licence Apache 2.0
Snowdon : licence Apache 2.0

Cette liste n’est pas exhaustive. Nous allons maintenant voir un exemple d’implémentation qui se basera sur la librairie AChartEngine. La première étape consiste à la télécharger et à la placer dans un répertoire lib de notre projet. Vous devrez ensuite aller dans les propriétés du projet pour ajouter cette librairie dans le build path

Mais aussi de penser à l’exporter dans le livrable en la cochant dans l’onglet « Order and Export »

Lorsque vous souhaitez ouvrir un nouveau graphique à partir d’une activité vous devez faire appel à une factory org.achartengine.ChartFactory permettant de construire soit une View soit une Intent.

Dans mon exemple j’ai choisi d’utiliser la génération d’une Intent qui ouvrira une Activity généré par la librairie. Cette Activity doit être ajoutée dans votre fichier AndroidManifest.xml.

<activity
              android:name="org.achartengine.GraphicalActivity"
              android:label="@string/app_name"/>

Au niveau du code le principe consiste à paramétrer le rendu qu’aura le graphique d’une manière générale puis de gérer chaque série de données ajoutées à notre graphique.

Exemple de graphique en nuage de points

public Intent execute(Context context, Partie partie, PartieService partieService) {
        // Preparation du renderer
 XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
 
 renderer.setAxisTitleTextSize(16);
 renderer.setChartTitleTextSize(20);
 renderer.setLabelsTextSize(15);
 renderer.setLegendTextSize(20);
 renderer.setPointSize(5f);
 renderer.setMargins(new int[] { 30, 40, 20, 20 });
 renderer.setMarginsColor(Color.WHITE);
 renderer.setXLabels(5);
 renderer.setYLabels(10);
 renderer.setChartTitle("Suivi des scores");
 renderer.setXTitle("Manches");
 renderer.setYTitle("Score");
 renderer.setXAxisMin(0.8);
 renderer.setXAxisMax(nbManche+1);
 renderer.setYAxisMin(0);
 renderer.setAxesColor(context.getResources().getColor(R.color.grey));
 renderer.setLabelsColor(Color.BLACK);
 renderer.setApplyBackgroundColor(true);
 renderer.setGridColor(context.getResources().getColor(R.color.grey_light));
 renderer.setShowGrid(true);
 renderer.setShowLegend(true);
 renderer.setShowLabels(true);
 renderer.setZoomEnabled(false, false);
 renderer.setPanEnabled(false);
 
 // Les séries de données du graphe
 XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();
 
 Integer maxScore = 0;
 int c=0;
 // Chaque joueur a un ensemble de marque
 for (Joueur joueur : partie.getJoueurs()) {
     // On indique le style de la serie
     XYSeriesRenderer r = new XYSeriesRenderer();
     r.setColor(colors[c++%8]);
     r.setPointStyle(PointStyle.DIAMOND);
     r.setDisplayChartValues(true);
     r.setLineWidth(3);
     r.setChartValuesTextSize(15);
     r.setGradientEnabled(true);
     renderer.addSeriesRenderer(r);

     XYSeries series = new XYSeries(joueur.getNom());
     // Parcours des resultats
     for (Long i = 1L; i <= nbManche; i++) {
  List marquesSaisies = partie.getScoresManche().get(i);
  if (marquesSaisies != null) {
      for (MarqueJoueur marque : marquesSaisies) {
   if (joueur.equals(marque.getJoueur())) {
       Integer score = marque.getScore();
       maxScore = score>maxScore ? score : maxScore;
       series.add(
                              Double.valueOf(i),
                              Double.valueOf(score));
       break;
   }
      }
  }
     }
     dataset.addSeries(series);
 }
 renderer.setYAxisMax(maxScore+1);
 renderer.setPanLimits(new double[] {0.8,nbManche+1, 1, maxScore+1 });
 
 return ChartFactory.getLineChartIntent(context, dataset, renderer);
}

Au niveau de l’activité

ResultChart resultChart = new ResultChart();
Intent intent = resultChart.execute(this, partie, partieService);
startActivity(intent);

Et le tour est joué

Autre exemple avec un graphique en histogramme

public Intent execute(Context context, Partie partie, PartieService partieService) {
        // Preparation du renderer
 XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
 
 renderer.setAxisTitleTextSize(16);
 renderer.setChartTitleTextSize(20);
 renderer.setLabelsTextSize(15);
 renderer.setLegendTextSize(20);
 renderer.setPointSize(5f);
 renderer.setMargins(new int[] { 30, 40, 20, 20 });
 renderer.setMarginsColor(Color.WHITE);
 renderer.setXLabels(5);
 renderer.setYLabels(10);
 renderer.setChartTitle("Suivi des scores");
 renderer.setXTitle("Joueurs");
 renderer.setYTitle("Score");
 renderer.setXAxisMin(0.8);
 renderer.setXAxisMax(nbJoueur+1);
 renderer.setYAxisMin(0);
 renderer.setYAxisMax(maxScore+1);
 renderer.setAxesColor(context.getResources().getColor(R.color.grey));
 renderer.setLabelsColor(Color.BLACK);
 renderer.setApplyBackgroundColor(true);
 renderer.setGridColor(context.getResources().getColor(R.color.grey_light));
 renderer.setShowGrid(true);
 renderer.setShowLegend(true);
 renderer.setShowLabels(true);
 renderer.setZoomEnabled(false, false);
 renderer.setPanEnabled(false);
 renderer.setBarSpacing(0.5f);
 renderer.setPanLimits(new double[] {0.8,nbJoueur+1, 1, maxScore+1 });
 renderer.setFitLegend(true);
 renderer.setXLabels(nbJoueur);
 
 // Les séries de données du graphe
 XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();

 int c=0;
 //On parcours les différentes manches
 for (Long i = 1L; i <= nbManche; i++) {
     // On indique le style de la serie
     SimpleSeriesRenderer r = new SimpleSeriesRenderer();
     r.setColor(colors[c++%8]);
     r.setDisplayChartValues(true);
     r.setChartValuesSpacing(5);
     renderer.addSeriesRenderer(r);
     
     CategorySeries series = new CategorySeries("Manche " + i);
     List marquesSaisies = partie.getScoresManche().get(i);
     // Chaque joueur a un ensemble de marque
     if (marquesSaisies != null) {
  //Tri de la liste par nom de joueur
  Collections.sort(marquesSaisies);
  for (MarqueJoueur marque : marquesSaisies) {
      Integer score = marque.getScore();
      maxScore = score>maxScore ? score : maxScore;
      series.add(Double.valueOf(score));
  }
     }
     
     dataset.addSeries(series.toXYSeries());
 }
 renderer.setYAxisMax(maxScore+1);
 
 return ChartFactory.getBarChartIntent(context, dataset, renderer,Type.DEFAULT);
}