hellocharts图表插件---折线图

膜拜了些大神的笔记，觉得十分有用，附上网址：
1.很好上手的折线图：
手把手教你实现折线图之——安卓最好用的图表库hellocharts之最详细的使用介绍 - q2nAmor - CSDN博客 http://blog.csdn.net/u012534831/article/details/51505683
2.特别齐全的各种图表，简直牛掰啦：
hellocharts-android开源图表库（效果非常好） - 泡在网上的日子 http://jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1107/1930.html

效果如图所示：

1.在app的gradle里声明一下：

//引入hellocharts图表插件
    compile 'com.github.lecho:hellocharts-android:v1.5.8'

2.在libs文件家里添加jar包

可以进行各种编码了。

补充代码：
1.activity的xml布局：

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

    <lecho.lib.hellocharts.view.LineChartView
        android:id="@+id/linechart"
        android:layout_marginTop="20dp"
        android:layout_width="match_parent"
        android:layout_height="300dp"/>

</LinearLayout>

2.acitivty的代码：

//libs文件夹里放入了hellocharts工具包插件
public class LineChartActivity extends AppCompatActivity {

    @BindView(R.id.linechart)
    LineChartView lineChart;

    String[] date = {"5-23","5-22","6-22","5-23","5-22","2-22","5-22","4-22","9-22","10-22","11-22",
            "12-22","1-22","6-22","5-23","5-22","2-22","5-22","4-22",
            "9-22","10-22","11-22","12-22","4-22","9-22","10-22","11-22","zxc"};//X轴的标注
    int[] score= {74,22,18,79,20,74,20,74,42,90,74,42,90,50,42,90,
            33,10,74,22,18,79,20,74,22,18,79,20};//图表的数据
    private List<PointValue> mPointValues = new ArrayList<PointValue>();
    private List<AxisValue> mAxisXValues = new ArrayList<AxisValue>();

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_linechart);
        ButterKnife.bind(this);

        getAxisXLables();//获取x轴的标注
        getAxisPoints();//获取坐标点
        initLineChart();//初始化
    }


    /**
     * 初始化LineChart的一些设置
     */
    private void initLineChart(){
        Line line = new Line(mPointValues).setColor(Color.parseColor("#FFCD41"));  //折线的颜色
        List<Line> lines = new ArrayList<Line>();
        line.setShape(ValueShape.CIRCLE);//折线图上每个数据点的形状
        // 这里是圆形 （有三种 ：ValueShape.SQUARE  ValueShape.CIRCLE  ValueShape.SQUARE）
        line.setCubic(false);//曲线是否平滑
//      line.setStrokeWidth(3);//线条的粗细，默认是3
        line.setFilled(false);//是否填充曲线的面积
        line.setHasLabels(true);//曲线的数据坐标是否加上备注
//      line.setHasLabelsOnlyForSelected(true);//点击数据坐标提示数据
// （设置了这个line.setHasLabels(true);就无效）
        line.setHasLines(true);//是否用直线显示。如果为false 则没有曲线只有点显示
        line.setHasPoints(true);//是否显示圆点 如果为false 则没有原点只有点显示
        lines.add(line);
        LineChartData data = new LineChartData();
        data.setLines(lines);

        //坐标轴
        Axis axisX = new Axis(); //X轴
        axisX.setHasTiltedLabels(true);  //X轴下面坐标轴字体是斜的显示还是直的，true是斜的显示
//      axisX.setTextColor(Color.WHITE);  //设置字体颜色
        axisX.setTextColor(Color.parseColor("#363636"));//黑色

        axisX.setName("未来几天的天气");  //表格名称
        axisX.setTextSize(16);//设置字体大小
        axisX.setMaxLabelChars(7); //最多几个X轴坐标，
        // 意思就是你的缩放让X轴上数据的个数7<=x<=mAxisValues.length
        axisX.setValues(mAxisXValues);  //填充X轴的坐标名称
        data.setAxisXBottom(axisX); //x 轴在底部
//      data.setAxisXTop(axisX);  //x 轴在顶部
        axisX.setHasLines(false); //x 轴分割线


        Axis axisY = new Axis();  //Y轴
        axisY.setName("新的设置");//y轴标注
        axisY.setTextColor(Color.parseColor("#363636"));//黑色
        axisY.setTextSize(11);//设置字体大小
        data.setAxisYLeft(axisY);  //Y轴设置在左边
        //data.setAxisYRight(axisY);  //y轴设置在右边


        //设置行为属性，支持缩放、滑动以及平移
        lineChart.setInteractive(true);
        lineChart.setZoomType(ZoomType.HORIZONTAL);  //缩放类型，水平
        lineChart.setMaxZoom((float) 3);//缩放比例
        lineChart.setLineChartData(data);
        lineChart.setVisibility(View.VISIBLE);
        /**注：下面的7，10只是代表一个数字去类比而已
         * 见（http://forum.xda-developers.com/tools/programming/library-hellocharts-charting-library-t2904456/page2）;
         * 下面几句可以设置X轴数据的显示个数（x轴0-7个数据），当数据点个数小于（29）的时候，缩小到极致hellochart默认的是所有显示。当数据点个数大于（29）的时候，
         * 若不设置axisX.setMaxLabelChars(int count)这句话,则会自动适配X轴所能显示的尽量合适的数据个数。
         * 若设置axisX.setMaxLabelChars(int count)这句话,
         * 33个数据点测试，若 axisX.setMaxLabelChars(10);里面的10大于v.right= 7; 里面的7，则
         刚开始X轴显示7条数据，然后缩放的时候X轴的个数会保证大于7小于10
         若小于v.right= 7;中的7,反正我感觉是这两句都好像失效了的样子 - -!
         * 并且Y轴是根据数据的大小自动设置Y轴上限
         * 若这儿不设置 v.right= 7; 这句话，则图表刚开始就会尽可能的显示所有数据，交互性太差
         */
        Viewport v = new Viewport(lineChart.getMaximumViewport());
        v.left = 0;
        v.right= 7;
        lineChart.setCurrentViewport(v);
    }

    /**
     * X 轴的显示
     */
    private void getAxisXLables(){
        for (int i = 0; i < date.length; i++) {
            mAxisXValues.add(new AxisValue(i).setLabel(date[i]));
        }
    }
    /**
     * 图表的每个点的显示
     */
    private void getAxisPoints(){
        for (int i = 0; i < score.length; i++) {
            mPointValues.add(new PointValue(i, score[i]));
        }
    }
}

—-补充——

1.界面xml布局中：

 <TextView
                    android:gravity="bottom"
                    android:id="@+id/tv_type"
                    android:textColor="@color/app_white"
                    android:textSize="22sp"
                    android:layout_width="0dp"
                    android:layout_weight="1"
                    android:layout_height="match_parent" />
                <TextView
                    android:layout_marginLeft="10dp"
                    android:id="@+id/tv_date"
                    android:textSize="14sp"
                    android:textColor="@color/app_white"
                    android:gravity="bottom"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent" />
                <TextView
                    android:id="@+id/tv_result"
                    android:textColor="@color/app_white"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:textStyle="bold"
                    android:gravity="bottom"
                    android:textSize="22sp"/>

 <lecho.lib.hellocharts.view.LineChartView
                android:id="@+id/linechart"
                android:visibility="gone"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

2.界面activity中：

折线图所示数据：

 String[] yearsX = {"2013", "2014", "2015", "2016", "2017"};//X轴的标注:年份
    int[] heightY= { 136, 142, 148, 153, 155};//图表的数据：身高

linechart.setZoomEnabled(false);//设置是否可以缩放
        linechart.setInteractive(true);//设置是否可以平移

        //X轴
        Axis axisX = new Axis().setHasLines(true);
        axisX.setLineColor(getResources().getColor(R.color.app_white));
        axisX.setTextColor(getResources().getColor(R.color.app_white));
        ArrayList<AxisValue> axisValuesX = new ArrayList<AxisValue>();//定义X轴刻度值的数据集合
        ArrayList<PointValue> pointValues = new ArrayList<>();

        //循环为节点、X、Y轴添加数据
        for (int j = 0; j < yearsX.length; j++) {
            axisValuesX.add(new AxisValue(j).setValue(j).setLabel( yearsX[j]));// 添加X轴显示的刻度值
        }
        tvType.setText("身高");
                linechart.setBackgroundColor(Color.parseColor("#f9c172"));
                chartBar.setBackgroundColor(Color.parseColor("#f9c172"));
                for (int i = 0; i < heightY.length; i++) {
                    pointValues.add(new PointValue(i, heightY[i]));
                }
 axisX.setValues(axisValuesX);
        //线条
        List<Line> lines = new ArrayList<Line>();//定义线的集合
        Line line = new Line(pointValues);//将值设置给折线
        line.setColor(getResources().getColor(R.color.app_white));// 设置折线颜色
        line.setStrokeWidth(3);// 设置折线宽度
        line.setFilled(false);// 设置折线覆盖区域是否填充
        line.setCubic(true);// 是否设置为立体的
        line.setPointColor(getResources().getColor(R.color.app_white));// 设置节点颜色
        line.setPointRadius(5);// 设置节点半径
        line.setHasLabels(true);// 是否显示节点数据
        line.setHasLines(true);// 是否显示折线
        line.setHasPoints(true);// 是否显示节点
        line.setShape(ValueShape.CIRCLE);// 节点图形样式 DIAMOND菱形、SQUARE方形、CIRCLE圆形
        //   line.setHasLabelsOnlyForSelected(true);// 隐藏数据，触摸可以显示
        lines.add(line);// 将数据集合添加线

        LineChartData chartData = new LineChartData(lines);//将线的集合设置为折线图的数据
        // chartData.setAxisYLeft(axisY);// 将Y轴属性设置到左边
        chartData.setAxisXBottom(axisX);// 将X轴属性设置到底部
        //chartData.setAxisYRight(axisYRight);//设置右边显示的轴
        // chartData.setAxisXTop(axisXTop);//设置顶部显示的轴
        chartData.setBaseValue(20);// 设置反向覆盖区域颜色
        chartData.setValueLabelBackgroundAuto(true);// 设置数据背景是否跟随节点颜色
        chartData.setValueLabelBackgroundColor(getResources().getColor(R.color.app_polygon));// 设置数据背景颜色
        chartData.setValueLabelBackgroundEnabled(true);// 设置是否有数据背景
        chartData.setValueLabelsTextColor(getResources().getColor(R.color.app_gray));// 设置数据文字颜色
        chartData.setValueLabelTextSize(12);// 设置数据文字大小
        chartData.setValueLabelTypeface(Typeface.MONOSPACE);// 设置数据文字样式
        // chart.setLineChartData(LineChartData data);//最后为图表设置数据，数据类型为LineChartDat
        linechart.setLineChartData(chartData);
        linechart.setOnValueTouchListener(FrChart.this);

implements LineChartOnValueSelectListener

 @Override
    public void onValueSelected(int i, int i1, PointValue pointValue) {
        tvDate.setText( String.valueOf( yearsX[i1] ) + "/03/11");
        switch ( position){
            case 2:
                tvResult.setText( String.valueOf( heightY[i1] ) + " cm");
                break;
            case 3:
                tvResult.setText( String.valueOf( eyesightY[i1] ) );
                break;
            case 4:
                tvResult.setText( String.valueOf( weightY[i1] ) + " kg");
                break;
        }
    }