java - How to retrieve JSON data and plot a LineChart using MPAndroidChart and retrofit on android

Question

I am trying to retrieve data using retrofit and put them using MPAndroidChart. I am able to retrieve data from JSON and I am also able to manually add a defined x, y on a line plot (such as ie. x=1, y=1).

However, I am still learning MPLineChart and (especially with LineChart) and am getting struck on combine the two concepts - retrieving the y1 and y2 data and use those the data to plot against with time for a line graph. Could anyone lighten me a bit on how to retrieve the JSON data and plot?

Here is what I have so far:

MainActivity:

import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;

public class MainActivity extends AppCompatActivity {

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

        private void drawLineChart() {
            LineChart lineChart = findViewById(R.id.chart);
            List<Entry> lineEntries = getDataSet();
            LineDataSet lineDataSet = new LineDataSet(lineEntries, getString(R.string.data1));
            lineDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
            lineDataSet.setHighlightEnabled(true);
            lineDataSet.setLineWidth(2);
            lineDataSet.setColor(Color.RED);
            lineDataSet.setCircleColor(Color.YELLOW);
            lineDataSet.setCircleRadius(6);
            lineDataSet.setCircleHoleRadius(3);
            lineDataSet.setDrawHighlightIndicators(true);
            lineDataSet.setHighLightColor(Color.RED);
            lineDataSet.setValueTextSize(12);
            lineDataSet.setValueTextColor(Color.DKGRAY);

            LineData lineData = new LineData(lineDataSet);
            lineChart.getDescription().setTextSize(12);
            lineChart.setDrawMarkers(true);
            lineChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTH_SIDED);
            lineChart.animateY(1000);
            lineChart.getXAxis().setGranularityEnabled(true);
            lineChart.getXAxis().setGranularity(1.0f);
            lineChart.getXAxis().setLabelCount(lineDataSet.getEntryCount());
            lineChart.setData(lineData);
        }

        private List<Entry> getDataSet() {
            List<Entry> lineEntries = new ArrayList<Entry>();
            //lineEntries.add(new Entry(0, 1));
            //lineEntries.add(new Entry(1, 2));
            //lineEntries.add(new Entry(2, 3));
            //lineEntries.add(new Entry(3, 4));
            return lineEntries;
        }

    private void fetchData() {
        Retrofit retrofit = new Retrofit.Builder()
                .baseUrl(Api.BASE_URL)
                .addConverterFactory(GsonConverterFactory.create())
                .build();

        Api api = retrofit.create(Api.class);
        Call<List<Details>> call = api.getstatus();
        call.enqueue(new Callback<List<Details>>() {
            @Override
            public void onResponse(Call<List<Details>> call, Response<List<Details>> response) {
                List<Details> adslist = response.body();

            }
            @Override
            public void onFailure(Call<List<Details>> call, Throwable t) {
                Toast.makeText(MainActivity.this, ""+t.getMessage().toString(), Toast.LENGTH_SHORT).show();
            }
        });
    }
    
    }

For gson:

public class Details {
    @SerializedName("y1")
    @Expose
    private String y1;
    @SerializedName("y2")
    @Expose
    private String y2;
    @SerializedName("timestamps")
    @Expose
    private String timestamps;

    public String getY1() {
        return y1;
    }

    public void setY1(String y1) {
        y1 = y1;
    }

    public String getY2() {
        return y2;
    }

    public void setY2(String y2) {
        y2 = y2;
    }

    public String getTimestamps() {
        return timestamps;
    }

    public void setTimestamps(String timestamps) {
        timestamps = timestamps;
    }
}

For Api:

public interface Api {
    String BASE_URL = "http://..";
    @GET("Api.php")
    Call<List<Details>> getstatus();
}

And data is:

[{"y1":"40","y2":"80","timestamps":"2020-1-10 18:00:34"},{"y1":"50","y2":"60","timestamps":"2020-1-10 17:40:20"},{"y1":"70","y2":"30","timestamps":"2020-1-10 17:20:34"}]

question from:https://stackoverflow.com/questions/65837414/how-to-retrieve-json-data-and-plot-a-linechart-using-mpandroidchart-and-retrofit

Answer 1

Change your getDataSet method like this

private void getDataSet(List<Details> list) {
        List<Entry> lineEntries = new ArrayList<Entry>();
        if(list!=null){

         for(Details details : list){

           lineEntries.add(new Entry(Float.parseFloar(details.getY1()),Float.parseFloat(details.getY2()));

           }
        }
        

LineDataSet lineDataSet = new LineDataSet(lineEntries, getString(R.string.data1));
            lineDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
            lineDataSet.setHighlightEnabled(true);
            lineDataSet.setLineWidth(2);
            lineDataSet.setColor(Color.RED);
            lineDataSet.setCircleColor(Color.YELLOW);
            lineDataSet.setCircleRadius(6);
            lineDataSet.setCircleHoleRadius(3);
            lineDataSet.setDrawHighlightIndicators(true);
            lineDataSet.setHighLightColor(Color.RED);
            lineDataSet.setValueTextSize(12);
            lineDataSet.setValueTextColor(Color.DKGRAY);

            LineData lineData = new LineData(lineDataSet);
            lineChart.getDescription().setTextSize(12);
            lineChart.setDrawMarkers(true);
            lineChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTH_SIDED);
            lineChart.animateY(1000);
            lineChart.getXAxis().setGranularityEnabled(true);
            lineChart.getXAxis().setGranularity(1.0f);
            lineChart.getXAxis().setLabelCount(lineDataSet.getEntryCount());
            lineChart.setData(lineData);


    }

And then

decalre your line in oncreate method <br>
LineChart lineChart = findViewById(R.id.chart);<br>

And call this getDataSet(List list) method from fetchData onResposne() method