您的位置: 首页  >  IT文章  >  hellocharts的折线图与柱状图的结合之ComboLineColumnChartView

hellocharts的折线图与柱状图的结合之ComboLineColumnChartView

分类: IT文章 • 2024-04-17 22:33:59

哼哼，网上找了半天都不全，所以决定自己写一个完整的可以直接贴代码的

test.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <lecho.lib.hellocharts.view.ComboLineColumnChartView
        android:id="@+id/combochart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>
AddColumnLineData.java(专门用于添加数据)
package com.shaoxin.myhellocharts;

import android.graphics.Color;

import java.util.ArrayList;
import java.util.List;

import lecho.lib.hellocharts.gesture.ZoomType;
import lecho.lib.hellocharts.model.Axis;
import lecho.lib.hellocharts.model.AxisValue;
import lecho.lib.hellocharts.model.Column;
import lecho.lib.hellocharts.model.ColumnChartData;
import lecho.lib.hellocharts.model.Line;
import lecho.lib.hellocharts.model.LineChartData;
import lecho.lib.hellocharts.model.PointValue;
import lecho.lib.hellocharts.model.SubcolumnValue;
import lecho.lib.hellocharts.model.ValueShape;
import lecho.lib.hellocharts.util.ChartUtils;
import lecho.lib.hellocharts.view.ColumnChartView;

import static com.shaoxin.myhellocharts.LineColumn.comboChart;


/**
 * Created by shaoxin on 2016/12/22.
 */

public class AddColumnLineData {

    public final static String[] months = new String[]{"Jan", "Feb", "Mar",
            "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",};
    public static ColumnChartView columnChart;
    public static List<AxisValue> axisValues;


    //设置折线图,添加设置好的数据
    public static LineChartData initLineCharData(List<Line> dataLine) {
        LineChartData lineCharData = new LineChartData(dataLine);
        //初始化轴
        Axis axisX = new Axis().setHasLines(true);
        Axis axisY = new Axis().setHasLines(true);
        axisX.setName("时间");
        axisY.setName("销量");
        lineCharData.setAxisYLeft(axisY);
        lineCharData.setAxisXBottom(axisX);
        return lineCharData;
    }

    //定义方法设置折线图中数据
    public static List<Line> initDataLine() {
        List<Line> lineList = new ArrayList<>();
        List<PointValue> pointValueList = new ArrayList<>();

        int numLines = months.length;
        for (int i = 0; i < numLines; ++i) {
            pointValueList.add(new PointValue(i, (float) Math.random() * 50f + 5));
            axisValues.add(new AxisValue(i).setLabel(months[i]));
        }

        Line line = new Line(pointValueList);
        line.setColor(Color.RED);
        line.setShape(ValueShape.CIRCLE);
        line.setHasLabelsOnlyForSelected(true);
        lineList.add(line);

        return lineList;
    }

    //定义方法设置柱状图中数据
    public static ColumnChartData initColumnCharData(List<Column> dataLine) {
        ColumnChartData columnData = new ColumnChartData(dataLine);


        columnData.setAxisXBottom(new Axis(axisValues).setHasLines(true)
                .setTextColor(Color.BLACK));
        columnData.setAxisYLeft(new Axis().setHasLines(true)
                .setTextColor(Color.BLACK).setMaxLabelChars(2));
        // Set selection mode to keep selected month column highlighted.
        comboChart.setValueSelectionEnabled(true);
        comboChart.setZoomType(ZoomType.HORIZONTAL);

        return columnData;
    }

    //定义方法设置柱状图中数据
    public static List<Column> initColumnLine() {
        List<Column> list = new ArrayList<>();
        List<SubcolumnValue> subcolumnValueList;
        axisValues = new ArrayList<AxisValue>();
        int numSubcolumns = 1;
        int numColumns = months.length;
        for (int i = 0; i < numColumns; ++i) {
            subcolumnValueList = new ArrayList<SubcolumnValue>();
            for (int j = 0; j < numSubcolumns; ++j) {
                subcolumnValueList.add(new SubcolumnValue((float) Math.random() * 50f + 5,
                        ChartUtils.pickColor()));
            }
            // 点击柱状图就展示数据量
            axisValues.add(new AxisValue(i).setLabel(months[i]));
            list.add(new Column(subcolumnValueList).setHasLabelsOnlyForSelected(true));
        }
        return list;
    }

}
LineColumn.java
package com.shaoxin.myhellocharts;

import android.graphics.Color;
import android.graphics.Typeface;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;

import java.util.List;

import lecho.lib.hellocharts.listener.ComboLineColumnChartOnValueSelectListener;
import lecho.lib.hellocharts.model.Axis;
import lecho.lib.hellocharts.model.Column;
import lecho.lib.hellocharts.model.ColumnChartData;
import lecho.lib.hellocharts.model.ComboLineColumnChartData;
import lecho.lib.hellocharts.model.Line;
import lecho.lib.hellocharts.model.LineChartData;
import lecho.lib.hellocharts.model.PointValue;
import lecho.lib.hellocharts.model.SubcolumnValue;
import lecho.lib.hellocharts.model.Viewport;
import lecho.lib.hellocharts.view.ComboLineColumnChartView;

import static com.shaoxin.myhellocharts.AddColumnLineData.axisValues;
import static com.shaoxin.myhellocharts.AddColumnLineData.initColumnCharData;
import static com.shaoxin.myhellocharts.AddColumnLineData.initColumnLine;
import static com.shaoxin.myhellocharts.AddColumnLineData.initDataLine;
import static com.shaoxin.myhellocharts.AddColumnLineData.initLineCharData;

/**
 * Created by shaoxin on 2016/12/22.
 */

public class LineColumn extends AppCompatActivity {
    static ComboLineColumnChartView comboChart;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.test);
        comboChart = (ComboLineColumnChartView) findViewById(R.id.combochart);

        comboChart.setZoomEnabled(true);//设置是否支持缩放
        //为图表设置值得触摸事件
        //设置值触摸侦听器，将触发图表顶部的变化。
        comboChart.setOnValueTouchListener(new ComboLineColumnChartOnValueSelectListener() {
            @Override
            public void onColumnValueSelected(int i, int i1, SubcolumnValue subcolumnValue) {

            }

            @Override
            public void onPointValueSelected(int i, int i1, PointValue pointValue) {

            }

            @Override
            public void onValueDeselected() {

            }
        });
        //设置图表是否可以与用户互动
        comboChart.setInteractive(true);
        //设置图表数据是否选中进行显示
        comboChart.setValueSelectionEnabled(true);
        //定义组合数据对象
        ComboLineColumnChartData comboLineColumnChartData = new ComboLineColumnChartData();
        //为图表设置数据，数据类型为ComboLineColumnChartData
        comboChart.setComboLineColumnChartData(comboLineColumnChartData);

        //为组合图设置折现图数据
        List<Line> dataLine = initDataLine();
        LineChartData lineCharData = initLineCharData(dataLine);
        lineCharData.setLines(dataLine);
        comboLineColumnChartData.setLineChartData(lineCharData);

        //为组合图设置柱形图数据
        List<Column> dataColumn = initColumnLine();
        ColumnChartData columnChartData = initColumnCharData(dataColumn);
        columnChartData.setColumns(dataColumn);
        comboLineColumnChartData.setColumnChartData(columnChartData);

        comboLineColumnChartData.setValueLabelsTextColor(Color.BLACK);// 设置数据文字颜色
        comboLineColumnChartData.setValueLabelTextSize(25);// 设置数据文字大小
        comboLineColumnChartData.setValueLabelTypeface(Typeface.MONOSPACE);// 设置数据文字样式

        Axis axisX = new Axis().setHasLines(true);
        Axis axisY = new Axis().setHasLines(true);
        axisX.setValues(axisValues);
        axisY.setTextColor(Color.BLACK);
        axisY.setTextColor(Color.BLACK);
        comboLineColumnChartData.setAxisYLeft(axisY);
        comboLineColumnChartData.setAxisXBottom(axisX);
        //comboLineColumnChartData.setAxisYRight(axisYRight);//设置右边显示的轴
        //comboLineColumnChartData.setAxisXTop(axisXTop);//设置顶部显示的轴
        comboChart.setComboLineColumnChartData(comboLineColumnChartData);//为组合图添加数据

        Viewport viewport = initViewPort();
        comboChart.setMaximumViewport(viewport);
        comboChart.setCurrentViewport(viewport);
    }

    private Viewport initViewPort() {
        Viewport viewport = new Viewport();
        viewport.top = 60;
        viewport.bottom = 0;
        viewport.left = -2;
        viewport.right = 20;

        return viewport;
    }

    public static ComboLineColumnChartView getComboLineColumnChartView() {
        return comboChart;
    }
}

觉得有用的话别忘了评论点个赞啥的，没用就忽略

相关推荐