Android: GraphView How do I implement time in the X axis?

Question

I'm finding it a bit difficult to figure out how to implement time in the X Axis of a graph in Android?

This is my code:

for (int i = 0; i < listSize; i++) 
            {
                String[] onlyReading = mData.get(i).getReading().split(" ");
                readingList[i] = Double.parseDouble(onlyReading[0]);
                String date = mData.get(i).getUnFormatedDate();
                String[] temp = date.split(" ");
                String[] dateTemp = null;
                String[] timeTemp = null;

                if(temp.length > 0) 
                {
                    dateTemp = temp[0].trim().split("-");
                    timeTemp = temp[1].trim().split(":");

                    Date dateObj = new Date();
                    String year = "0";
                    if(dateTemp != null)
                    {
                        dateObj.setDate(Integer.parseInt(dateTemp[0]));
                        dateObj.setMonth(Integer.parseInt(dateTemp[1]) - 1);
                        year = dateTemp[2].trim();
                        if(dateTemp[2].trim().length() == 4)
                        {
                            year = dateTemp[2].substring(2, 4);
                        }
                        dateObj.setYear(Integer.parseInt(year)+100);
                    }
                    if(timeTemp != null)
                    { 
                        calendar = new GregorianCalendar(Integer.parseInt(year) + 2000, Integer.parseInt(dateTemp[1]) - 1, Integer.parseInt(dateTemp[0]), Integer.parseInt(timeTemp[0]), Integer.parseInt(timeTemp[1]));
                    }

                    dateObj = new Date(calendar.getTimeInMillis());
                    dateList[i] = dateObj;
                }
            }

            if(dateList.length > 0)
            { 
                //dates.clear();
                //values.clear();
                //readingData.clear();
                //readingDate.clear();

                GraphViewData[] data = new GraphViewData[dateList.length];





                LineGraphView graphView = new LineGraphView(
                          getActivity() // context
                          , "" // heading
                    );


                for (int i = 0; i < listSize; i++)
                {
                    data[i] = new GraphViewData(Double.valueOf(i), readingList[i]);
                } 

                GraphViewSeries exampleSeries = new GraphViewSeries(data);
                graphView.addSeries(exampleSeries);
                graphView.setDrawBackground(false);
                ((LineGraphView) graphView).setDrawDataPoints(true);
                graphView.getGraphViewStyle().setGridColor(0);
                graphView.getGraphViewStyle().setHorizontalLabelsColor(Color.WHITE);
                graphView.getGraphViewStyle().setVerticalLabelsColor(Color.WHITE);
                graphView.getGraphViewStyle().setNumHorizontalLabels(5);
                graphView.getGraphViewStyle().setNumVerticalLabels(5);
                graphView.setManualYAxisBounds(400, 0);
                mGraphParent.addView(graphView);
            }  
        }

Even though I add the Y axis values, I'm not able to figure out how to add time values to the X-axis?

Answer 1

the trick is to just convert the time to seconds or milliseconds (unix time) and you it as X-value.

There's an example on the GraphView-Demos project. Take a look at:

https://github.com/jjoe64/GraphView-Demos/blob/master/src/com/jjoe64/graphviewdemos/CustomLabelFormatterActivity.java#L68

Answer 2

I had the same issue. The easiest method was to convert Time into milliseconds. Using a Gregorian Calendar might be more helpful as the methods in Date are deprecated.

Calendar cal=new GregorianCalendar(2014,6,12,9,30,0);
data[i]=new GraphViewData(cal.getTimeInMillis,VALUE);

Then set the CustomLabelFormatter.

graphView.setCustomLabelFormatter(new CustomLabelFormatter() {
        @Override
        public String formatLabel(double value, boolean isValueX) {
            // TODO Auto-generated method stub
            if (isValueX) {
                Date d = new Date((long) (value));
                return (dateFormat.format(d));
            }
            return "" + (int) value;
        }
    });

Time/Date appears in the format specified in dateFormat.

Answer 3

I know it is an old question, but I solved by using DefaultLabelFormatter().

graphView.getGridLabelRenderer().setLabelFormatter(new DefaultLabelFormatter() {
    @Override
    public String formatLabel(double value, boolean isValueX) {
        if (isValueX) {
            Format formatter = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
            return formatter.format(value);
        }
        return super.formatLabel(value, isValueX);
    }
});

Based on the following video: https://www.youtube.com/watch?v=xt8gx7Z7yJU