3
votes

I need to create a chart that has time along the x-axis and an area along the y-axis. The program is going to record data over a certain time differential for an activity and display the data in a graph, kind of like this -> https://i.stack.imgur.com/s4MiC.png but where every other bar would be alternating colors to correspond to a separate activity. I haven't been able to find a way to do this using MPAndroidChart yet, each entry seems to have a fixed width. If someone either knows how this can be achieved using MPAndroidChart or another open source library help would be appreciated, thanks!

EDIT:

This is the code I've been trying to work with:

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_data_report);  

    BarChart barChart = (BarChart) findViewById(R.id.barChart);
    List<BarEntry> entries = generateBarEntries();
    BarDataSet set = new BarDataSet(entries, "BarDataSet");
    BarData data = new BarData(set);
    barChart.setData(data);
}

private List<BarEntry> generateBarEntries() {
    List<BarEntry> entries = new ArrayList<>();
    for (int i = 0; i < timeValues.size(); i++) {
        float x = timeValues.get(i);
        float y = areaValues.get(i);
        entries.add(new BarEntry(x, y));
    }
    return entries;
}

timeValues is an ArrayList with values in seconds such as [3, 9, 21, 26, 33] and areaValues is also an ArrayList with the same size as timeValues with each value being 30 for now (i.e. [30, 30, 30, 30, 30]).

2
Please post code of what you have tried so far. - slasky
@petryuno1 see edited post - Tommy Jackson

2 Answers

4
votes

Okay so I figured out how to go about this. Instead of creating a bar chart, I just created a line chart with horizontal lines and filled the area underneath each line.

LineChart timeChart = (LineChart) findViewById(R.id.timeChart);
List<ILineDataSet> dataSets = generateLineData();
LineData data = new LineData(dataSets);
timeChart.setData(data);
timeChart.invalidate();

private List<ILineDataSet> generateLineData() {
    List<ILineDataSet> dataSets = new ArrayList<>();
    for (int i = 0; i < areaValues.size(); i++) {
        List<Entry> barPoints = new ArrayList<>();
        Entry barPoint1;
        Entry barPoint2;
        LineDataSet dataSet;
        if (areaValues.get(i) >= 0) {
            barPoint1 = new Entry(timeValues.get(i), areaValues.get(i));
            barPoint2 = new Entry(timeValues.get(i+1), areaValues.get(i));
            barPoints.add(barPoint1);
            barPoints.add(barPoint2);
            dataSet = new LineDataSet(barPoints, "");
            dataSet.setColor(getResources().getColor(R.color.green));
            dataSet.setFillDrawable(ContextCompat.getDrawable(this, R.color.green));
        }
        dataSet.setDrawCircles(false);
        dataSet.setDrawFilled(true);
        dataSet.setDrawValues(false);
        dataSets.add(dataSet);
    }
    return dataSets;
}

Works fantastically.

0
votes

Sample, what i did

There is no easy way to achieve this. You have to dig in barchart source code in MPAndroidChart and find class called BarBuffer. There is a method called addBar(). There you can change bar widths. In my example, i have still 24 separate bars, but if you change widths, you can make it look like big blocks.

protected void addBar(float left, float top, float right, float bottom) {

    buffer[index++] = left;
    buffer[index++] = top;
    buffer[index++] = right;
    buffer[index++] = bottom;
}