android 折线图之二MPAndroidChart

在前面中提到，Achartengine使用过程中出现了错误，一时都没有找到方法，试过很多方法根本没用，有人推荐MPAndroidChart，但是没有achartengine的资料多，但是通过拼凑还是了解了一点。

下载：https://github.com/PhilJay/MPAndroidChart

在程序中加为lib或直接下载包文件放到libs里

在xml文件中布局：

 

 <LinearLayout
        android:id="@+id/oxy_line"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
       android:padding="20dip"
        android:orientation="vertical">
        <!-- 温度 -->

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="温度(℃)" />

            <com.github.mikephil.charting.charts.LineChart
                android:id="@+id/lc_history_temperature"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:layout_marginBottom="10dp" />
    </LinearLayout>

在java代码中实现：

package com.smartpond.mainui.fragment;

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

import android.content.Context;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.EditText;
import android.widget.LinearLayout;

import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.Legend.LegendForm;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.XAxis.XAxisPosition;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.module.data.CollectCode;
import com.module.data.SysUser;
import com.smartpond.mainui.R;

public class PHfragment extends Fragment {
	private View mView;
	private Context mContext;
	private LinearLayout tuLayout;

	private EditText phValEdt;
	private EditText phTempEdt;

	private String phVal;
	private String phTemp;

	public PHfragment() {

	}

	public PHfragment(Context context) {
		mContext = context;
	}

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		mView = inflater.inflate(R.layout.fragment_ph, null);
		// 温度
		LineChart lc_history_temperature = (LineChart) mView
				.findViewById(R.id.lc_temperature);
		LineData mTemperatureData = getLineData(7, 40);
		showChart(lc_history_temperature, mTemperatureData, R.color.red_failed);
		initView();
		return mView;
	}

	public void initView() {
		phValEdt = (EditText) mView.findViewById(R.id.ph_val_view);
		phTempEdt = (EditText) mView.findViewById(R.id.ph_temp_view);

		SetDatatoView();

	}

	public void SetDatatoView() {
		final List<CollectCode> mCollectCodes = SysUser.Instance()
				.getCollectCodes();

		getActivity().runOnUiThread(new Runnable() {

			@Override
			public void run() {
				phVal = mCollectCodes.get(0).GetDCVal();
				phTemp = mCollectCodes.get(1).GetDCVal();
				phValEdt.setText(phVal);
				phTempEdt.setText(phTemp);
			}
		});

	}

	/**
	 * 生成一个数据
	 * 
	 * @param count
	 *            表示图表中有多少个坐标点
	 * @param range
	 *            用来生成range以内的随机数
	 * @return
	 */
	private LineData getLineData(int count, float range) {
		ArrayList<String> xValues = new ArrayList<String>();
		for (int i = 0; i < count; i++) {
			// x轴显示的数据，这里默认使用数字下标显示
			xValues.add("" + i);
		}

		ArrayList<LineDataSet> lineDataSets = new ArrayList<LineDataSet>();
		// y轴的数据 1======================================start
		ArrayList<Entry> yValues = new ArrayList<Entry>();
		for (int i = 0; i < count; i++) {
			float value = (float) (Math.random() * range) + 3;
			yValues.add(new Entry(value, i));
		}

		// create a dataset and give it a type
		// y轴的数据集合
		LineDataSet lineDataSet = new LineDataSet(yValues, "" /* 测试折线图 */);
		// mLineDataSet.setFillAlpha(110);
		// mLineDataSet.setFillColor(Color.RED);

		// 用y轴的集合来设置参数
		// 线宽
		lineDataSet.setLineWidth(2.0f);
		// 显示的圆形大小
		lineDataSet.setCircleSize(2.5f);
		// 显示折线颜色
		lineDataSet.setColor(Color.GREEN);
		// 圆形的颜色
		lineDataSet.setCircleColor(Color.YELLOW);
		// 高亮指示线的颜色
		lineDataSet.setHighLightColor(Color.parseColor("#ff000000"));
		// 设置圆点的颜色
		lineDataSet.setFillColor(Color.GREEN);
		lineDataSet.setDrawCircleHole(false);
		// lineDataSet.setValueTextSize(9f);
		lineDataSet.setFillAlpha(65);

		lineDataSets.add(lineDataSet);
		// y轴的数据 1======================================end

		// create a data object with the datasets
		LineData lineData = new LineData(xValues, lineDataSets);
		return lineData;
	}

	/**
	 * 显示数据
	 * 
	 * @param lineChart
	 * @param lineData
	 * @param color
	 */
	private void showChart(LineChart lineChart, LineData lineData, int color) {
		// 是否在折线图上添加边框
		lineChart.setDrawBorders(false);

		// 数据描述
		lineChart.setDescription("");
		// 如果没有数据的时候，会显示这个，类似listview的emtpyview
		lineChart.setNoDataTextDescription("暂无数据");

		// 是否显示表格颜色
		lineChart.setDrawGridBackground(false);
		// 表格的的颜色，在这里是是给颜色设置一个透明度
		lineChart.setGridBackgroundColor(Color.WHITE & 0x70FFFFFF);

		// 设置是否可以触摸
		lineChart.setTouchEnabled(true);
		// 是否可以拖拽
		lineChart.setDragEnabled(true);
		// 是否可以缩放
		lineChart.setScaleEnabled(true);

		// if disabled, scaling can be done on x- and y-axis separately
		lineChart.setPinchZoom(false);

		// lineChart.setBackgroundColor(Color.rgb(Integer.parseInt("7e", 16),
		// Integer.parseInt("ce", 16), Integer.parseInt("f4", 16)));// 设置背景
		// 设置数据
		lineChart.setData(lineData);

		// 设置比例图标示，就是那个一组y的value的
		Legend mLegend = lineChart.getLegend();
		// mLegend.setPosition(LegendPosition.BELOW_CHART_CENTER);
		// 样式
		mLegend.setForm(LegendForm.CIRCLE);
		// 字体
		mLegend.setFormSize(0f);
		// 颜色
		mLegend.setTextColor(Color.RED);
		// 字体
		// mLegend.setTypeface(mTf);

		// 设置Y轴右边不显示数字
		lineChart.getAxisRight().setEnabled(false);

		XAxis xAxis = lineChart.getXAxis();
		// 设置X轴的数据显示在报表的下方
		xAxis.setPosition(XAxisPosition.BOTTOM);
		// 设置不从X轴发出纵向直线
		
		
		
		xAxis.setDrawGridLines(true);
		// 设置y轴方向的网格线
		// lineChart.getXAxis().setDrawGridLines(true);
		// lineChart.getXAxis().setGridColor(Color.RED);
		// 立即执行的动画,x轴
		lineChart.animateX(2500);
	}

}

可能比achartengine会简单一点，但是功能也很强大，关键是在我的程序里没用错误.