Overlapping bars and X-axis labels not showing correctly, also need to set Y-axis max value dynamically

44 Views Asked by At

I'm using MPAndroidChart in my Android app to display a bar chart fetched from an API. However, I'm facing a couple of issues:

Overlapping bars: The bars in my bar chart are overlapping, and I want to ensure they are properly spaced.

X-axis labels not showing correctly: The X-axis labels, representing months and years, are not showing correctly. Instead of displaying the actual labels, it shows numeric values (0.0, 1.0, 2.0, ...).

Dynamically setting Y-axis max value: I want to set the maximum value on the Y-axis dynamically based on the maximum value I receive from the API.

Here's a simplified version of my existing code:

// ... (existing imports)

public class MainActivity extends AppCompatActivity {
    private BarChart barChart;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        barChart = findViewById(R.id.barChart);

        new FetchDataTask().execute("http://sms1.ilmwasooli.com/dashboard/getcollechistorytest");
    }

    private void updateUI(String data) {
        try {
            // Parse JSON data
            JSONObject jsonResponse = new JSONObject(data);
            String status = jsonResponse.getString("status");

            if (status.equals("success")) {
                JSONArray dataArray = jsonResponse.getJSONArray("Data");

                // Extract values for the bar chart
                ArrayList<BarEntry> entriesReceived = new ArrayList<>();
                ArrayList<BarEntry> entriesBalance = new ArrayList<>();
                ArrayList<String> labels = new ArrayList<>();
                float maxAmount = 0f;

                for (int i = 0; i < dataArray.length(); i++) {
                    JSONObject monthData = dataArray.getJSONObject(i);
                    String monthYear = monthData.getString("mnth") + " " + monthData.getString("year");

                    float receivedValue = (float) monthData.getDouble("rcvd");
                    float balanceValue = (float) monthData.getDouble("bal");

                    maxAmount = Math.max(maxAmount, Math.max(receivedValue, balanceValue));

                    entriesReceived.add(new BarEntry(i, receivedValue));
                    entriesBalance.add(new BarEntry(i, balanceValue));
                    labels.add(monthYear);
                }

                BarDataSet dataSetReceived = new BarDataSet(entriesReceived, "Received Amount");
                dataSetReceived.setColor(getResources().getColor(R.color.primary_color_light));

                BarDataSet dataSetBalance = new BarDataSet(entriesBalance, "Balance Amount");
                dataSetBalance.setColor(getResources().getColor(R.color.primary_color_dark));

                BarData barData = new BarData(dataSetReceived, dataSetBalance);

                barChart.setData(barData);

                XAxis xAxis = barChart.getXAxis();
                xAxis.setValueFormatter(new MyXAxisValueFormatter(labels));
                xAxis.setLabelRotationAngle(45f);

                YAxis yAxis = barChart.getAxisLeft();
                yAxis.setAxisMaximum(maxAmount);

                barChart.invalidate();
            } else {
                Toast.makeText(MainActivity.this, "Failed to fetch data", Toast.LENGTH_SHORT).show();
            }
        } catch (JSONException e) {
            e.printStackTrace();
        }
    }

    // ... (existing classes and methods)
}

I am getting this output : I want something like this two bars and x-axis values as "Nov 2023"

0

There are 0 best solutions below