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"