Come creare un Bar Chart con barre raggruppate con MPAndroidChart?

Question

Come posso confrontare due set di dati utilizzando BarChart di MPAndroidChart.

Esso dovrebbe essere simile a questa immagine qui sotto:

Ho modificato un codice, che ricevo da un progetto di esempio in github. come posso mettere insieme 100f and 110f valore in una Xaxis un'etichetta Whole Number

 Score score1 = new Score(100f, 0, "Whole Number"); 
     mRealm.copyToRealm(score1); 
     Score score2 = new Score(110f, 0, "Whole Number"); 
     mRealm.copyToRealm(score2); 

Answer 1

Sì, che può essere fatto abbastanza facilmente.

Quello che ti serve è un BarChart con più BarDataSets dove ciascun set (nel tuo caso) rappresenta un sesso (uomini o donne).

• Ecco un esempio di how to create a BarChart with multiple DataSets
• Ecco un tutorial di how to use MPAndroidChart with Realm.io

codice di esempio (senza realm.io)

List<String> xValues = ...; // "Denmark", "Finland", ... 

    XAxis xAxis = chart.getXAxis(); 
    xAxis.setValueFormatter(new MyValueFormatter(xValues)); 

    // create 2 datasets 
    BarDataSet set1 = new BarDataSet(valuesMen, "Men"); 
    set1.setColor(Color.BLUE); 
    BarDataSet set2 = new BarDataSet(valuesWomen, "Women"); 
    set2.setColor(Color.RED); 

    BarData data = new BarData(set1, set2); 
    chart.setData(data); 
    chart.groupBars(...); // available since release v3.0.0 
    chart.invalidate(); // refresh 

Se avete bisogno di ulteriore assistenza, qui è a detailed tutorial sul gruppo BarChart disponibile sul wiki.

Se si desidera "impilare" i valori in un BarChart uno sopra l'altro, è necessario creare un impilati-barchart: Android Stacked Bars Chart

Answer 2

Poiché non v'è stato un aggiornamento sul costruttore BarData è necessario utilizzare codice seguente:

 BarChart barChart = (BarChart) view.findViewById(R.id.chart); 

     barChart.setDrawBarShadow(false); 
     barChart.setDrawValueAboveBar(true); 
     barChart.setDescription(""); 
     barChart.setMaxVisibleValueCount(50); 
     barChart.setPinchZoom(false); 
     barChart.setDrawGridBackground(false); 

     XAxis xl = barChart.getXAxis(); 
     xl.setGranularity(1f); 
     xl.setCenterAxisLabels(true); 
     xl.setValueFormatter(new AxisValueFormatter() { 
      @Override 
      public String getFormattedValue(float value, AxisBase axis) { 
       return String.valueOf((int) value); 
      } 

      @Override 
      public int getDecimalDigits() { 
       return 0; 
      } 
     }); 

     YAxis leftAxis = barChart.getAxisLeft(); 
     leftAxis.setValueFormatter(new AxisValueFormatter() { 
      @Override 
      public String getFormattedValue(float value, AxisBase axis) { 
       return String.valueOf((int) value); 
      } 

      @Override 
      public int getDecimalDigits() { 
       return 0; 
      } 
     }); 
     leftAxis.setDrawGridLines(false); 
     leftAxis.setSpaceTop(30f); 
     leftAxis.setAxisMinValue(0f); // this replaces setStartAtZero(true 
     barChart.getAxisRight().setEnabled(false); 

     //data 
     float groupSpace = 0.04f; 
     float barSpace = 0.02f; // x2 dataset 
     float barWidth = 0.46f; // x2 dataset 
     // (0.46 + 0.02) * 2 + 0.04 = 1.00 -> interval per "group" 

     int startYear = 1980; 
     int endYear = 1985; 


     List<BarEntry> yVals1 = new ArrayList<BarEntry>(); 
     List<BarEntry> yVals2 = new ArrayList<BarEntry>(); 


     for (int i = startYear; i < endYear; i++) { 
      yVals1.add(new BarEntry(i, 0.4f)); 
     } 

     for (int i = startYear; i < endYear; i++) { 
      yVals2.add(new BarEntry(i, 0.7f)); 
     } 


     BarDataSet set1, set2; 

     if (barChart.getData() != null && barChart.getData().getDataSetCount() > 0) { 
      set1 = (BarDataSet)barChart.getData().getDataSetByIndex(0); 
      set2 = (BarDataSet)barChart.getData().getDataSetByIndex(1); 
      set1.setValues(yVals1); 
      set2.setValues(yVals2); 
      barChart.getData().notifyDataChanged(); 
      barChart.notifyDataSetChanged(); 
     } else { 
      // create 2 datasets with different types 
      set1 = new BarDataSet(yVals1, "Company A"); 
      set1.setColor(Color.rgb(104, 241, 175)); 
      set2 = new BarDataSet(yVals2, "Company B"); 
      set2.setColor(Color.rgb(164, 228, 251)); 

      ArrayList<IBarDataSet> dataSets = new ArrayList<IBarDataSet>(); 
      dataSets.add(set1); 
      dataSets.add(set2); 

      BarData data = new BarData(dataSets); 
      barChart.setData(data); 
     } 

     barChart.getBarData().setBarWidth(barWidth); 
     barChart.getXAxis().setAxisMinValue(startYear); 
     barChart.groupBars(startYear, groupSpace, barSpace); 
     barChart.invalidate(); 

Ecco come sarà simile

Answer 3

• Step1 Dividi il primo numero di gruppi nel grafico a barre. Come sotto il codice di esempio visualizzato per 5 gruppi. Ogni gruppo ha 5 barre in questo.

    xaxis0 = new ArrayList<>(); 
        for (int i = 0; i < cData.size(); i++) { 
  
         String str = cData.get(i).get("count"); 
         str = str.replaceAll("\\[", "").replaceAll("\\]", ""); 
         String[] finalString = str.split(","); 
         if (i == 0) { 
          for (int k = 0; k < finalString.length; k++) { 
  
           int data22 = Integer.parseInt(finalString[k]); 
           BarEntry v1e1 = new BarEntry(data22, position); 
           valueSet1.add(v1e1); 
          } 
         } 
         if (i == 1) { 
          for (int k = 0; k < finalString.length; k++) { 
           int data22 = Integer.parseInt(finalString[k] + ""); 
           BarEntry v1e1 = new BarEntry(data22, position); 
           valueSet2.add(v1e1); 
          } 
         } 
         if (i == 2) { 
          for (int k = 0; k < finalString.length; k++) { 
           int data22 = Integer.parseInt(finalString[k] + ""); 
           BarEntry v1e1 = new BarEntry(data22, position); 
           valueSet3.add(v1e1); 
          } 
         } 
         if (i == 3) { 
          for (int k = 0; k < finalString.length; k++) { 
           int data22 = Integer.parseInt(finalString[k] + ""); 
           BarEntry v1e1 = new BarEntry(data22, position); 
           valueSet4.add(v1e1); 
          } 
         } 
         if (i == 4) { 
          for (int k = 0; k < finalString.length; k++) { 
           int data22 = Integer.parseInt(finalString[k] + ""); 
           BarEntry v1e1 = new BarEntry(data22, position); 
           valueSet5.add(v1e1); 
          } 
         } 
         xaxis0.add(i, xdata.get(i).get("date")); 
  

• Step2 Nel codice di cui sopra si osserva che 5 gruppi di dati ingresso barra di caricamento in anello di ogni valueset - ArrayList valueSet2 = new ArrayList <>(); inizializzazione davanti a questo valuesets e

• Fase 3 e di carico che 5 set a Bardataset come qui di seguito

  `BarDataSet barDataSet1 = new BarDataSet (valueSet1, "Set1"); barDataSet1.setColors (whitecolors); barDataSet1.setValueTextColor (Color.WHITE);

  BarDataSet barDataSet2 = nuovo BarDataSet (valueSet2, "Set2"); barDataSet2.setColors (whitecolors); barDataSet2.setValueTextColor (Color.WHITE);

  BarDataSet barDataSet3 = nuovo BarDataSet (valueSet3, "Set3"); barDataSet3.setColors (whitecolors);

  barDataSet3.setValueTextColor (Color.WHITE); BarDataSet barDataSet4 = new BarDataSet (valueSet4, "Set4");

  barDataSet4.setColors (whitecolors); barDataSet4.setValueTextColor (Color.WHITE);

  BarDataSet barDataSet5 = nuovo BarDataSet (valueSet5, "Set5"); barDataSet5.setColors (whitecolors);

  barDataSet5.setValueTextColor (Color.WHITE); dataSets = new ArrayList <>(); dataSets.add (barDataSet1); dataSets.add (barDataSet2); dataSets.add (barDataSet3); dataSets.add (barDataSet4); dataSets.add (barDataSet5); `

• Ultimo passo necessario allegata questi dati per Bardata come sottostante Codice

BarData data11 = new BarData (xaxis0, set di dati); data11.setGroupSpace (100f);

   holder.chart.setData(data11); 

       XAxis xAxis = holder.chart.getXAxis(); 

       xAxis.setPosition(XAxis.XAxisPosition.BOTTOM); 

       xAxis.setDrawGridLines(true); 

xAxis.setGridColor (context.getResources() getColor (R.color.white).);

   xAxis.isDrawLabelsEnabled();  

xAxis.setAxisLineColor (context.getResources() getColor (R.color.accentColor).); xAxis.setTextColor (context.getResources(). GetColor (R.color.white));

   xAxis.isAdjustXLabelsEnabled(); 

       xAxis.setAdjustXLabels(true); 

       holder.chart.setDescription(""); 

       holder.chart.animateXY(2000, 2000); 
holder.chart.getAxisLeft().setTextColor(context.getResources().getColor(R.color.white)); 
       holder.chart.getAxisRight().setTextColor(context.getResources().getColor(R.color.white)); 
       holder.chart.setDrawGridBackground(false); 
       holder.chart.getAxisRight().setEnabled(false); 
       holder.chart.setDrawValueAboveBar(true); 
       holder.chart.getAxisLeft().setEnabled(false); 
       holder.chart.setSoundEffectsEnabled(true); 
       holder.chart.getXAxis().setDrawGridLines(false); 
       holder.chart.setTransitionGroup(true); 
       YAxis yAxis = holder.chart.getAxisLeft(); 
       yAxis.setDrawGridLines(false); 
       yAxis.setLabelCount(5); 
       yAxis = holder.chart.getAxisRight(); 
       yAxis.setDrawGridLines(false); 
       yAxis.setTextColor(context.getResources().getColor(R.color.white)); 
       Legend l = holder.chart.getLegend(); 
       l.setEnabled(false);  
       Paint p = holder.chart.getPaint(Chart.PAINT_INFO); 
       p.setTextSize(10); 
       p.setColor(context.getResources().getColor(R.color.white)); 
       p.setTypeface(gotham); 
       holder.chart.invalidate(); 
       l.setPosition(Legend.LegendPosition.BELOW_CHART_CENTER); 
       l.setTextSize(200); 
       yAxis.setValueFormatter(new LargeValueFormatter()); 

    # Thats it if you have doubt about this code ask me any time .......