Créer deux graphiques linéaires ou plus à l’aide de MPAndroidChart [Java]

Pourquoi j'ai créé cet article

Je suis nouveau dans la production d'applications Android. J'ai réussi à rendre quelque chose de tangible par le texte et la recherche sur le Web, mais je suis toujours à la recherche de code qui semble utile car je ne peux pas comprendre les bases de la réflexion. Cette fois, je me suis connecté à la base de données et j'ai créé deux graphiques en lignes brisées en utilisant ces données, mais j'ai eu du mal à ne pas connaître la description de la deuxième ligne, alors j'aimerais l'écrire ici.

référence##

Blog Money Forward Engineer (Android: Expressif avec affichage graphique. Utilisons MPAndroidChart!) Développement de l'application de Nyan (dessin de graphiques avec la bibliothèque [Android] MPAndroidChart) ← Ceci est un blog avec de nombreux articles. Merci pour votre aide tout au long.

environnement##

Windows10 AndroidStudio4

Initialisation du graphe

Veuillez consulter le site de référence pour l'introduction et la mise en page de MPAndroidChart. J'ai également commenté certaines des méthodes que je n'ai pas utilisées.

LineChartActivity.java

LineChart mChart = findViewById(R.id.lineChart);
        //Afficher ou non le texte de description du graphique
        mChart.getDescription().setEnabled(true);
        //Texte de description du graphique (nom de l'application, etc.)
        mChart.getDescription().setText(getResources().getString(R.string.app_name));
        //Description du graphique Réglage de la couleur du texte
        //mChart.getDescription().setTextColor(Color.BLACK);
        //Description du graphique Réglage de la taille du texte
        //mChart.getDescription().setTextSize(10f);
        //Réglage de la position d'affichage du texte de description du graphique
        //mChart.getDescription().setPosition(0, 0);
        //Couleur d'arrière-plan du graphique
        mChart.setBackgroundColor(Color.WHITE);

        //réglage de l'axe x
        XAxis xAxis = mChart.getXAxis();
        //Sortie axe x en diagonale
        xAxis.setLabelRotationAngle(45);
        //valeur maximale de l'axe des x valeur minimale
        //0 si~9ème est la sortie(10 morceaux)Si vous ne l'écrivez pas, les données enregistrées seront affichées.
        xAxis.setAxisMinimum(0f);
        xAxis.setAxisMaximum(9f);
        //Réglez la date enregistrée dans la base de données sur l'axe des x
        xAxis.setValueFormatter(new IndexAxisValueFormatter(getDate()));

        //Faire de l'axe x une ligne brisée(Dashed Line)
        xAxis.enableGridDashedLine(10f, 10f, 0f);
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);

        //réglage de l'axe y
        YAxis yAxis = mChart.getAxisLeft();
        //Réglage maximum / minimum de l'axe Y
        yAxis.setAxisMaximum(150f);
        yAxis.setAxisMinimum(50f);
        //Faire de l'axe y une ligne brisée
        yAxis.enableGridDashedLine(10f, 10f, 0f);
        yAxis.setDrawZeroLine(true);

        //L'échelle à droite. Faux si non nécessaire
        mChart.getAxisRight().setEnabled(false);

paramètres de l'axe des x

Méthode GetDate pour le réglage de l'axe x. J'ai dû changer le type de données enregistrées dans la base de données. Il semble que je puisse écrire plus intelligemment, mais pour moi maintenant, c'est tout. La date variable est une ArrayList qui contient les données dans la base de données.

LineChartActivity.java

//SimpleDateFormat en réécrivant les données enregistrées en type String en type date
private  ArrayList<String> getDate() {
        ArrayList<String> dateLabels = new ArrayList<>();
        for (int i = 0; i < date.size(); i++) {
            try {
                //Corriger la date à ce jour
                String strDate = date.get(i);
                DateFormat dateFormat = new SimpleDateFormat("yyyy/MM/dd");
                Date entryDate = dateFormat.parse(strDate);
                DateFormat dt = new SimpleDateFormat("MM/dd");
                String setDate = dt.format(entryDate);
                dateLabels.add(setDate);
            } catch (ParseException e) {
                e.printStackTrace();
            }
        }
        return dateLabels;
    }

Affichage des données##

Les variables valuesMax et valuesMin sont ArrayList qui contiennent les données dans la base de données.

LineChartActivity.java

ArrayList<Entry> valuesMax = new ArrayList<>();
ArrayList<Entry> valuesMin = new ArrayList<>();
        LineDataSet max;   //Argument de ligne
        LineDataSet min;   
//Méthode de réglage de la ligne
        max = new LineDataSet(valuesMax, "A");//Nom de l'étiquette
        max.setColor(Color.RED);          //Couleur de la ligne
        max.setCircleColor(Color.RED);    //Coordonner la couleur
        max.setLineWidth(5f);             //Épaisseur de ligne 1f~
        max.setCircleRadius(5f);          //Taille des coordonnées
        max.setDrawCircleHole(false);     //Remplir les coordonnées → faux Ne pas remplir → vrai
        max.setValueTextSize(10f);        //Écrivez la valeur des données. Non répertorié à 0f. Parce que c'est un flotteur, il a un point décimal
        max.setDrawFilled(true);          //Remplir sous la ligne
        max.setFillColor(Color.RED);      //Couleur du champ rempli

//Faire un autre ensemble
        min = new LineDataSet(valuesMin, "B");
        min.setColor(Color.BLUE);
        min.setCircleColor(Color.BLUE);
        min.setLineWidth(5f);
        min.setCircleHoleRadius(5f);
        min.setDrawCircleHole(false);
        min.setValueTextSize(10f);
        min.setDrawFilled(true);
        min.setFillColor(Color.BLUE);

        //Définir une ligne sur le graphique
        ArrayList<ILineDataSet> dataSets = new ArrayList<>();
        dataSets.add(max);
        dataSets.add(min);
        LineData lineData = new LineData(dataSets);
        mChart.setData(lineData);
        //Animez les données. milliseconde.Les plus grands nombres sont plus lents
        mChart.animateX(1000);

La ligne que vous avez ajoutée à ILineDateSet s'affiche à l'écran.

Le produit fini

Deux graphiques s'affichent. J'ai fait le remplissage rouge et bleu, mais le bas de la ligne bleue est mélangé et est devenu violet ◎ Je suis heureux que vous puissiez l'utiliser comme référence.