MPAndroidChart開源圖表庫（二）之折線圖

標籤：mpandroidchart

承接上一篇文章，請參考 http://blog.csdn.net/shineflowers/article/details/44701645

1. 將mpandroidchartlibrary-2-0-8.jar包copy到項目的libs中

2. 定義xml檔案

3.  主要Java邏輯代碼如下，注釋已經都添加上了。

<span style="font-family:SimSun;font-size:14px;">package com.example.mpandroidlinechart;import java.util.ArrayList;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.data.Entry;import com.github.mikephil.charting.data.LineData;import com.github.mikephil.charting.data.LineDataSet;import android.support.v7.app.ActionBarActivity;import android.graphics.Color;import android.graphics.Typeface;import android.os.Bundle;public class MainActivity extends ActionBarActivity {private LineChart mLineChart;private Typeface mTf;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mLineChart = (LineChart) findViewById(R.id.spread_line_chart);mTf = Typeface.createFromAsset(getAssets(), "OpenSans-Bold.ttf");LineData mLineData = getLineData(36, 100);showChart(mLineChart, mLineData, Color.rgb(114, 188, 223));}// 設定顯示的樣式private void showChart(LineChart lineChart, LineData lineData, int color) {    lineChart.setDrawBorders(false);  //是否在折線圖上添加邊框    // no description text    lineChart.setDescription("折線圖");// 資料描述    // 如果沒有資料的時候，會顯示這個，類似listview的emtpyview    lineChart.setNoDataTextDescription("You need to provide data for the chart.");        // enable / disable grid background    lineChart.setDrawGridBackground(false); // 是否顯示表格顏色    lineChart.setGridBackgroundColor(Color.WHITE & 0x70FFFFFF); // 表格的的顏色，在這裡是是給顏色設定一個透明度    // enable touch gestures    lineChart.setTouchEnabled(true); // 設定是否可以觸摸    // enable scaling and dragging    lineChart.setDragEnabled(true);// 是否可以拖拽    lineChart.setScaleEnabled(true);// 是否可以縮放    // if disabled, scaling can be done on x- and y-axis separately    lineChart.setPinchZoom(false);//     lineChart.setBackgroundColor(color);// 設定背景    // add data    lineChart.setData(lineData); // 設定資料    // get the legend (only possible after setting data)    Legend mLegend = lineChart.getLegend(); // 設定比例表徵圖示，就是那個一組y的value的    // modify the legend ...    // mLegend.setPosition(LegendPosition.LEFT_OF_CHART);    mLegend.setForm(LegendForm.CIRCLE);// 樣式    mLegend.setFormSize(6f);// 字型    mLegend.setTextColor(Color.WHITE);// 顏色    mLegend.setTypeface(mTf);    mLegend.setTypeface(mTf);// 字型    lineChart.animateX(2500); // 立即執行的動畫,x軸  }    // 產生一個資料，private LineData getLineData(int count, float range) {    ArrayList<String> xValues = new ArrayList<String>();    for (int i = 0; i < count; i++) {        // x軸顯示的資料，這裡預設使用數字下標顯示        xValues.add("" + i);    }    // y軸的資料    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(1.75f); // 線寬    lineDataSet.setCircleSize(3f);// 顯示的圓形大小    lineDataSet.setColor(Color.WHITE);// 顯示顏色    lineDataSet.setCircleColor(Color.WHITE);// 圓形的顏色    lineDataSet.setHighLightColor(Color.WHITE); // 高亮的線的顏色    ArrayList<LineDataSet> lineDataSets = new ArrayList<LineDataSet>();    lineDataSets.add(lineDataSet); // add the datasets    // create a data object with the datasets    LineData lineData = new LineData(xValues, lineDataSets);    return lineData;}}</span>

如下;

MPAndroidChart開源圖表庫（二）之折線圖