【问题标题】:Android MPChart: drawing lines of different plots on the same activity in different colorsAndroid MPChart:在同一活动上以不同颜色绘制不同图的线条
【发布时间】:2018-03-01 16:35:17
【问题描述】:

我正在使用 MPAndroidChart 库创建多个绘图并使用不同的数据源实时更新它们。我希望每个情节都有一条不同颜色的线。问题是,即使我为不同的图指定了另一种颜色,所有图都显示有相同颜色的线。此外,我需要使用不同的数据源更新每个图表,但我怀疑它们都只使用一个数据源,这向我表明,数据发生了同样的颜色问题。

这是我如何在我的活动文件中指定不同绘图的一部分

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

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:id="@+id/linearLayout">

        <com.github.mikephil.charting.charts.LineChart
            android:id="@+id/chart1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

    </LinearLayout>

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/linearLayout"
        android:id="@+id/linearLayout2">

        <com.github.mikephil.charting.charts.LineChart
            android:id="@+id/chart2"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </LinearLayout>

    ...

我有 8 个这样的图堆叠在一起,它们一个接一个地正确显示在我的应用程序上。然后在我的活动文件中,我像这样初始化它们中的每一个

OnChartValueSelectedListener ol = new OnChartValueSelectedListener(){

        @Override
        public void onValueSelected(Entry entry, Highlight h) {
            //entry.getData() returns null here
        }

        @Override
        public void onNothingSelected() {

        }
    };

mChart1 = (LineChart) findViewById(R.id.chart1);
mChart1.setOnChartValueSelectedListener(ol);

mChart2 = (LineChart) findViewById(R.id.chart2);
mChart2.setOnChartValueSelectedListener(ol);
...

然后当我收到数据时,我会这样做

    LineData data1 = mChart1.getData();

    if (data1 != null) {

        ILineDataSet set1 = data1.getDataSetByIndex(0);

        // set.addEntry(...); // can be called as well

        if (set1 == null) {
            set1 = createSet();
            data1.addDataSet(set1);
        }

        data1.addEntry(new Entry(set1.getEntryCount(), f), 0);
        data1.notifyDataChanged();

        // let the chart know it's data has changed
        mChart1.notifyDataSetChanged();

        // limit the number of visible entries
        mChart1.setVisibleXRangeMaximum(20);

        // move to the latest entry
        mChart1.moveViewToX(data1.getEntryCount());

    }

    LineData data2 = mChart2.getData();


    if (data2 != null) {

        ILineDataSet set2 = data2.getDataSetByIndex(0);

        // set.addEntry(...); // can be called as well

        if (set2 == null) {
            set2 = createSet2();
            data2.addDataSet(set2);
        }

        data2.addEntry(new Entry(set2.getEntryCount(), f), 0);
        data2.notifyDataChanged();

        // let the chart know it's data has changed
        mChart2.notifyDataSetChanged();

        // limit the number of visible entries
        mChart2.setVisibleXRangeMaximum(20);

        // move to the latest entry
        mChart2.moveViewToX(data2.getEntryCount());

    }

然后我有分配不同颜色的 createSet 函数

private LineDataSet createSet() {

    LineDataSet set1 = new LineDataSet(null, "");
    set1.setAxisDependency(YAxis.AxisDependency.LEFT);
    set1.setColor(ColorTemplate.getHoloBlue());
    set1.setCircleColor(Color.WHITE);
    set1.setLineWidth(1f);
    set1.setCircleRadius(1f);
    set1.setFillAlpha(65);
    set1.setFillColor(ColorTemplate.getHoloBlue());
    set1.setHighLightColor(Color.rgb(244, 117, 117));
    set1.setValueTextColor(Color.WHITE);
    set1.setValueTextSize(0.1f);
    set1.setDrawValues(false);
    return set1;
}

private LineDataSet createSet2() {

    LineDataSet set2 = new LineDataSet(null, "");
    set2.setAxisDependency(YAxis.AxisDependency.LEFT);
    set2.setColor(Color.GREEN);
    set2.setCircleColor(Color.WHITE);
    set2.setLineWidth(1f);
    set2.setCircleRadius(1f);
    set2.setFillAlpha(65);
    set2.setHighLightColor(Color.rgb(44, 117, 117));
    set2.setValueTextColor(Color.WHITE);
    set2.setValueTextSize(0.1f);
    set2.setDrawValues(false);
    return set2;
}

您看到的设置颜色是一个设置为 getHoloBlue(),它是默认测试颜色,另一个设置为 Color.GREEN。问题是所有 8 个图都有 getHoloBlue 颜色。如果我在第一个 createSet 函数上添加另一种颜色,它们都会变为该颜色。

我是 Android 开发的新手,所以我确定我在这里遗漏了一些东西。

【问题讨论】:

    标签: java android plot mpandroidchart real-time-updates


    【解决方案1】:

    而不是这个:

    ILineDataSet set1 = data1.getDataSetByIndex(0);
    ILineDataSet set2 = data2.getDataSetByIndex(0);
    

    为每个图表视图创建单独的数据集:

    LineDataSet lineDataSet1 = new LineDataSet(lineEntries1, "legend");
    LineDataSet lineDataSet2 = new LineDataSet(lineEntries2, "legend");
    // line entries are arraylist of strings
    enter code here
    

    之后:

    LineData lineData1 = new LineData(lineDataSet1);
    LineData lineData2 = new LineData(lineDataSet2);
    

    然后:

    mChart1.setData(lineData1);
    mChart2.setData(lineData2);
    

    按照该流程,我认为您正在制作不需要的数据集数组存在问题,而且我认为您在定义数据集和数据时做错了。在正常流程中,我们向数据提供数据集,但在您的解决方案中则相反。

    对于单个图表视图中单行的正常流程,请遵循以下示例并以这种方式添加不同的图表视图和数据集。

    例子:

        ArrayList<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));
        lineEntries.add(new Entry(4, 2));
        lineEntries.add(new Entry(5, 3));
        lineEntries.add(new Entry(6, 1));
        lineEntries.add(new Entry(7, 5));
        lineEntries.add(new Entry(8, 7));
        lineEntries.add(new Entry(9, 6));
        lineEntries.add(new Entry(10, 4));
        lineEntries.add(new Entry(11, 5));
    
        LineDataSet lineDataSet = new LineDataSet(lineEntries, "Oil Price");
        lineDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
        lineDataSet.setHighlightEnabled(true);
        lineDataSet.setLineWidth(2);
        lineDataSet.setColor(getColor("defaultBlue"));
        lineDataSet.setCircleColor(getColor("defaultOrange"));
        lineDataSet.setCircleRadius(6);
        lineDataSet.setCircleHoleRadius(3);
        lineDataSet.setDrawHighlightIndicators(true);
        lineDataSet.setHighLightColor(Color.RED);
        lineDataSet.setValueTextSize(12);
        lineDataSet.setValueTextColor(getColor("primaryDark"));
    
        LineData lineData = new LineData(lineDataSet);
    
        lineChart.getDescription().setText("Price in last 12 days");
        lineChart.getDescription().setTextSize(12);
        lineChart.setDrawMarkers(true);
        lineChart.setMarker(markerView(context));
        lineChart.getAxisLeft().addLimitLine(lowerLimitLine(2,"Lower Limit",2,12,getColor("defaultOrange"),getColor("defaultOrange")));
        lineChart.getAxisLeft().addLimitLine(upperLimitLine(5,"Upper Limit",2,12,getColor("defaultGreen"),getColor("defaultGreen")));
        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);
    

    【讨论】:

    • 通过这样做,您可以在同一个图表视图中获得两条线。如需进一步帮助,请让我知道伙计。编码愉快!
    • 谢谢!但这将显示一个带有两条线的图表,对吗?我想要的是两个(以及更多)图表,每个图表都有自己的线条。我现在有 8 个图表,但每个图表上的线条都是相同的,尽管来自所有图表的数据源不同..
    • 哦,我明白了。查看编辑后的答案。希望这将工作伙伴。祝你好运:)
    • 嘿,也没有用,但还是感谢您的帮助 :) 我将每个图表的所有线性布局都放在相同的相对布局中,这不是问题吗?
    • 不,伙计,我不认为将它们放在相同的相对布局中是个问题。
    猜你喜欢
    • 2011-01-02
    • 2023-03-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-11-05
    • 1970-01-01
    相关资源
    最近更新 更多