使用 MPAndroidChart 在条形图中的时间轴轴上绘制数据值答案

【问题标题】：Plot data value on Timeline axis in Bar chart using MPAndroidChart使用 MPAndroidChart 在条形图中的时间轴轴上绘制数据值
【发布时间】：2022-02-02 08:25:19
【问题描述】：

我想在一个类似于 iOS 的“健康”应用的 Android 应用中绘制条形图。

这里是截图。

我尝试使用MPAndroidChart 进行绘图。我已经看过该库中给出的示例，但无法按照我的要求进行绘图。

我能够显示 1 年图表（第二张截图）的条形图，因为它有 12 个数据点和 12 个 x 轴标签。但是对于一日图，需要在 x 轴的 2 个标签之间显示条形图。

我也不明白我如何在 x 轴上映射 24 小时或任何其他时间长度及其值。

有什么方法可以根据选定的选项卡将 X 轴设为时间或日期轴吗？ X 轴标签将根据当前日期和时间动态变化。所以我不能设置一个固定的字符串数组，还需要映射值和 x 轴时序。谁能帮忙绘制数据和时间轴？

【问题讨论】：

您能否分享一下您目前拥有的代码，或者您的图表的截图？

标签： android mpandroidchart

【解决方案1】：

您可以像渲染月份一样绘制白天时间，但您将使用 24 个值而不是 12 个值（每次一个值）。唯一的区别是时间图只有 4 个 X-labels 而不是几个月的 12 个，并且它呈现时间：12AM、6AM、12PM、6PM 并且所有其他时间标签都有空值。下面我将通过代码示例描述如何绘制和映射每个 Y 值及其对应的 X-Label：

1.将BarChart添加到Activity xml布局中：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.github.mikephil.charting.charts.BarChart
        android:id="@+id/barChart"
        android:layout_width="match_parent"
        android:layout_height="300dp" />

</RelativeLayout>

2.获取条形图的引用

mBarChart = findViewById(R.id.barChart);

3.使用以下函数绘制月份图表：

private void showMonthsBars(){

    //input Y data (Months Data - 12 Values)
    ArrayList<Double> valuesList = new ArrayList<Double>();
    valuesList.add((double)1800);
    valuesList.add((double)1600);
    valuesList.add((double)500);
    valuesList.add((double)1500);
    valuesList.add((double)900);
    valuesList.add((double)1700);
    valuesList.add((double)400);
    valuesList.add((double)2000);
    valuesList.add((double)2500);
    valuesList.add((double)3500);
    valuesList.add((double)3000);
    valuesList.add((double)1800);

    //prepare Bar Entries
    ArrayList<BarEntry> entries = new ArrayList<>();
    for (int i = 0; i < valuesList.size(); i++) {
        BarEntry barEntry = new BarEntry(i+1, valuesList.get(i).floatValue()); //start always from x=1 for the first bar
        entries.add(barEntry);
    }

    //initialize x Axis Labels (labels for 13 vertical grid lines)
    final ArrayList<String> xAxisLabel = new ArrayList<>();
    xAxisLabel.add("J"); //this label will be mapped to the 1st index of the valuesList
    xAxisLabel.add("F");
    xAxisLabel.add("M");
    xAxisLabel.add("A");
    xAxisLabel.add("M");
    xAxisLabel.add("J");
    xAxisLabel.add("J");
    xAxisLabel.add("A");
    xAxisLabel.add("S");
    xAxisLabel.add("O");
    xAxisLabel.add("N");
    xAxisLabel.add("D");
    xAxisLabel.add(""); //empty label for the last vertical grid line on Y-Right Axis

    //initialize xAxis
    XAxis xAxis = mBarChart.getXAxis();
    xAxis.enableGridDashedLine(10f, 10f, 0f);
    xAxis.setTextColor(Color.BLACK);
    xAxis.setTextSize(14);
    xAxis.setDrawAxisLine(true);
    xAxis.setAxisLineColor(Color.BLACK);
    xAxis.setDrawGridLines(true);
    xAxis.setGranularity(1f);
    xAxis.setGranularityEnabled(true);
    xAxis.setAxisMinimum(0 + 0.5f); //to center the bars inside the vertical grid lines we need + 0.5 step
    xAxis.setAxisMaximum(entries.size() + 0.5f); //to center the bars inside the vertical grid lines we need + 0.5 step
    xAxis.setLabelCount(xAxisLabel.size(), true); //draw x labels for 13 vertical grid lines
    xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
    xAxis.setXOffset(0f); //labels x offset in dps
    xAxis.setYOffset(0f); //labels y offset in dps
    xAxis.setCenterAxisLabels(true);
    xAxis.setValueFormatter(new ValueFormatter() {
        @Override
        public String getFormattedValue(float value) {
            return xAxisLabel.get((int) value);
        }
    });

    //initialize Y-Right-Axis
    YAxis rightAxis = mBarChart.getAxisRight();
    rightAxis.setTextColor(Color.BLACK);
    rightAxis.setTextSize(14);
    rightAxis.setDrawAxisLine(true);
    rightAxis.setAxisLineColor(Color.BLACK);
    rightAxis.setDrawGridLines(true);
    rightAxis.setGranularity(1f);
    rightAxis.setGranularityEnabled(true);
    rightAxis.setAxisMinimum(0);
    rightAxis.setAxisMaximum(6000f);
    rightAxis.setLabelCount(4, true); //draw y labels (Y-Values) for 4 horizontal grid lines starting from 0 to 6000f (step=2000)
    rightAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);

    //initialize Y-Left-Axis
    YAxis leftAxis = mBarChart.getAxisLeft();
    leftAxis.setAxisMinimum(0);
    leftAxis.setDrawAxisLine(true);
    leftAxis.setLabelCount(0, true);
    leftAxis.setValueFormatter(new ValueFormatter() {
        @Override
        public String getFormattedValue(float value) {
            return "";
        }
    });

    //set the BarDataSet
    BarDataSet barDataSet = new BarDataSet(entries, "Months");
    barDataSet.setColor(Color.RED);
    barDataSet.setFormSize(15f);
    barDataSet.setDrawValues(false);
    barDataSet.setValueTextSize(12f);

    //set the BarData to chart
    BarData data = new BarData(barDataSet);
    mBarChart.setData(data);
    mBarChart.setScaleEnabled(false);
    mBarChart.getLegend().setEnabled(false);
    mBarChart.setDrawBarShadow(false);
    mBarChart.getDescription().setEnabled(false);
    mBarChart.setPinchZoom(false);
    mBarChart.setDrawGridBackground(true);
    mBarChart.invalidate();
}

或绘制一天中的 24 小时，如下所示：

private void showDayHoursBars(){

    //input Y data (Day Hours - 24 Values)
    ArrayList<Double> valuesList = new ArrayList<Double>();
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)100);
    valuesList.add((double)270);
    valuesList.add((double)430);
    valuesList.add((double)110);
    valuesList.add((double)30);
    valuesList.add((double)200);
    valuesList.add((double)180);
    valuesList.add((double)0);
    valuesList.add((double)140);
    valuesList.add((double)160);
    valuesList.add((double)0);
    valuesList.add((double)100);
    valuesList.add((double)0);
    valuesList.add((double)750);
    valuesList.add((double)1200);
    valuesList.add((double)10);
    valuesList.add((double)0);

    //initialize x Axis Labels (labels for 25 vertical grid lines)
    final ArrayList<String> xAxisLabel = new ArrayList<>();
    for(int i = 0; i < 24; i++){
        switch (i){
            case 0:
                xAxisLabel.add("12 AM"); //12AM - 5AM
                break;
            case 6:
                xAxisLabel.add("6"); //6AM - 11AM
                break;
            case 12:
                xAxisLabel.add("12 PM"); //12PM - 5PM
                break;
            case 18:
                xAxisLabel.add("6"); //6PM - 11PM
                break;
            default:
                xAxisLabel.add(String.format(Locale.US, "%02d", i)+":00");
                break;
        }
    }
    xAxisLabel.add(""); //empty label for the last vertical grid line on Y-Right Axis

    //prepare Bar Entries
    ArrayList<BarEntry> entries = new ArrayList<>();
    for (int i = 0; i < valuesList.size(); i++) {
        BarEntry barEntry = new BarEntry(i+1, valuesList.get(i).floatValue()); //start always from x=1 for the first bar
        entries.add(barEntry);
    }

    //initialize xAxis
    XAxis xAxis = mBarChart.getXAxis();
    xAxis.enableGridDashedLine(10f, 10f, 0f);
    xAxis.setTextColor(Color.BLACK);
    xAxis.setTextSize(14);
    xAxis.setDrawAxisLine(true);
    xAxis.setAxisLineColor(Color.BLACK);
    xAxis.setDrawGridLines(true);
    xAxis.setGranularity(1f);
    xAxis.setGranularityEnabled(true);
    xAxis.setAxisMinimum(0 + 0.5f); //to center the bars inside the vertical grid lines we need + 0.5 step
    xAxis.setAxisMaximum(entries.size() + 0.5f); //to center the bars inside the vertical grid lines we need + 0.5 step
    xAxis.setLabelCount(5, true); //show only 5 labels (5 vertical grid lines)
    xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
    xAxis.setXOffset(0f); //labels x offset in dps
    xAxis.setYOffset(0f); //labels y offset in dps
    //xAxis.setCenterAxisLabels(true); //don't center the x labels as we are using a custom XAxisRenderer to set the label x, y position
    xAxis.setValueFormatter(new ValueFormatter() {
        @Override
        public String getFormattedValue(float value) {
            return xAxisLabel.get((int) value);
        }
    });

    //initialize Y-Right-Axis
    YAxis rightAxis = mBarChart.getAxisRight();
    rightAxis.setTextColor(Color.BLACK);
    rightAxis.setTextSize(14);
    rightAxis.setDrawAxisLine(true);
    rightAxis.setAxisLineColor(Color.BLACK);
    rightAxis.setDrawGridLines(true);
    rightAxis.setGranularity(1f);
    rightAxis.setGranularityEnabled(true);
    rightAxis.setAxisMinimum(0);
    rightAxis.setAxisMaximum(1500f);
    rightAxis.setLabelCount(4, true); //labels (Y-Values) for 4 horizontal grid lines
    rightAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);

    //initialize Y-Left-Axis
    YAxis leftAxis = mBarChart.getAxisLeft();
    leftAxis.setAxisMinimum(0);
    leftAxis.setDrawAxisLine(true);
    leftAxis.setLabelCount(0, true);
    leftAxis.setValueFormatter(new ValueFormatter() {
        @Override
        public String getFormattedValue(float value) {
            return "";
        }
    });

    //set the BarDataSet
    BarDataSet barDataSet = new BarDataSet(entries, "Hours");
    barDataSet.setColor(Color.RED);
    barDataSet.setFormSize(15f);
    barDataSet.setDrawValues(false);
    barDataSet.setValueTextSize(12f);

    //set the BarData to chart
    BarData data = new BarData(barDataSet);
    mBarChart.setData(data);
    mBarChart.setScaleEnabled(false);
    mBarChart.getLegend().setEnabled(false);
    mBarChart.setDrawBarShadow(false);
    mBarChart.getDescription().setEnabled(false);
    mBarChart.setPinchZoom(false);
    mBarChart.setDrawGridBackground(true);
    mBarChart.setXAxisRenderer(new XAxisRenderer(mBarChart.getViewPortHandler(), mBarChart.getXAxis(), mBarChart.getTransformer(YAxis.AxisDependency.LEFT)){
        @Override
        protected void drawLabel(Canvas c, String formattedLabel, float x, float y, MPPointF anchor, float angleDegrees) {
            //for 6AM and 6PM set the correct label x position based on your needs
            if(!TextUtils.isEmpty(formattedLabel) && formattedLabel.equals("6"))
                Utils.drawXAxisValue(c, formattedLabel, x+Utils.convertDpToPixel(5f), y+Utils.convertDpToPixel(1f), mAxisLabelPaint, anchor, angleDegrees);
            //for 12AM and 12PM set the correct label x position based on your needs
            else
                Utils.drawXAxisValue(c, formattedLabel, x+Utils.convertDpToPixel(20f), y+Utils.convertDpToPixel(1f), mAxisLabelPaint, anchor, angleDegrees);
        }
    });
    mBarChart.invalidate();
}

从上面的示例中，我使用了一些虚拟数据来显示 Y 值和 X 值之间的映射。 Month-Chart 和 Day-Chart 之间的一个主要区别是，在 Month-Chart 中，我使用 xAxis.setCenterAxisLabels(true); 将每个 Bar 内的 x 标签居中，而在 Day-Chart 中，我使用自定义 XAxisRenderer 将每个标签与根据您的屏幕截图正确的 x,y 位置。

以下是上述代码的结果：

月份条形图：

DayHours-BarChart：

注意：这是使用 com.github.PhilJay:MPAndroidChart:v3.1.0 测试的。

使用 Y 值映射 X 轴时间戳的示例：

如果您已经拥有 X 轴的时间戳，您可以将它们转换为适当的字符串标签值，该值将映射到 Y 数据值的相应索引。

下面是一个示例，说明如何从时间戳开始绘制 Times-Graph，例如：27-02-2022 16:00。在这里，我使用cal.setTimeInMillis() 将时间戳转换为日历对象，然后我使用此日历使用cal.add(Calendar.HOUR_OF_DAY, 1); 获取循环中的新小时，cal.add(Calendar.HOUR_OF_DAY, 1); 用作X 轴中的时间标签，如String dayHour = DateFormat.format("hh a", cal).toString().toUpperCase();以您希望在 X 轴上显示的格式。每个 Y 数据值对应于 X 轴的相应索引。下面的示例从下午 4 点开始到下午 3 点处理一天中的 24 小时：

//input Y data (Day Hours - 24 Values)
ArrayList<Double> valuesList = new ArrayList<Double>();
valuesList.add((double)0);
valuesList.add((double)0);
valuesList.add((double)0);
valuesList.add((double)0);
valuesList.add((double)0);
valuesList.add((double)0);
valuesList.add((double)0);
valuesList.add((double)100);
valuesList.add((double)270);
valuesList.add((double)430);
valuesList.add((double)110);
valuesList.add((double)30);
valuesList.add((double)200);
valuesList.add((double)180);
valuesList.add((double)0);
valuesList.add((double)140);
valuesList.add((double)160);
valuesList.add((double)0);
valuesList.add((double)100);
valuesList.add((double)0);
valuesList.add((double)750);
valuesList.add((double)1200);
valuesList.add((double)10);
valuesList.add((double)0);

//in case you already have the timestamp for a day then do the following:
//convert the timestamp to calendar by using the cal.setTimeInMillis() and then use the Calendar to iterate the 24H using the cal.add(Calendar.HOUR_OF_DAY, 1);
//like the below example:

//get a dummy TimeStamp for 27-02-2022 16:00
Date date = new Date();
long dateTimeStamp = 0;
try {
    String strDate = "27-02-2022 16:00";
    date = new SimpleDateFormat("dd-MM-yyyy HH:mm", Locale.US).parse(strDate);
    if(date!=null) {
        dateTimeStamp = date.getTime();
    }
}catch (Exception e){}

//convert the above timestamp to Calendar using the cal.setTimeInMillis()
Calendar cal = Calendar.getInstance();
cal.setTimeInMillis(dateTimeStamp);
//this is the day from the above Calendar
String day = DateFormat.format("dd-MM-yyyy HH:mm", cal).toString(); //this is: 27-02-2022 16:00

//initialize x Axis Labels (labels for 25 vertical grid lines)
final ArrayList<String> xAxisLabel = new ArrayList<>();
//iterate all 24 hours to add the label for each time
for(int i = 0; i < 24; i++){
    //get current hour in format "hh a" which is eg: 12 AM, 01 AM, etc..
    String dayHour = DateFormat.format("hh a", cal).toString().toUpperCase();
    //get the hour 0-11 AM or 0-11 PM
    int hour = cal.get(Calendar.HOUR);
    //check if the above hour is AM or PM (0=AM, 1=PM)
    int amPm = cal.get(Calendar.AM_PM);
    //this is the current TimeStamp for the current working hour in the loop:
    long timeStamp = cal.getTimeInMillis();
    //add the dayHour String as the label you want to display in xAxis
    xAxisLabel.add(dayHour); //this will be mapped to the corresponding index of the valuesList (Y-Data List)
    //increment the Calendar.HOUR_OF_DAY plus +1 to go to the next hour in 24H format
    cal.add(Calendar.HOUR_OF_DAY, 1);
}
xAxisLabel.add(""); //empty label for the last vertical grid line on Y-Right Axis

这里是完整的代码：

private void showDayHoursBars() {

    //input Y data (Day Hours - 24 Values)
    ArrayList<Double> valuesList = new ArrayList<Double>();
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)0);
    valuesList.add((double)100);
    valuesList.add((double)270);
    valuesList.add((double)430);
    valuesList.add((double)110);
    valuesList.add((double)30);
    valuesList.add((double)200);
    valuesList.add((double)180);
    valuesList.add((double)0);
    valuesList.add((double)140);
    valuesList.add((double)160);
    valuesList.add((double)0);
    valuesList.add((double)100);
    valuesList.add((double)0);
    valuesList.add((double)750);
    valuesList.add((double)1200);
    valuesList.add((double)10);
    valuesList.add((double)0);

    //in case you already have the timestamp for a day then do the following:
    //convert the timestamp to calendar by using the cal.setTimeInMillis() and then use the Calendar to iterate the 24H using the cal.add(Calendar.HOUR_OF_DAY, 1);
    //like the below example:

    //get a dummy TimeStamp for 27-02-2022 16:00
    Date date = new Date();
    long dateTimeStamp = 0;
    try {
        String strDate = "27-02-2022 16:00";
        date = new SimpleDateFormat("dd-MM-yyyy HH:mm", Locale.US).parse(strDate);
        if(date!=null) {
            dateTimeStamp = date.getTime();
        }
    }catch (Exception e){}

    //convert the above timestamp to Calendar using the cal.setTimeInMillis()
    Calendar cal = Calendar.getInstance();
    cal.setTimeInMillis(dateTimeStamp);
    //this is the day from the above Calendar
    String day = DateFormat.format("dd-MM-yyyy HH:mm", cal).toString(); //this is: 27-02-2022 16:00

    //initialize x Axis Labels (labels for 25 vertical grid lines)
    final ArrayList<String> xAxisLabel = new ArrayList<>();
    //iterate all 24 hours to add the label for each time
    for(int i = 0; i < 24; i++){
        //get current hour in format "hh a" which is eg: 12 AM, 01 AM, etc..
        String dayHour = DateFormat.format("hh a", cal).toString().toUpperCase();
        //get the hour 0-11 AM or 0-11 PM
        int hour = cal.get(Calendar.HOUR);
        //check if the above hour is AM or PM (0=AM, 1=PM)
        int amPm = cal.get(Calendar.AM_PM);
        //this is the current TimeStamp for the current working hour in the loop:
        long timeStamp = cal.getTimeInMillis();
        //add the dayHour String as the label you want to display in xAxis
        xAxisLabel.add(dayHour); //this will be mapped to the corresponding index of the valuesList (Y-Data List)
        //increment the Calendar.HOUR_OF_DAY plus +1 to go to the next hour in 24H format
        cal.add(Calendar.HOUR_OF_DAY, 1);
    }
    xAxisLabel.add(""); //empty label for the last vertical grid line on Y-Right Axis

    //prepare Bar Entries
    ArrayList<BarEntry> entries = new ArrayList<>();
    for (int i = 0; i < valuesList.size(); i++) {
        BarEntry barEntry = new BarEntry(i+1, valuesList.get(i).floatValue()); //start always from x=1 for the first bar
        entries.add(barEntry);
    }

    //initialize xAxis
    XAxis xAxis = mBarChart.getXAxis();
    xAxis.enableGridDashedLine(10f, 10f, 0f);
    xAxis.setTextColor(Color.BLACK);
    xAxis.setTextSize(14);
    xAxis.setDrawAxisLine(true);
    xAxis.setAxisLineColor(Color.BLACK);
    xAxis.setDrawGridLines(true);
    xAxis.setGranularity(1f);
    xAxis.setGranularityEnabled(true);
    xAxis.setAxisMinimum(0 + 0.5f); //to center the bars inside the vertical grid lines we need + 0.5 step
    xAxis.setAxisMaximum(entries.size() + 0.5f); //to center the bars inside the vertical grid lines we need + 0.5 step
    xAxis.setLabelCount(5, true); //show only 5 labels (5 vertical grid lines)
    xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
    xAxis.setXOffset(0f); //labels x offset in dps
    xAxis.setYOffset(0f); //labels y offset in dps
    //xAxis.setCenterAxisLabels(true); //don't center the x labels as we are using a custom XAxisRenderer to set the label x, y position
    xAxis.setValueFormatter(new ValueFormatter() {
        @Override
        public String getFormattedValue(float value) {
            return xAxisLabel.get((int) value);
        }
    });

    //initialize Y-Right-Axis
    YAxis rightAxis = mBarChart.getAxisRight();
    rightAxis.setTextColor(Color.BLACK);
    rightAxis.setTextSize(14);
    rightAxis.setDrawAxisLine(true);
    rightAxis.setAxisLineColor(Color.BLACK);
    rightAxis.setDrawGridLines(true);
    rightAxis.setGranularity(1f);
    rightAxis.setGranularityEnabled(true);
    rightAxis.setAxisMinimum(0);
    rightAxis.setAxisMaximum(1500f);
    rightAxis.setLabelCount(4, true); //labels (Y-Values) for 4 horizontal grid lines
    rightAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);

    //initialize Y-Left-Axis
    YAxis leftAxis = mBarChart.getAxisLeft();
    leftAxis.setAxisMinimum(0);
    leftAxis.setDrawAxisLine(true);
    leftAxis.setLabelCount(0, true);
    leftAxis.setValueFormatter(new ValueFormatter() {
        @Override
        public String getFormattedValue(float value) {
            return "";
        }
    });

    //set the BarDataSet
    BarDataSet barDataSet = new BarDataSet(entries, "Hours");
    barDataSet.setColor(Color.RED);
    barDataSet.setFormSize(15f);
    barDataSet.setDrawValues(false);
    barDataSet.setValueTextSize(12f);

    //set the BarData to chart
    BarData data = new BarData(barDataSet);
    mBarChart.setData(data);
    mBarChart.setScaleEnabled(false);
    mBarChart.getLegend().setEnabled(false);
    mBarChart.setDrawBarShadow(false);
    mBarChart.getDescription().setEnabled(false);
    mBarChart.setPinchZoom(false);
    mBarChart.setDrawGridBackground(true);
    mBarChart.setXAxisRenderer(new XAxisRenderer(mBarChart.getViewPortHandler(), mBarChart.getXAxis(), mBarChart.getTransformer(YAxis.AxisDependency.LEFT)){
        @Override
        protected void drawLabel(Canvas c, String formattedLabel, float x, float y, MPPointF anchor, float angleDegrees) {
            //for 6AM and 6PM set the correct label x position based on your needs
            if(!TextUtils.isEmpty(formattedLabel) && formattedLabel.equals("6"))
                Utils.drawXAxisValue(c, formattedLabel, x+Utils.convertDpToPixel(5f), y+Utils.convertDpToPixel(1f), mAxisLabelPaint, anchor, angleDegrees);
                //for 12AM and 12PM set the correct label x position based on your needs
            else
                Utils.drawXAxisValue(c, formattedLabel, x+Utils.convertDpToPixel(20f), y+Utils.convertDpToPixel(1f), mAxisLabelPaint, anchor, angleDegrees);
        }
    });
    mBarChart.invalidate();
}

这是新的结果（下午 4 点到下午 3 点）：

用 Y 值映射 X 轴时间戳的示例 2：

以下是如何将 X(timestamps) 与 Y(Values) 映射的另一个示例：

//prepare X,Y data
ArrayList<Double> valuesList = new ArrayList<Double>();
ArrayList<Long> xAxisLabel = new ArrayList<>();
for(int i = 0; i < 24; i++){
    valuesList.add((double)100+i); //y-values
    xAxisLabel.add(1645970400000L+i); //x-timestamps
}
xAxisLabel.add(0L); //empty x for the last vertical grid line on Y-Right Axis

//prepare Bar Entries
ArrayList<BarEntry> entries = new ArrayList<>();
for (int i = 0; i < valuesList.size(); i++) {
    BarEntry barEntry = new BarEntry(i+1, valuesList.get(i).floatValue()); //start always from x=1 for the first bar
    entries.add(barEntry);
}

基于上述映射，您可以使用setLabelCount 在 X 轴上呈现您希望的标签数量。例如：使用xAxis.setLabelCount(xAxisLabel.size(), true);可以渲染X轴的所有标签。

回调getFormattedValue(float value) 会在每次准备好在图形上呈现特定 X 索引时调用，因此您必须首先获取索引，然后您可以从列表中获取正确的时间戳，如下例所示：

//initialize xAxis
XAxis xAxis = mBarChart.getXAxis();
xAxis.setLabelCount(xAxisLabel.size(), true); //show all the labels
xAxis.setValueFormatter(new ValueFormatter() {
    @Override
    public String getFormattedValue(float value) {
        int xIndex = (int) value;
        if(xIndex == xAxisLabel.size()-1)
            return "";
        Long timeStamp = xAxisLabel.get(xIndex);
        //here convert the timestamp to the appropriate String value
        return String.valueOf(timeStamp);
    }
});

以下是基于上述样本的所有标签的 X-Timestamps 结果。为了呈现下图中的标签，我还进行了以下更改：

xAxis.setLabelRotationAngle(90); //this rotates the x labels to 90 degrees
mBarChart.setXAxisRenderer(new XAxisRenderer(mBarChart.getViewPortHandler(), mBarChart.getXAxis(), mBarChart.getTransformer(YAxis.AxisDependency.LEFT)){
    @Override
    protected void drawLabel(Canvas c, String formattedLabel, float x, float y, MPPointF anchor, float angleDegrees) {
        Utils.drawXAxisValue(c, formattedLabel, x+Utils.convertDpToPixel(5f), y, mAxisLabelPaint, anchor, angleDegrees);
    }
});

时间戳结果：

水平滚动每 10 秒的 X 时间戳。每个页面有 10 个时间戳。

下面我将展示如何修改上述代码以处理 X-Y 映射以显示每 10 秒的 X-Timestamps 的关键点：

int visibleXValuesPerPage = 10;
    //get a dummy TimeStamp for 27-02-2022 16:00
    Date date = new Date();
    long dateTimeStamp = 0;
    try {
        String strDate = "27-02-2022 16:00";
        date = new SimpleDateFormat("dd-MM-yyyy HH:mm", Locale.US).parse(strDate);
        if(date!=null) {
            dateTimeStamp = date.getTime();
        }
    }catch (Exception e){}

    Calendar cal = Calendar.getInstance();
    cal.setTimeInMillis(dateTimeStamp);
    
    ArrayList<Double> valuesList = new ArrayList<Double>();
    ArrayList<Long> xAxisLabel = new ArrayList<>();

    //1h = 3600 seconds
    //1d = 86400 seconds
    //1w = 604800 seconds
    int seconds = 3600;
    //the loop here is incremented by 10 seconds (i+=10)
    for(int i = 0; i < seconds; i+=10){
        String time = DateFormat.format("dd-MM-yyyy HH:mm:ss", cal).toString();
        long timeStamp = cal.getTimeInMillis();
        valuesList.add((double)i);
        xAxisLabel.add(timeStamp);
        cal.add(Calendar.SECOND, 10);
    }
    
    ArrayList<BarEntry> entries = new ArrayList<>();
    for (int i = 0; i < valuesList.size(); i++) {
        BarEntry barEntry = new BarEntry(i+1, valuesList.get(i).floatValue());
        entries.add(barEntry);
    }
    
    XAxis xAxis = mBarChart.getXAxis();
    xAxis.setAxisMinimum(0 + 0.5f);
    xAxis.setAxisMaximum(entries.size() + 0.5f);
    xAxis.setLabelCount(visibleXValuesPerPage, false);
    xAxis.setLabelRotationAngle(90);
    xAxis.setCenterAxisLabels(true);
    xAxis.setValueFormatter(new ValueFormatter() {
        @Override
        public String getFormattedValue(float value) {
            if (value >= 0)
            {
                int xIndex = (int)value;
                if (value > xAxisLabel.size()-1 && value <= xAxisLabel.size())
                    return "";
                if (xIndex < xAxisLabel.size())
                {
                    Long timeStamp = xAxisLabel.get(xIndex);
                    //here convert the timestamp to the appropriate String value
                    Calendar cal = Calendar.getInstance();
                    cal.setTimeInMillis(timeStamp);
                    String time = DateFormat.format("dd-MM-yyyy HH:mm:ss", cal).toString();
                    return String.valueOf(time);
                }
                return "";
            }
            return "";
        }
    });


    //set the BarData to chart
    mBarChart.setVisibleXRangeMaximum(visibleXValuesPerPage);
    mBarChart.invalidate();

【讨论】：

非常感谢@MarisoP。只是想问您是否尝试过使用此链接中给出的时间戳映射数据和 x 轴 github.com/PhilJay/MPAndroidChart/issues/789
@KhushbuShah 我还添加了如何在 X 轴中使用时间戳的示例，请查看更新的答案。粗略的你可以根据自己的需要进行修改。
嗨@MarisoP。如果我想为每 10 秒的数据显示一个图表。你知道怎么做吗？我试过这个解决方案stackoverflow.com/questions/41426021/… 实际上，我想绘制 1 年的数据，如果用户放大它，他/她可以详细查看数据，如每月、每周、每天、每小时的数据（最大缩放显示具体时间来自时间戳的数据）你能帮我吗？
尝试实现 ValueFormatter 但在“getFormattedValue”中我收到 4、8、12 等而不是时间戳。我正在使用 barEntries.add(new BarEntry(timestamp, temperatureValue)); 添加条目未在“getFormattedValue”中接收时间戳。你能告诉我是什么错误吗？
@KhushbuShah getFormattedValue 返回准备好在 X 轴上渲染的正确 X 索引。我添加了另一个示例，说明如何使用此索引从列表中获取正确的时间戳。检查更新的答案。