首页 > 解决方案 > 在组合图表中绘制蜡烛图和折线图

问题描述

我在MPAndroidChart_GITHUB中使用 VERSION 3.1.0

我试过这段代码

活动测试.xml

<com.github.mikephil.charting.charts.CandleStickChart
            android:id="@+id/lc_chart1"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginBottom="7dp"
            android:background="@drawable/corner_graph"
            android:elevation="2dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHeight_percent="0.75"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintWidth_percent="0.90">

</com.github.mikephil.charting.charts.CandleStickChart>

活动.java

public void initChart() {
        chart.getDescription().setEnabled(false);
        chart.setTouchEnabled(true);
        chart.setDragEnabled(true);
        chart.setPinchZoom(false);
        chart.setDrawBorders(false);    
        chart.setVisibleXRangeMinimum(5);
        // enable scaling and dragging
        chart.setScaleEnabled(true);
        chart.setAutoScaleMinMaxEnabled(true);
        chart.setDrawGridBackground(false);

        CandleData data = new CandleData();
        chart.setData(data);

        XAxis x = chart.getXAxis();
        x.setPosition(XAxis.XAxisPosition.BOTTOM);
        x.setTextColor(Color.parseColor("#B8B8B8"));
        x.setDrawGridLines(false);
        x.setDrawAxisLine(false);
        x.setAvoidFirstLastClipping(true);
        x.setEnabled(true); 

        YAxis ly = chart.getAxisLeft();
        ly.setTextColor(Color.parseColor("#B8B8B8"));
        ly.setLabelCount(10, false); //
        ly.setDrawGridLines(false);
        ly.setDrawAxisLine(false);
        ly.setAxisLineColor(Color.WHITE);
        YAxis ry = chart.getAxisRight();
        ry.setDrawAxisLine(false);
        ry.setEnabled(false); 
        
        chart.getLegend().setEnabled(false);
}

这是图表初始化和绘图

btn_start.setOnClickListener(new OnSingleClickListener() {
            @Override
            public void onSingleClick(View v) {
                ArrayList<CandleEntry> values = new ArrayList<>();

                for (int i = 0; i < 10; i++) {
                    float multi = 15;
                    float val = (float) (Math.random() * 40) + multi;

                    float high = (float) (Math.random() * 9) + 8f;
                    float low = (float) (Math.random() * 9) + 8f;

                    float open = (float) (Math.random() * 6) + 1f;
                    float close = (float) (Math.random() * 6) + 1f;

                    boolean even = i % 2 == 0;

                    values.add(new CandleEntry(
                            i,
                            val + high,
                            val - low,
                            val,val
//                            even ? val + open : val - open,
//                            even ? val - close : val + close
                    ));
                }

                CandleDataSet set1 = new CandleDataSet(values, "Data Set");
                set1.setDrawIcons(false);
                set1.setAxisDependency(YAxis.AxisDependency.LEFT);
//        set1.setColor(Color.rgb(80, 80, 80));
                set1.setShadowColor(Color.DKGRAY);
                set1.setShadowWidth(0.7f);
                set1.setDrawValues(false);
//                set1.setDecreasingColor(Color.RED);
//                set1.setDecreasingPaintStyle(Paint.Style.FILL);
//                set1.setIncreasingColor(Color.rgb(122, 242, 84));
//                set1.setIncreasingPaintStyle(Paint.Style.STROKE);
//                set1.setNeutralColor(Color.BLUE);
                //set1.setHighlightLineWidth(1f);

                CandleData data = new CandleData(set1);

                chart.setData(data);
                chart.invalidate();
            }
});

代码很好用

蜡烛图

但它只是 CandleStickChart

我想在 CombinedChart 中使用蜡烛和线条我正在尝试更改代码

首先,更改文件是布局xml

<com.github.mikephil.charting.charts.CombinedChart
            android:id="@+id/lc_chart1"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginBottom="7dp"
            android:background="@drawable/corner_graph"
            android:elevation="2dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHeight_percent="0.75"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintWidth_percent="0.90">

</com.github.mikephil.charting.charts.CombinedChart>

活动.java

public void initHeartChart() {
        chart.getDescription().setEnabled(false);
        chart.setTouchEnabled(true);
        chart.setDragEnabled(true);
        chart.setPinchZoom(false);
        chart.setDrawBorders(false);

        chart.setVisibleXRangeMinimum(5);
        // enable scaling and dragging
        chart.setScaleEnabled(true);
        chart.setAutoScaleMinMaxEnabled(true);
        chart.setDrawGridBackground(false);

        CombinedData data = new CombinedData();
        chart.setData(data);

        XAxis x = chart.getXAxis();
        x.setPosition(XAxis.XAxisPosition.BOTTOM);
        x.setTextColor(Color.parseColor("#B8B8B8"));
        x.setDrawGridLines(false);
        x.setDrawAxisLine(false);
        x.setAvoidFirstLastClipping(true);
        x.setEnabled(true);

        YAxis ly = chart.getAxisLeft();
        ly.setTextColor(Color.parseColor("#B8B8B8"));
        ly.setLabelCount(10, false); //
        ly.setDrawGridLines(false);
        ly.setDrawAxisLine(false);
        ly.setAxisLineColor(Color.WHITE);
        YAxis ry = chart.getAxisRight();
        ry.setDrawAxisLine(false);
        ry.setEnabled(false); 

        chart.getLegend().setEnabled(false);
}

但这太奇怪了

第一个数据是不是看不到?画的丑??对不起,我英语不好...

组合蜡烛

它是在组合图表中绘制蜡烛

但你可以看到第一个丑陋的数据。

如何改进我的代码?

我需要任何帮助。

谢谢你阅读我的文件

标签: javaandroidmpandroidchart

解决方案


尝试在 xAxis 中设置空间

XAxis xAxis = chart.getXAxis();
xAxis.setSpaceMin(barData.getBarWidth() / 2f);
xAxis.setSpaceMax(barData.getBarWidth() / 2f);

或将 xAxis 最小值设置为 -0.5

xAxis.setAxisMinimum(-0.5f);

推荐阅读