Newer
Older
MpAndroidChart / MPChartExample / src / com / xxmassdeveloper / mpchartexample / view / CombinedChart1.java
package com.xxmassdeveloper.mpchartexample.view;

import android.content.Context;
import android.graphics.Color;
import android.util.AttributeSet;
import android.view.View;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.github.mikephil.charting.charts.CombinedChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.BarData;
import com.github.mikephil.charting.data.BarDataSet;
import com.github.mikephil.charting.data.BarEntry;
import com.github.mikephil.charting.data.CombinedData;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.github.mikephil.charting.formatter.IndexAxisValueFormatter;
import com.github.mikephil.charting.formatter.MyYAxisValueFormatter;
import com.github.mikephil.charting.interfaces.datasets.IDataSet;
import com.xxmassdeveloper.mpchartexample.R;
import com.xxmassdeveloper.mpchartexample.custom.MyMarkerView;

import java.util.ArrayList;

/**
 * @Info
 * @Auth Bello
 * @Time 18-3-2 下午6:08
 * @Ver     http://blog.csdn.net/yinzhijiezhan/article/details/49758333
 */

public class CombinedChart1 extends RelativeLayout {
    private Context context;
    private TextView titleText;
    private CheckBox showBtn;
    //组合图形控件
    private CombinedChart mChart;
    //X轴显示的文字
    private String[] quarters ;
    //线图数据
    private ArrayList<Entry> lineEntries = new ArrayList<>();
    //柱图数据
    private ArrayList<BarEntry> barEntries = new ArrayList<>();


    public CombinedChart1(Context context) {
        super(context);
        initView(context);
    }

    public CombinedChart1(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView(context);
    }

    /**
     * 加载UI布局
     * @param context
     */
    private void initView(Context context){
        this.context = context;
        View.inflate(context, R.layout.lt_combined, this);
        titleText = this.findViewById(R.id.chart_title_text);
        showBtn = this.findViewById(R.id.chart_show_text);
        showBtn.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                for (IDataSet set : mChart.getData().getDataSets()) {
                    if (set instanceof LineDataSet)
                        set.setDrawValues(b);

                    if (set instanceof BarDataSet)
                        set.setDrawValues(b);
                }
                mChart.invalidate();
            }
        });
        mChart = this.findViewById(R.id.chart_combined);

    }


    /**
     * 加载数据
     * @param chartName
     * @param legend1
     * @param legend2
     * @param leftYUnit
     * @param rightYUnit
     * @param quarters
     * @param lineEntries
     * @param barEntries
     */
    public void setData(String chartName, String legend1, String legend2, String leftYUnit, String rightYUnit, String[] quarters,
                        ArrayList<Entry>
            lineEntries,
                        ArrayList<BarEntry> barEntries) {
        this.quarters = quarters;
        this.lineEntries = lineEntries;
        this.barEntries = barEntries;

        //显示表的名称
        titleText.setText(chartName);



        //载入chart
        loadChart(legend1, legend2, leftYUnit, rightYUnit);
    }

    /**
     * 为chart加载数据
     */
    private void loadChart(String legend1, String legend2, String leftYUnit, String rightYUnit) {
        //图表描述
        mChart.getDescription().setEnabled(false);
        //图表背景
        mChart.setBackgroundColor(Color.WHITE);
        //是否启用网格背景
        mChart.setDrawGridBackground(false);
        //在各条 bar 后面绘制 “灰色全值 bar”
        mChart.setDrawBarShadow(false);
        //Y轴方向上不允许拉伸
        mChart.setScaleYEnabled(false);
        mChart.setHighlightFullBarEnabled(false);
        //true,没缩放功能。false,x轴和y轴可分别放大
        mChart.setPinchZoom(true);

        //要绘制的组件
        mChart.setDrawOrder(new CombinedChart.DrawOrder[]{CombinedChart.DrawOrder.LINE, CombinedChart.DrawOrder.BAR});

        //点击是显示的marker值
        MyMarkerView mv = new MyMarkerView(context, R.layout.custom_marker_view);
        mv.setChartView(mChart); // For bounds control
        mChart.setMarker(mv); // Set the marker to the chart


        //图例
        Legend l = mChart.getLegend();
        l.setEnabled(true); //是否启用图列(true:下面属性才有意义)
        l.setWordWrapEnabled(true); //设置图列换行(注意使用影响性能,仅适用legend位于图表下面)
        l.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);
        l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);
        l.setOrientation(Legend.LegendOrientation.HORIZONTAL);
//        l.setForm(Legend.LegendForm.DEFAULT); //设置图例的形状
        l.setFormSize(10);                    //设置图例的大小
        l.setFormToTextSpace(2f);            //设置每个图例实体中标签和形状之间的间距
        l.setDrawInside(false);
        l.setXEntrySpace(10f);                //设置图例实体之间延X轴的间距(setOrientation = HORIZONTAL有效)
        l.setYEntrySpace(8f);                 //设置图例实体之间延Y轴的间距(setOrientation = VERTICAL 有效)
        l.setXOffset(5f);
        l.setYOffset(0f);                     //设置比例块Y轴偏移量
        l.setTextSize(10f);                   //设置图例标签文本的大小
        l.setTextColor(Color.parseColor("#888888"));//设置图例标签文本的颜色


        //左边的Y轴
        YAxis leftAxis = mChart.getAxisLeft();
        leftAxis.setDrawGridLines(false);   //是否显示Y轴网格线
        leftAxis.setAxisMinimum(0f);        //Y轴的最小值
        leftAxis.setTextColor(Color.parseColor("#888888"));   //Y轴文字颜色
        leftAxis.setLabelCount(10);        //Y轴显示的值个数
        leftAxis.setAxisLineColor(Color.TRANSPARENT);  //Y轴线颜色
        leftAxis.setValueFormatter(new MyYAxisValueFormatter(leftYUnit));


        //右边的Y轴
        YAxis rightAxis = mChart.getAxisRight();
        rightAxis.setDrawGridLines(false);   //是否显示Y轴网格线
        rightAxis.setTextColor(Color.parseColor("#888888"));   //Y轴文字颜色
//        rightAxis.setAxisMinimum(0f);        //Y轴的最小值
//        rightAxis.setAxisMaximum(100);     //设置Y轴最大值
        rightAxis.setLabelCount(10);        //Y轴显示的值个数
        rightAxis.setAxisLineColor(Color.TRANSPARENT);  //Y轴线颜色
        rightAxis.setDrawZeroLine(false);    //是否显示0值的轴线
        rightAxis.setGranularityEnabled(false);
        rightAxis.setValueFormatter(new MyYAxisValueFormatter(rightYUnit));


        //底部X轴
        XAxis xAxis = mChart.getXAxis();
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setDrawGridLines(false);
        xAxis.setAxisMinimum(-0.5f);           //设置轴的最小值。这样设置将不会根据提供的数据自动计算。
        xAxis.setGranularity(1f);           //缩放的时候有用,比如放大的时候,我不想把横轴的月份再细分
        xAxis.setGranularityEnabled(true);
        xAxis.setCenterAxisLabels(false);   //字体下面的标签 显示在每个直方图的中间
        xAxis.setTextColor(Color.parseColor("#FFFFFF"));
        xAxis.setValueFormatter(new IndexAxisValueFormatter(quarters));//X轴文字
        xAxis.setAxisLineColor(Color.TRANSPARENT);      //X轴线颜色
        xAxis.setXAxisBackground(Color.parseColor("#A3A3A3"));
//        xAxis.setAxisLineWidth(10f);
        xAxis.setYOffset(1.5f);
//        xAxis.setAxisMaximum((float) (12 - 0.5)); //以下是为了解决 柱状图 左右两边只显示了一半的问题 根据实际情况 而定
        xAxis.setDrawLabels(true);          //绘制标签  指x轴上的对应数值
        xAxis.setAvoidFirstLastClipping(false);//图表将避免第一个和最后一个标签条目被减掉在图表或屏幕的边缘

        CombinedData data = new CombinedData();
        //添加线图
        data.setData(generateLineData(legend2));
        //添加柱图
        data.setData(generateBarData(legend1));

        xAxis.setLabelCount((int)data.getXMax(), false);             //一个界面显示几个Lable
        xAxis.setAxisMaximum(data.getXMax() + 0.5f);


        //动画
        mChart.animateXY(3000, 3000);
        mChart.setData(data);
        mChart.invalidate();
    }

    /**
     * 加载线条的数据
     *
     * @return
     */
    private LineData generateLineData(String label) {

        LineDataSet set = new LineDataSet(lineEntries, label); //新建线条数据,并设置示例文字
        set.setColor(Color.parseColor("#CCCCCC"));                 //线条颜色
        set.setLineWidth(0.5f);                     //线条宽度
        set.setDrawCircles(false);                  //是否显示圆点
        set.setCircleColor(Color.GRAY);             //圆点颜色
        set.setCircleRadius(0.8f);                  //圆点半径
        set.setDrawFilled(true);                    //是否颜色填充
        set.setFillColor(Color.parseColor("#CCCCCC"));             //填充颜色
        set.setMode(LineDataSet.Mode.CUBIC_BEZIER); //转折点为曲线
        set.setDrawValues(false);                    //显示数值
        set.setValueTextSize(8f);                  //数值字体大小
        set.setValueTextColor(Color.parseColor("#AAAAAA")); //数值的颜色
        set.setAxisDependency(YAxis.AxisDependency.RIGHT); //以右边Y轴的标签绘制

        LineData d = new LineData();
        d.addDataSet(set);

        return d;
    }

    /**
     * 加载矩形的数据
     *
     * @return
     */
    private BarData generateBarData(String label) {
        BarDataSet barDataSet = new BarDataSet(barEntries, label);  //新建数据,并设置示例文字
        barDataSet.setColor(Color.parseColor("#FF6633"));       //柱状颜色
        barDataSet.setBarBorderRadius(10f);                               //设置圆角矩形
        barDataSet.setDrawValues(false);
        barDataSet.setValueTextSize(8f);                  //数值字体大小
        barDataSet.setValueTextColor(Color.parseColor("#f77d54")); //数值的颜色//是否显示数值
        barDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);          //以左边Y轴的标签绘制

        BarData barData = new BarData();
        barData.addDataSet(barDataSet);

        return barData;
    }
}