码迷,mamicode.com
首页 > 移动开发 > 详细

MPChartAndroid使用讲解

时间:2015-07-28 23:09:21      阅读:1142      评论:0      收藏:0      [点我收藏+]

标签:android   图表 mpchartandroid   

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">    最的项目里又要加更加复杂的图表了,实在是不想在去自己实现了,就想找个第三方的开源图表库去实现,以前自己封装过achartenginee这个apache的图表引擎,但看到这个MPChartAndroid后,觉得 achartengine简直是弱爆了。下面就先对比一下MPChartEnginee的优势,及其使用。</span>

  MPChartEnginee的优点:1.更加美观的外表,从官方给的各自的两个Demo就可以看出,MPChartAndroid绘出来的图表更加的柔和,美观。

                                            2.更加完美的事件冲突处理,用过achartenginee的都知道,achartenginee在事件冲突的处理上真的不是十分完美,achartenginee做出来的图表放到                                                ScrollView中,会导致ScrollView滑动不灵敏,而MPChartEnginee则不存在此问题,官方给出的demo就有在ListView中的图表,有在ScrollView                                                   中的图表,可以说对事件的处理可以算是完美。

                                            3.更加强大的可定制性,在学习和使用achartenginee时,发现图表有很多属性是没有提供set方法去设置的,导致很多情况下,做出来的图表不符合                                                实际需求,样式特别的难看,而MPChartEnginee则几乎对所有可见的属性都提供了set方法,可以轻松的定制图表外观,这也是我转而使用这个框                                                架的主要原因。

                                            4.强大的动画特效,可以为我们的 App增色不少。(存在一点点bug,不是必现的)。


  基于以上几点,我们以后可以放弃achartenginee等图表框架,而全部使用MpChartEnginee了。下面就我对框架源码的理解,首先讲解一下源码的组成结构。看下源码结构      图:

  技术分享

  源码结构中,我们只要重点关注chart包,components包,data,listener包和animation包即可。其中,chart包中定义了所有可以绘制的图表种类,主要用来绘制图表的整体属性,定义事件处理等,data包中定义了不同图表所需要的不同数据类型,components包中定义了所有chart相关的组件定义,listener中则定义了与用户的事件交互处理。

   官方Demo讲解:   

package com.xxmassdeveloper.mpchartexample;

public class LineChartActivity1 extends DemoBase
{
	private LineChart mChart;

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

		mChart = (LineChart) findViewById(R.id.chart1);
		mChart.setDescription("");    //设置图表描述信息
		mChart.setScaleEnabled(false); //设置图表是否可缩放
		mChart.setBackgroundColor(Color.WHITE); //设置图表背景颜色
		mChart.setDrawGridBackground(false);  //设置是否显示表格

		XAxis xAxis = mChart.getXAxis();     //得到图表的X轴实例
		xAxis.setPosition(XAxisPosition.BOTTOM);//设置X轴的显示位置
		xAxis.setDrawGridLines(false);  //设置是否显示X轴表格
		xAxis.setAvoidFirstLastClipping(true); //设置x轴起点和终点label不超出屏幕
		xAxis.setDrawAxisLine(true);           //设置显示x轴
		xAxis.setSpaceBetweenLabels(0); // 设置x轴label不间隔

		YAxis leftAxis = mChart.getAxisLeft();  //得到图表的左侧Y轴实例
		leftAxis.setAxisMaxValue(3.4482f); // 设置Y轴最大值
		leftAxis.setAxisMinValue(3.1872f);// 设置Y轴最小值。
		leftAxis.setStartAtZero(false);   //设置图表起点从0开始
		leftAxis.enableGridDashedLine(10f, 10f, 0f); //设置横向表格为虚线
                 
		// limit lines are drawn behind data (and not on top)
		leftAxis.setDrawLimitLinesBehindData(true);

		mChart.getAxisRight().setEnabled(false); //设置右侧Y轴不可用(这里可以向得到左侧Y轴那样,得到右侧Y轴实例去处理)
                // YAxis rightAxis = mChart.getAxisRight();
                // rightAxis.setTextSize();
                // rightAxis.setTextColor();等一系列的设置
                // add data
		setData(7, 3);

		// mChart.setVisibleXRange(5, AxisDependency.LEFT);
		// mChart.setVisibleYRangeMaximum(5f, AxisDependency.LEFT);
		// dont forget to refresh the drawing
		mChart.invalidate();
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu)
	{
		getMenuInflater().inflate(R.menu.line, menu);
		return true;
	}

	@Override
	public boolean onOptionsItemSelected(MenuItem item)
	{

		switch (item.getItemId())
		{
		case R.id.actionToggleValues:
		{
			for (DataSet<?> set : mChart.getData().getDataSets())
				set.setDrawValues(!set.isDrawValuesEnabled());

			mChart.invalidate();
			break;
		}
		case R.id.actionToggleHighlight:
		{
			if (mChart.isHighlightEnabled())
				mChart.setHighlightEnabled(false);
			else mChart.setHighlightEnabled(true);
			mChart.invalidate();
			break;
		}
		case R.id.actionToggleFilled:
		{

			ArrayList<LineDataSet> sets = (ArrayList<LineDataSet>) mChart.getData().getDataSets();

			for (LineDataSet set : sets)
			{
				if (set.isDrawFilledEnabled())
					set.setDrawFilled(false);
				else set.setDrawFilled(true);
			}
			mChart.invalidate();
			break;
		}
		case R.id.actionToggleCircles:
		{
			ArrayList<LineDataSet> sets = (ArrayList<LineDataSet>) mChart.getData().getDataSets();

			for (LineDataSet set : sets)
			{
				if (set.isDrawCirclesEnabled())
					set.setDrawCircles(false);
				else set.setDrawCircles(true);
			}
			mChart.invalidate();
			break;
		}
		case R.id.actionToggleCubic:
		{
			ArrayList<LineDataSet> sets = (ArrayList<LineDataSet>) mChart.getData().getDataSets();

			for (LineDataSet set : sets)
			{
				if (set.isDrawCubicEnabled())
					set.setDrawCubic(false);
				else set.setDrawCubic(true);
			}
			mChart.invalidate();
			break;
		}
		case R.id.actionToggleStartzero:
		{
			mChart.getAxisLeft().setStartAtZero(!mChart.getAxisLeft().isStartAtZeroEnabled());
			mChart.getAxisRight().setStartAtZero(!mChart.getAxisRight().isStartAtZeroEnabled());
			mChart.invalidate();
			break;
		}
		case R.id.actionTogglePinch:
		{
			if (mChart.isPinchZoomEnabled())
				mChart.setPinchZoom(false);
			else mChart.setPinchZoom(true);

			mChart.invalidate();
			break;
		}
		case R.id.actionToggleAutoScaleMinMax:
		{
			mChart.setAutoScaleMinMaxEnabled(!mChart.isAutoScaleMinMaxEnabled());
			mChart.notifyDataSetChanged();
			break;
		}
		case R.id.animateX:
		{
			mChart.animateX(3000);
			break;
		}
		case R.id.animateY:
		{
			mChart.animateY(3000, Easing.EasingOption.EaseInCubic);
			break;
		}
		case R.id.animateXY:
		{
			mChart.animateXY(3000, 3000);
			break;
		}
		case R.id.actionToggleFilter:
		{

			// the angle of filtering is 35°
			Approximator a = new Approximator(ApproximatorType.DOUGLAS_PEUCKER, 35);

			if (!mChart.isFilteringEnabled())
			{
				mChart.enableFiltering(a);
			}
			else
			{
				mChart.disableFiltering();
			}
			mChart.invalidate();

			//
			// for(int i = 0; i < 10; i++) {
			// mChart.addEntry(new Entry((float) (Math.random() * 100),
			// i+2), 0);
			// mChart.invalidate();
			// }
			//
			// Toast.makeText(getApplicationContext(), "valcount: " +
			// mChart.getDataOriginal().getYValCount() + ", valsum: " +
			// mChart.getDataOriginal().getYValueSum(),
			// Toast.LENGTH_SHORT).show();
			//
			break;
		}
		case R.id.actionSave:
		{
			if (mChart.saveToPath("title" + System.currentTimeMillis(), ""))
			{
				Toast.makeText(getApplicationContext(), "Saving SUCCESSFUL!", Toast.LENGTH_SHORT).show();
			}
			else Toast.makeText(getApplicationContext(), "Saving FAILED!", Toast.LENGTH_SHORT).show();

			// mChart.saveToGallery("title"+System.currentTimeMillis())
			break;
		}
		}
		return true;
	}

	private void setData(int count, float range)
	{
		ArrayList<String> xVals = new ArrayList<String>();
		ArrayList<Entry> yVals = new ArrayList<Entry>();
		for (int i = 0; i < count; i++)
		{
			xVals.add((i % 30) + "/" + (i % 12) + "/14");
			yVals.add(new Entry((float) (Math.random() * 4), i));
		}

		// create a dataset and give it a type
		LineDataSet set1 = new LineDataSet(yVals, "DataSet 1");
		set1.setLineWidth(1.5f);
		set1.setCircleSize(4f);
		set1.setCircleColor(Color.parseColor("#fd4634"));
		// create a data object with the datasets
		LineData data = new LineData(xVals, set1);
		// set data
		mChart.setData(data);
	}
}

   

   

版权声明:本文为博主原创文章,未经博主允许不得转载。

MPChartAndroid使用讲解

标签:android   图表 mpchartandroid   

原文地址:http://blog.csdn.net/lcq5211314123/article/details/47112751

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!