MPAndroidChart 教程：设置数据 Setting Data

心已赠人 2021-09-22 14:56 365阅读 0赞

本章主题是介绍为各种图表设置数据

### 线型图 ###

如果要将值（数据）添加到图表中，则必须通过

public void setData(ChartData data) \{ ... \}

基类ChartData（[ChartData][]）类封装了呈现期间图表所需的所有数据和信息。对于每种类型的图表，存在应该用于设置图表数据的不同子类ChartData（例如LineData）。在构造函数中，您可以将一个List<? extends IDataSet>作为要显示的值移交。下面是类LineData（extends ChartData）的示例，用于将数据添加到LineChart：

/** List constructor */
        public LineData(List<ILineDataSet> sets) { ... }
    
        /** Constructor with one or multiple ILineDataSet objects */
        public LineData(ILineDataSet...) { ... }

那么，什么是DataSet，需要它的原因是什么？这实际上非常简单。一个DataSet对象表示Entry图表中属于一起的一组条目（例如，类条目）。它旨在逻辑上分离图表中的不同值组。对于每种类型的图表，存在允许特定样式的扩展DataSet（例如LineDataSet）的不同对象。

例如，您可能希望在一年内显示两年内两家公司的季度收入LineChart。在这种情况下，建议创建两个不同的LineDataSet对象，每个对象包含四个值（每个季度一个）。

当然，也可以只提供一个LineDataSet包含两个公司的所有8个值的对象。

那么如何设置LineDataSet对象呢？

public LineDataSet(List<Entry> entries, String label) \{ ... \}

当查看构造函数（不同的构造函数可用）时，可以看到LineDataSet需要一个类型为Entry的List和一个用于描述LineDataSet的String以及一个用于Legend的标签。此外，该标签可用于在LineData对象中的其他LineDataSet对象中查找LineDataSet。

Entry类型列表封装了图表的所有值。Entry对象是图表中具有x值和y值的条目的附加包装器：

public Entry(float x, float y) \{ ... \}

总而言之（两家公司的季度收入超过一年的例子）：

首先，创建将保存您的值的Entry类型列表：

List<Entry> valsComp1 = new ArrayList<Entry>();
       List<Entry> valsComp2 = new ArrayList<Entry>();

然后，用Entry对象填充列表。确保条目对象包含x轴的正确索引。（当然，这里可以使用循环，在这种情况下，循环的计数器变量可以是x轴上的索引）。

Entry c1e1 = new Entry(0f, 100000f); // 0 == quarter 1
        valsComp1.add(c1e1);
        Entry c1e2 = new Entry(1f, 140000f); // 1 == quarter 2 ...
        valsComp1.add(c1e2);
        // and so on ...
        
        Entry c2e1 = new Entry(0f, 130000f); // 0 == quarter 1
        valsComp2.add(c2e1);
        Entry c2e2 = new Entry(1f, 115000f); // 1 == quarter 2 ...
        valsComp2.add(c2e2);
        //...

现在我们有了Entry对象列表，可以创建LineDataSet对象：

LineDataSet setComp1 = new LineDataSet(valsComp1, "Company 1");
        setComp1.setAxisDependency(AxisDependency.LEFT);
        LineDataSet setComp2 = new LineDataSet(valsComp2, "Company 2");
        setComp2.setAxisDependency(AxisDependency.LEFT);

通过调用setAxisDependency(...)，DataSet指定应绘制的轴。最后但同样重要的是，我们创建了一个IDataSets列表并构建了我们的ChartData对象：

// use the interface ILineDataSet
        List<ILineDataSet> dataSets = new ArrayList<ILineDataSet>();
        dataSets.add(setComp1);
        dataSets.add(setComp2);
        
        LineData data = new LineData(dataSets);
        mLineChart.setData(data);
        mLineChart.invalidate(); // refresh

调用invalidate()图表后刷新并绘制提供的数据。

如果我们想要为x轴添加更多描述性值（而不是不同季度的0到3之间的数字），我们可以通过使用IAxisValueFormatter接口来实现。此接口允许自定义XAxis上绘制的值的样式。在此示例中，formatter可能如下所示：

// the labels that should be drawn on the XAxis
    final String[] quarters = new String[] { "Q1", "Q2", "Q3", "Q4" };
    
    IAxisValueFormatter formatter = new IAxisValueFormatter() {
    
        @Override
        public String getFormattedValue(float value, AxisBase axis) {
            return quarters[(int) value];
        }
    
        // we don't draw numbers, so no decimal digits needed
        @Override
        public int getDecimalDigits() {  return 0; }
    };
    
    XAxis xAxis = mLineChart.getXAxis();
    xAxis.setGranularity(1f); // minimum axis-step (interval) is 1
    xAxis.setValueFormatter(formatter);

有关IAxisValueFormatter界面的详细信息，请参见[此处][Link 1]。

如果应用了其他样式，此示例生成的LineChart应类似于下面的那个：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZW1lbmdydWkxMg_size_16_color_FFFFFF_t_70][]

设置标准BarChart，ScatterChart，BubbleChart和CandleStickChart的数据类似于LineChart。一个特例是BarChart带有多个（分组）条形，下面将对其进行说明。

### 条目的顺序 ###

请注意，此库没有正式支持从未按条目的x位置升序方式排序的LineChart的Entry列表中绘制数据。以未排序的方式添加条目可能会正确绘制，但也可能导致意外行为。List的Entry对象可以使用手动进行排序或使用EntryXComparator：

List<Entry> entries = ...; Collections.sort(entries, new EntryXComparator());

之所以需要这样做是因为该库使用[二进制搜索算法][Link 2]以获得更好的性能，仅用于排序列表。

### BarChart ###

为BarChart设置数据的方式与LineChart非常相似。主要区别是需要用于设置数据的数据对象（例如，BarEntry而不是Entry）。除此之外，BarChart还有不同的类型选择。

请考虑以下填充BarChart数据的示例：

List<BarEntry> entries = new ArrayList<>();
    entries.add(new BarEntry(0f, 30f));
    entries.add(new BarEntry(1f, 80f));
    entries.add(new BarEntry(2f, 60f));
    entries.add(new BarEntry(3f, 50f)); 
                                        // gap of 2f
    entries.add(new BarEntry(5f, 70f));
    entries.add(new BarEntry(6f, 60f));
    
    BarDataSet set = new BarDataSet(entries, "BarDataSet");

在上面的示例中，BarEntry创建了五个对象并将其添加到一个 BarDataSet。请注意，第四个和第五个条目之间的x位置存在“2”的间隙。在这个例子中，这个间距用于解释BarChart中柱的定位是如何工作的。本教程末尾的屏幕截图将显示BarChart给定数据的结果。下一步，BarData需要创建一个对象：

BarData data = new BarData(set);
    data.setBarWidth(0.9f); // set custom bar width
    chart.setData(data);
    chart.setFitBars(true); // make the x-axis fit exactly all bars
    chart.invalidate(); // refresh

在上面的代码片段中，创建了一个BarData对象。创建图表的BarEntry对象时，我们在每个条形（中心）之间的x轴上留下了“1f”的空间。通过将条宽设置为0.9f，我们有效地在每个条之间创建0.1f的空间。该setFitBars(true)调用将告诉图表调整其x轴值的范围以完全适合所有条形，并且两侧不会切断条形。

创建BarData对象后，我们将其设置为图表并刷新。结果应该看起来接近下面显示的结果：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZW1lbmdydWkxMg_size_16_color_FFFFFF_t_70 1][]

### Grouped BarChart ###

从版本[v3.0.0开始][v3.0.0]，MPAndroidChart支持明确分组的绘图条（在这种情况下，库将处理x位置）或用户定义，这意味着用户可以通过更改x轴位置将条型放置在他想要的任何位置。

本节将重点介绍显式分组BarChart，这意味着库将处理条形的x轴位置。请考虑以下示例设置：

YourData[] group1 = ...;
    YourData[] group2 = ...;
    
    List<BarEntry> entriesGroup1 = new ArrayList<>();
    List<BarEntry> entriesGroup2 = new ArrayList<>();
    
    // fill the lists
    for(int i = 0; i < group1.length; i++) {
        entriesGroup1.add(new BarEntry(i, group1.getValue()));
        entriesGroup2.add(new BarEntry(i, group2.getValue()));
    }
    
    BarDataSet set1 = new BarDataSet(entriesGroup1, "Group 1");
    BarDataSet set2 = new BarDataSet(entriesGroup2, "Group 2");

在这个示例中，我们将有两组条形图，每个都由一个单独的BarDataSet表示。在显式（库处理）组的情况下，条目的实际x位置无关紧要。基于条目列表中BarEntry的位置执行分组。

float groupSpace = 0.06f;
    float barSpace = 0.02f; // x2 dataset
    float barWidth = 0.45f; // x2 dataset
    // (0.02 + 0.45) * 2 + 0.06 = 1.00 -> interval per "group"
    
    BarData data = new BarData(set1, set2);
    data.setBarWidth(barWidth); // set the width of each bar
    barChart.setData(data);
    barChart.groupBars(1980f, groupSpace, barSpace); // perform the "explicit" grouping
    barChart.invalidate(); // refresh

在上面的代码片段中，BarDataSet对象被添加到一个BarChart。该groupBars(...)方法执行两个BarDataSet对象的分组。该方法采用以下参数：

public void groupBars(float fromX, float groupSpace, float barSpace) \{ ... \}

fromX参数确定XAxis分组条的起始位置（在本例中为“1980”），groupSpace确定每组条之间留下的空间，barSpace确定组中各个条之间的间距。基于这些参数，该groupBars(...)方法改变每个条形XAxis朝向分组外观的位置，保持各个BarEntry对象的顺序。

每个组在XAxis上具有的“间隔”（占用空间）也由groupSpace和barSpace参数以及barWidth定义。

效果应该看起来像这样：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZW1lbmdydWkxMg_size_16_color_FFFFFF_t_70 2][]

当然，也可以在不使用groupBars（...）方法的情况下实现BarChart的分组，只需手动将各个条正确放置在XAxis上即可。

为了确保XAxis的标签位于组上方，如上面的屏幕截图所示，您可以使用以下setCenterAxisLabels(...)方法：

XAxis xAxis = chart.getXAxis();
    xAxis.setCenterAxisLabels(true);

### Stacked BarChart ###

堆叠的BarChart设置与普通的BarChart完全相似，但创建单个BarEntry对象的方式除外。如果是堆叠条形，则必须使用BarEntry的不同构造函数：

public BarEntry(float x, float \[\] yValues) \{ ... \}

此构造函数允许提供多个yValues，表示每个条的“堆栈”的值。请考虑以下示例对象：

BarEntry stackedEntry = new BarEntry(0f, new float\[\] \{ 10, 20, 30 \});

BarEntry由三个值组成，具有“高度”为“10”，“20”和“30”。

### PieChart ###

与其他图表类型不同，PieChart以PieEntry对象的形式获取数据。这些对象的构造函数如下所示：

public PieEntry(float value, String label) \{ ... \}

构造函数的第一个参数用于实际的“值”，该值应该作为PieChart中的饼图绘制。名为“label”的第二个String参数用于提供切片的其他描述。请考虑以下PieChart示例设置：

List<PieEntry> entries = new ArrayList<>();
    
    entries.add(new PieEntry(18.5f, "Green"));
    entries.add(new PieEntry(26.7f, "Yellow"));
    entries.add(new PieEntry(24.0f, "Red"));
    entries.add(new PieEntry(30.8f, "Blue"));
    
    PieDataSet set = new PieDataSet(entries, "Election Results");
    PieData data = new PieData(set);
    pieChart.setData(data);
    pieChart.invalidate(); // refresh

PieEntry对象不保存x位置的值，因为图表中显示的PieEntry对象的顺序由它们在条目列表中的顺序确定。

添加一些额外的样式时，PieChart上面使用的数据结果可能类似于：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZW1lbmdydWkxMg_size_16_color_FFFFFF_t_70 3][]

[ChartData]: https://github.com/PhilJay/MPAndroidChart/wiki/The-ChartData-class
[Link 1]: https://github.com/PhilJay/MPAndroidChart/wiki/The-AxisValueFormatter-interface
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZW1lbmdydWkxMg_size_16_color_FFFFFF_t_70]: /images/20210920/05efdc648bc644f590e62734295ea9a7.png
[Link 2]: https://en.wikipedia.org/wiki/Binary_search_algorithm
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZW1lbmdydWkxMg_size_16_color_FFFFFF_t_70 1]: /images/20210920/77d67609670a4514b20b86a59e45c16a.png
[v3.0.0]: https://github.com/PhilJay/MPAndroidChart/releases
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZW1lbmdydWkxMg_size_16_color_FFFFFF_t_70 2]: /images/20210920/aa41c6ebae0946a8b03cea4619ba98d9.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZW1lbmdydWkxMg_size_16_color_FFFFFF_t_70 3]: /images/20210920/5e2b4d1fd16c4e9688a3995e0bd3ada7.png