MPAndroidChart文件翻譯

weixin_34402408發表於2019-02-19

開始

新增依賴

在第一步,需要將依賴的庫新增到你的專案中

建立View

想要使用 LineChart,BarChart,ScatterChart,CandleStickChart,PieChart,BubbleChart或者RadarChart,需要先在xml中定義

<com.github.mikephil.charting.charts.LineChart
     android:id="@+id/chart"
     android:layout_width="match_parent"
     android:layout_height="match_parent" />

然後在你的Activity或者Fragment中獲取控制元件

LineChart chart = (LineChart) findViewById(R.id.chart);

或者使用程式碼建立,在佈局中新增

LineChart chart = new LineChart(Context);
RelativeLayout rl = (RelativeLayout) findViewById(R.id.relativeLayout);
rl.add(chart);

新增資料

在你擁有了圖表的例項之後,你可以建立資料並新增到圖表中.下面是一個使用折線圖的例子,每一條資料都可以使用Entry這個類來標識x,y座標.
在其他圖表型別中,比如BarChart使用其他的類(比如BarEntry)來達到相同的目的.

新增資料到圖表中,需要將所有的資料都包裹在Entry物件中

YourData[] dataObjects = ...;

List<Entry> entries = new ArrayList<Entry>();

for (YourData data : dataObjects) {
    entries.add(new Entry(data.getValueX(), data.getValueY())); 
}

然後,你需要給你建立的LineDataSet物件新增List<Entry>資料集合,DataSet物件持有資料,這些資料使用者可以自定義樣式.
下面的"Label"用於描述資料的作用,如果圖例開啟的話,還會作為圖例顯示在圖表上

LineDataSet dataSet = new LineDataSet(entries, "Label"); // 新增資料
dataSet.setColor(...);
dataSet.setValueTextColor(...); // 自定義資料樣式

最後一步,你需要把建立好的LineDataSet新增到LineData中,新增完資料,利用Chart的例項去設定資料,並且重新整理一下

LineData lineData = new LineData(dataSet);
chart.setData(lineData);
chart.invalidate(); // 重新整理

圖表的互動

這個庫可以讓你最大限度的通過手勢觸控與圖表互動,並且通過回撥函式獲取反饋

開啟/關閉互動

  • setTouchEnabled(boolean enabled): 允許觸控圖表
  • setDragEnabled(boolean enabled): 允許拖拽圖表
  • setScaleEnabled(boolean enabled): 允許縮放圖表
  • setScaleXEnabled(boolean enabled): 允許以X軸縮放
  • setScaleYEnabled(boolean enabled): 允許以Y軸縮放
  • setPinchZoom(boolean enabled): 如果為true則x和y軸將會聯動縮放,否則就分開縮放
  • setDoubleTapToZoomEnabled(boolean enabled): 若允許則可以雙擊進行縮放

圖表滑動

  • setDragDecelerationEnabled(boolean enabled): 設定為true,圖表在手指觸碰滑動後,會有慣性繼續運動
  • setDragDecelerationFrictionCoef(float coef): 設定一個在[0,1]區間內的滑動係數,越高的值代表減速會越慢,比如設定為0,在手指滑動圖表離開後將會立即停止滑動,1是一個不規範的值,它將會被自動設定為0.9999

手勢操作回撥

如果使用手勢操作圖表,可以使用OnChartGestureListener來監聽回撥

public interface OnChartGestureListener {

    //當手指剛觸控到圖表時觸發,action_down
    void onChartGestureStart(MotionEvent me, ChartTouchListener.ChartGesture lastPerformedGesture);

    //當手指在圖表上操作結束時呼叫,action_up、action_cancel
    void onChartGestureEnd(MotionEvent me, ChartTouchListener.ChartGesture lastPerformedGesture);

    //長按圖表回撥
    public void onChartLongPressed(MotionEvent me);

    //雙擊圖表回撥
    public void onChartDoubleTapped(MotionEvent me);

    //單擊圖表回撥
    public void onChartSingleTapped(MotionEvent me);

    //滑動圖表回撥
    public void onChartFling(MotionEvent me1, MotionEvent me2, float velocityX, float velocityY);

    //縮放圖表回撥
    public void onChartScale(MotionEvent me, float scaleX, float scaleY);

    //拖拽圖表回撥
    public void onChartTranslate(MotionEvent me, float dX, float dY);
}

將你的Chart去設定手勢監聽器就可以實現這些回撥

chart.setOnChartGestureListener(this);

高亮顯示

開啟/關閉高亮

  • setHighlightPerDragEnabled(boolean enabled): 設定為true時,在圖表完全縮小的情況下,拖拽圖表可以高亮,預設為true
  • setHighlightPerTapEnabled(boolean enabled): 設定為false時,圖表將不會因為手勢而高亮,拖拽和程式碼操作依舊可以觸發高亮,預設為true
  • setMaxHighlightDistance(float distanceDp): 設定觸發可以高亮的最遠距離,觸控點離圖表過遠時,將不會觸發高亮

高亮樣式可以由個人自定義

dataSet.setHighlightEnabled(true); // 是否允許高亮
dataSet.setDrawHighlightIndicators(true); // 設定是否有拖拽高亮指示器
dataSet.setHighlightColor(Color.BLACK); // 設定高亮顏色

程式碼高亮資料

  • highlightValue(float x, int dataSetIndex, boolean callListener): 通過給的在dataset中的x位置,去高亮資料.dataSetIndex給-1時,將會禁止一切高亮,布林值的callListener標識是否允許監聽回撥
  • highlightValue(Highlight high, boolean callListener): 通過傳遞來的Highlight物件去高亮資料,hightlight物件傳null時表示不高亮,布林值的callListener標識是否允許監聽回撥
  • highlightValues(Highlight[] highs): 傳入一個Highlight[]陣列以同時高亮多個條目,陣列為空或者null時表示不進行高亮
  • getHighlighted(): 返回一個Highlight[]陣列,裡面包含高亮的條目,x軸位置以及在dataset中的位置

選擇回撥

OnChartValueSelectedListener,通過觸控高亮資料時的回撥

public interface OnChartValueSelectedListener {
    
    //當圖表內的一項被選中時的回撥
    public void onValueSelected(Entry e, Highlight h);
    
    //當沒有選擇項時的回撥
    public void onNothingSelected();
}

Highlight類

Highlight類,通常被用於獲取高亮條目的資訊,或者用來給圖表或者Entry對提供資料用於高亮,Highlight類提供兩個建構函式

 //標準的Highlight建構函式
 public Highlight(float x, int dataSetIndex) { ... }

 //給BarEntry使用的Highlight建構函式
 public Highlight(float x, int dataSetIndex, int stackIndex) { ... }

一個通過程式碼方式利用Highlight進行高亮的例子

// highlight the entry and x-position 50 in the first (0) DataSet
Highlight highlight = new Highlight(50f, 0); 

chart.highlightValue(highlight, false); // highlight this value, don't call listener

自定義高亮

所有使用者輸入的手勢高亮形式都是由預設的ChartHighlighter類完成的,通過自定義ChartHighlighter類的實現來替換預設的,完成更多的不同的高亮形式
setHighlighter(ChartHighlighter highlighter): 傳入自定義的ChartHighlighter實現類物件來完成高亮樣式的設定

座標軸

座標軸類通過以下部分實現具體的樣式

  • Label 繪製在座標軸旁,包含座標軸的詳細資料
  • axis-line 座標軸線
  • grid-lines 橫向的表格線
  • LimitLines 限制線用於呈現一些特殊的資訊,像邊界、約束等

控制座標軸的哪些部分可以被繪製

  • setEnabled(boolean enabled): 座標軸開關,設定為false時,不論其他設定怎樣都不會再繪製座標軸
  • setDrawLabels(boolean enabled): 座標值開關,設定為false時將不會繪製座標值
  • setDrawAxisLine(boolean enabled): 座標線開關,設定為false時將不會繪製座標線
  • setDrawGridLines(boolean enabled): 表格背景線開關,設定為false時將不會繪製圖表背景上的表格線

定製座標軸的範圍(最小/最大)

  • setAxisMaximum(float max): 設定座標軸的最大值,一旦設定將不會再自動按照提供的值進行計算
  • resetAxisMaximum(): 恢復預設設定,自己設定的最大值將不再生效,仍有提供的資料進行自動計算得到
  • setAxisMinimum(float min): 設定座標軸的最小值,一旦設定將不會再自動按照提供的值進行計算
  • resetAxisMinimum(): 恢復預設設定,自己設定的最小值將不再生效,仍有提供的資料進行自動計算得到
  • setInverted(boolean enabled): 倒置高低值,大值將會在底部出現,小值將會在頂部出現
  • setSpaceTop(float percent): 設定距頂部的間距(佔總軸的範圍的百分比)
  • setSpaceBottom(float percent): 設定距底部的間距(佔總軸的範圍的百分比)
  • setShowOnlyMinMax(boolean enabled): 如果設定為true,將會只顯示最小值和最大值,中間的資料將會忽略掉不顯示(如果不是強制顯示的話)
  • setLabelCount(int count, boolean force): 設定y軸標籤數,這個數字不是固定的除非force設定為true,如果force設定為true會精確繪製座標值標籤數,導致軸上數字不均勻
  • setPosition(YAxisLabelPosition pos): 設定縱軸座標值的繪製位置(圖表內側或者圖表外側 --- INSIDE_CHART or OUTSIDE_CHART)
  • setGranularity(float gran): 設定y軸的最小間距,用於避免縮放到最小時,座標軸上資料相互重疊
  • setGranularityEnabled(boolean enabled): 可以在縮放時限制y軸間距,預設false

定製座標軸樣式

  • setTextColor(int color): 設定座標軸值標籤的顏色
  • setTextSize(float size): 設定座標軸值標籤的字型的大小
  • setTypeface(Typeface tf): 給座標軸值標籤設定一個字型
  • setGridColor(int color): 設定背景表格線的顏色
  • setGridLineWidth(float width): 設定背景表格線的寬度
  • setAxisLineColor(int color): 設定座標軸線的顏色
  • setAxisLineWidth(float width): 設定座標軸線的寬度
  • enableGridDashedLine(float lineLength, float spaceLength, float phase): 讓背景表格線變成虛線模式就像 - - - - - 的樣子,lineLength控制實線長度,spaceLength控制虛線長度,phase控制起始點

對座標軸值進行格式化

可以使用IAxisValueFormatter介面來格式化座標軸資料,使用axis.setValueFormatter(IAxisValueFormatter formatter)設定自己的定製資料格式

限制線

像邊界線和約束線這種用於表示特殊資訊的線我們稱之為限制線,限制線在Y軸上橫向呈現,在X軸上縱向呈現

  • addLimitLine(LimitLine l): 向座標軸上新增一條新的限制線
  • removeLimitLine(LimitLine l): 從座標軸上移除一條限制線
  • setDrawLimitLinesBehindData(boolean enabled): 允許設定限制線和資料標籤的圖層順序,為true的話限制線將繪製在資料的後面,否則繪製在前面,預設為false

限制線顧名思義是給使用者提供格外資訊的一種簡潔、簡單的線

例如,您的圖表可能會顯示使用者的各種血壓測量結果.為了通知使用者,收縮壓超過140毫米汞柱被認為是健康風險,你可以在140新增一個限制線來提供這些資訊

YAxis leftAxis = chart.getAxisLeft();

LimitLine ll = new LimitLine(140f, "健康的血壓線");
ll.setLineColor(Color.RED);
ll.setLineWidth(4f);
ll.setTextColor(Color.BLACK);
ll.setTextSize(12f);
// .. 更多的樣式設定

leftAxis.addLimitLine(ll);

X軸

任何與橫軸有關的資料資訊都存放在X軸中,像折線圖、柱狀圖、網狀圖、蠟燭圖、雷達圖等都有XAxis物件

獲取X軸例項物件使用

XAxis xAxis = chart.getXAxis();

定製座標軸資料

  • setLabelRotationAngle(float angle): 設定X軸標籤資料繪製的角度
  • setPosition(XAxisPosition pos): 設定標籤資料繪製的位置,可以選擇以下的項:TOP,BOTTOM,BOTH_SIDED,TOP_INSIDE or BOTTOM_INSIDE.

示例程式碼

XAxis xAxis = chart.getXAxis();
xAxis.setPosition(XAxisPosition.BOTTOM);
xAxis.setTextSize(10f);
xAxis.setTextColor(Color.RED);
xAxis.setDrawAxisLine(true);
xAxis.setDrawGridLines(false);
// 設定定製的資料格式
xAxis.setValueFormatter(new MyCustomFormatter()); 

Y軸

任何與縱軸有關的資料資訊都存放在Y軸中,像折線圖、柱狀圖、網狀圖、蠟燭圖等都有左右兩個YAxis物件,雷達圖只有一個YAxis物件

獲取YAxis例項物件

YAxis leftAxis = chart.getAxisLeft();
YAxis rightAxis = chart.getAxisRight();

YAxis leftAxis = chart.getAxis(AxisDependency.LEFT);

YAxis yAxis = radarChart.getYAxis(); // 雷達圖獲取YAxis方法

在執行時,可以使用public AxisDependency getAxisDependency()來確定YAxis是圖表的哪一邊的
想要設定效果必須在給圖表設定資料之前

Axis Dependency

預設情況下,所有新增到圖表的資料都和左邊的Y軸資料相對應,沒有進一步設定的情況下右邊的Y軸資料以及樣式比例均與左邊統一,如果你想要設定不同比例的Y軸,你可以通過設定對應的資料來繪製對應的座標軸實現

LineDataSet dataSet = ...; // 獲取dataset
dataSet.setAxisDependency(AxisDependency.RIGHT);

零線

除了網格線與YAxis上的每個值水平並排,還有所謂的零線,它在軸上的零(0)值處繪製,類似於網格線,但可以單獨配置。

  • setDrawZeroLine(boolean enabled): 是否繪製零線
  • setZeroLineWidth(float width): 設定零線寬度
  • setZeroLineColor(int color): 設定零線顏色

零線程式碼示例:

// 資料設定在左邊座標軸
YAxis left = mChart.getAxisLeft();
left.setDrawLabels(false); // 不設定座標軸資料標籤
left.setDrawAxisLine(false); // 不繪製座標軸線
left.setDrawGridLines(false); // 不繪製網格線
left.setDrawZeroLine(true); // 繪製零線
mChart.getAxisRight().setEnabled(false); // 不設定右邊Y軸
3036839-9a4c9fc60fc035dc.png
0line

沒有其他的線(座標軸線、網格線等等)只有一條零線的效果

更多的程式碼示例:

YAxis yAxis = mChart.getAxisLeft();
yAxis.setTypeface(...); // 設定一個不同的字型
yAxis.setTextSize(12f); // 設定字型大小
yAxis.setAxisMinimum(0f); // 設定座標軸從0開始
yAxis.setAxisMaximum(100f); // 設定座標軸最大值為100
yAxis.setTextColor(Color.BLACK); // 設定字型顏色為黑色
yAxis.setValueFormatter(new MyValueFormatter());
yAxis.setGranularity(1f); // 設定間隔為1
yAxis.setLabelCount(6, true); // 設定標籤個數
//... 更多

設定資料

折線圖

如果想要給圖表新增資料需要使用以下方式:

public void setData(ChartData data) { ... }

基類CharData包含在渲染時圖表所需要的所有的資料和資訊
對於每一種資料圖表,都有一個CharData的子類用於給圖表設定資料

在建構函式中,可以使用List<? extends IDataSet>作為資料去顯示,

兩種不同的建構函式

    /** List constructor */
    public LineData(List<ILineDataSet> sets) { ... }

    /** Constructor with one or multiple ILineDataSet objects */
    public LineData(ILineDataSet...) { ... }

一個DataSet物件代表一組圖表中一起的資料,這樣可以在邏輯上分離圖表上的不同組資料.
對於每種型別的圖表,存在允許特定樣式的擴充套件DataSet的不同物件(例如Line DataSet)

舉個例子,如果你想要顯示兩家不同公司上一年季度性的財政收入,推薦使用兩個LineDataSet,每一箇中包含四組資料
那麼如何去設定LineDataSet物件呢

public LineDataSet(List<Entry> entries,String label){...}

可以看到,LineDataSet的建構函式中需要List<Entry>一系列的資料以及用於描述資料資訊的label,
此label還可以進一步在LineData中去找到對應的LineDataSet物件
這些Entry的列表中包含了圖表的所有資料,而Entry類就相當於X、Y座標值的一個包裝類,用於存放一個具體的座標值

public Entry(float x, float y) { ... }

上面的例子,我們第一步可以建立一個用於存放公司收入的Entry的集合

List<Entry> valsComp1 = new ArrayList<Entry>();
List<Entry> valsComp2 = new ArrayList<Entry>();

然後填充資料,確保Entry內的X軸資料是精確的

    Entry c1e1 = new Entry(0f, 100000f); // 一公司第一季度資料
    valsComp1.add(c1e1);
    Entry c1e2 = new Entry(1f, 140000f); // 一公司第二季度資料
    valsComp1.add(c1e2);
    // 繼續新增
    
    Entry c2e1 = new Entry(0f, 130000f); // 二公司第一季度資料
    valsComp2.add(c2e1);
    Entry c2e2 = new Entry(1f, 115000f); // 二公司第二季度資料
    valsComp2.add(c2e2);
    //...

現在我們可以通過這一系列資料去建立LineDataSet物件

    LineDataSet setComp1 = new LineDataSet(valsComp1, "Company 1");
    setComp1.setAxisDependency(AxisDependency.LEFT);
    LineDataSet setComp2 = new LineDataSet(valsComp2, "Company 2");
    setComp2.setAxisDependency(AxisDependency.LEFT);

通過使用setAxisDependency來指定具體資料繪製的軸,然後通過建立IDataSets的List來構成ChartData物件

    // 使用ILineDataSet介面
    List<ILineDataSet> dataSets = new ArrayList<ILineDataSet>();
    dataSets.add(setComp1);
    dataSets.add(setComp2);
    
    LineData data = new LineData(dataSets);
    mLineChart.setData(data);
    mLineChart.invalidate(); // 重新整理

在呼叫invalidate方法重新整理後,資料就會被繪製出來

如果我們想特別定製X軸資料來替換原先的0到3,我們可以使用IAxisValueFormatter介面
這個介面可以讓我們自定義X軸資料顯示樣式
舉個例子,像以下這樣設定資料格式:

// 繪製在X軸上的資料陣列
final String[] quarters = new String[] { "Q1", "Q2", "Q3", "Q4" };

IAxisValueFormatter formatter = new IAxisValueFormatter() {

    @Override
    public String getFormattedValue(float value, AxisBase axis) {
        return quarters[(int) value];
    }

    @Override
    public int getDecimalDigits() {  return 0; }
};

XAxis xAxis = mLineChart.getXAxis();
xAxis.setGranularity(1f); // 最小的間隔設定為1
xAxis.setValueFormatter(formatter);

最後渲染的圖表的樣子


3036839-77d387db7642ca57.png
Formatter

BarChart,ScatterChart,BubbleChart和CandleStickChart的設定資料與LineChart一樣
其中特殊的是BarChart將會在下面進行解釋:

資料排序

如果List<Entry>沒有正確的X軸排列順序,可能導致一些意外的情況
我們可以使用EntryXComparator來進行排序

List<Entry> entries = ...;
Collections.sort(entries, new EntryXComparator());

柱狀圖

柱狀圖的設定資料方式與折線圖類似,最大的不同在於柱狀圖存放資料的BarEntry有一些不同的樣式設定

建立BarDataSet

List<BarEntry> entries = new ArrayList<>();
entries.add(new BarEntry(0f, 30f));
entries.add(new BarEntry(1f, 80f));
entries.add(new BarEntry(2f, 60f));
entries.add(new BarEntry(3f, 50f)); 
                                    // 跳過第五個
entries.add(new BarEntry(5f, 70f));
entries.add(new BarEntry(6f, 60f));

BarDataSet set = new BarDataSet(entries, "BarDataSet");

將資料設定到圖表上

BarData data = new BarData(set);
data.setBarWidth(0.9f); // 設定資料條的寬度
chart.setData(data);
chart.setFitBars(true); // 讓X軸與所有的資料條適配
chart.invalidate(); // 重新整理

當柱狀圖被建立時,每一個條都有1f的寬度,設定為0.9f的寬度後,將會在兩個條各存在0.1f的間隔
設定setFitBars(true)將會讓X軸的範圍很好的適配柱狀圖,而不會出現有哪個條被邊緣線切斷

重新整理後顯示:


3036839-9e46a93a3b62639f.png
barChart

群組柱狀圖

YourData[] group1 = ...;
YourData[] group2 = ...;

List<BarEntry> entriesGroup1 = new ArrayList<>();
List<BarEntry> entriesGroup2 = new ArrayList<>();

// 填充資料
for(int i = 0; i < group1.length; i++) {
    entriesGroup1.add(new BarEntry(i, group1.getValue()));
    entriesGroup2.add(new BarEntry(i, group2.getValue()));
}

//兩組資料
BarDataSet set1 = new BarDataSet(entriesGroup1, "Group 1");
BarDataSet set2 = new BarDataSet(entriesGroup2, "Group 2");

這樣就獲取到兩組資料,現在用這兩組資料去完成群組柱狀圖

float groupSpace = 0.06f; //群組間的間隔
float barSpace = 0.02f; // 每一個柱狀條間隔
float barWidth = 0.45f; // 每一個柱狀條的寬度
// (0.02 + 0.45) * 2 + 0.06 = 1.00 -> 總共合起來還是1f

BarData data = new BarData(set1, set2); //設定組資料
data.setBarWidth(barWidth); // 設定柱狀條寬度
barChart.setData(data);
barChart.groupBars(1980f, groupSpace, barSpace); // 設定組樣式寬度等
barChart.invalidate(); // 重新整理

groupBars(...)對群組資料進行了具體的設定,這個方法的具體引數

public void groupBars(float fromX, float groupSpace, float barSpace) { ... }

fromX標識X軸資料從哪邊開始進行渲染

最後渲染出來為:


3036839-55246414aa77f270.png
group_bar_chart

通過使用setCenterAxisLabels(...)方法可以讓標籤資料正確顯示在群組柱狀條中間

XAxis xAxis = chart.getXAxis();
xAxis.setCenterAxisLabels(true);

疊加柱狀圖

設定與普通的柱狀圖類似,不同的是BarEntry的建構函式使用

public BarEntry(float x, float [] yValues) { ... }

第二個引數是一個疊加的資料值陣列

BarEntry stackedEntry = new BarEntry(0f, new float[] { 10, 20, 30 });

這樣在圖表上顯示高度為10,20,30的三段資料

餅圖

不同於其他的圖形,餅圖的建構函式是這樣的:

public PieEntry(float value, String label) { ... }

第一個引數即是當前所佔區域的大小資料,第二個引數用於描述當前區域的資訊

完整的餅圖的建立

List<PieEntry> entries = new ArrayList<>();

entries.add(new PieEntry(18.5f, "Green"));
entries.add(new PieEntry(26.7f, "Yellow"));
entries.add(new PieEntry(24.0f, "Red"));
entries.add(new PieEntry(30.8f, "Blue"));

PieDataSet set = new PieDataSet(entries, "Election Results");
PieData data = new PieData(set);
pieChart.setData(data);
pieChart.invalidate(); // 重新整理

餅圖沒有X軸,資料的顯示順序由新增順序來定義
渲染完成後:


3036839-51e63082b24483d1.png
pie_chart

設定顏色

在這個小例子中我們有兩組資料用於代表兩個公司季度收入,我們想要設定不同的顏色去區分它們
我們想要:

  • Company1使用四種不同的紅色去標註四個不同的季度資料
  • Company2使用四種不同的綠色去標註四個不同的季度資料
  LineDataSet setComp1 = new LineDataSet(valsComp1, "Company 1");
  setComp1.setColors(new int[] { R.color.red1, R.color.red2, R.color.red3, R.color.red4 }, Context);
  
  LineDataSet setComp2 = new LineDataSet(valsComp2, "Company 2");
  setComp2.setColors(new int[] { R.color.green1, R.color.green2, R.color.green3, R.color.green4 }, Context);

給DataSet設定顏色的方法

  • setColors(int [] colors, Context c): 通過使用 new Int[]{R.color.red,...}的形式給dataset提供顏色資料
  • setColors(int [] colors):通過使用 new Int[]{R.color.red,...}的形式給dataset提供顏色資料,必須確保在呼叫之前顏色都是可用的
  • setColors(ArrayList<Integer> colors): 提供List型別的顏色集合,必須確保在呼叫之前顏色都是可用的
  • setColor(int color): 設定單一的顏色,在內部還是建立陣列並新增這個顏色

當然也可以使用顏色模板

LineDataSet set = new LineDataSet(...);
set.setColors(ColorTemplate.VORDIPLOM_COLORS);

在沒有設定顏色的時候,將會使用預設的顏色

ValueFormatter介面

IValueFormatter介面用於建立自定義格式類來在圖表繪製之前格式資料
使用IValueFormatter,簡單的建立一個類去實現這個介面,並返回你從getFormattedValue(...)方法獲取的資料想要顯示的樣子

建立一個格式化類

public class MyValueFormatter implements IValueFormatter {

    private DecimalFormat mFormat;
    
    public MyValueFormatter() {
        mFormat = new DecimalFormat("###,###,##0.0"); // 使用金融型別的格式
    }
    
    @Override
    public String getFormattedValue(float value, Entry entry, int dataSetIndex, ViewPortHandler viewPortHandler) {
        // 寫下你的程式碼邏輯
        return mFormat.format(value) + " $"; // 比如在資料前新增一個$符
    }
}

給ChartData或者DataSet新增格式化

// 圖表內的資料均使用這種格式
lineData.setValueFormatter(new MyValueFormatter());

// 僅在該DataSet內使用這種格式
lineDataSet.setValueFormatter(new MyValueFormatter());

預置格式類

  • LargeValueFormatter: 用於格式化大資料 超過"1,000"的值將會被格式化為"1K",超過"1,000,000"將會變成"1M",超過"1,000,000,000"將會變成"1M",並且像one trillion這樣的資料將會被格式成"1t".
  • PercentFormatter: 使用百分比修飾資料在餅圖中很有用. 50 -> 50.0 %
  • StackedValueFormatter: 用於層疊柱狀圖中,用於格式資料是否是顯示多層資料還是僅僅只顯示最頂部的資料

AxisValueFormatter介面

建立一個格式化類

建立一個類實現IAxisValueFormatter介面,用於格式化座標軸上的值

public class MyYAxisValueFormatter implements IAxisValueFormatter {

    private DecimalFormat mFormat;

    public MyAxisValueFormatter() {
        //格式化數字
        mFormat = new DecimalFormat("###,###,##0.0");
    }

    @Override
    public String getFormattedValue(float value, AxisBase axis) {
        // value引數標識在座標軸上的位置或者說是資料值,axis標識是哪個座標軸
        return mFormat.format(value) + " $";
    }
    
    /** 只有為數字時返回 其餘返回0*/
    @Override
    public int getDecimalDigits() { return 1; }
}

下面的例子展示怎麼把陣列中的資料展示到座標軸上去

public class MyXAxisValueFormatter implements IAxisValueFormatter {

    private String[] mValues;

    public MyXAxisValueFormatter(String[] values) {
        this.mValues = values;
    }

    @Override
    public String getFormattedValue(float value, AxisBase axis) {
        return mValues[(int) value];
    }
    
    @Override
    public int getDecimalDigits() { return 0; }
}

設定格式化類

在建立好格式化類之後,簡單去運用它

YAxis left = chart.getAxisLeft();
left.setValueFormatter(new MyYAxisValueFormatter());
String[] values = new String[] { ... };
XAxis xAxis = chart.getXAxis();
xAxis.setValueFormatter(new MyXAxisValueFormatter(values));

設定完之後,圖表用格式化類來具體指定值來代替預設的座標軸的最小值和最大值範圍

限制間隔

如果使用上面的陣列格式化座標軸標籤值,可以使用一下的程式碼去限制標籤間的間隔

axis.setGranularity(1f);

這將可以預防座標軸繪製重疊的資料,因為在縮放到一定的程度時,圖表將會停止計算更小的標籤範圍

預置格式化類

  • LargeValueFormatter: 用於格式化大資料 超過"1,000"的值將會被格式化為"1K",超過"1,000,000"將會變成"1M",超過"1,000,000,000"將會變成"1M",並且像one trillion這樣的資料將會被格式成"1t".
  • PercentFormatter: 使用百分比修飾資料在餅圖中很有用. 50 -> 50.0 %

通用圖表和樣式設定

重新整理

  • invalidate(): 使用這個方法重新整理圖表將會重新繪製,更改圖表後想要生效必須呼叫
  • notifyDataSetChanged(): 讓圖表知道依賴的資料發生變化時呼叫,呼叫後圖表會重新計算,在使用動態資料時很有用

日誌

  • setLogEnabled(boolean enabled): 設定為true時將會列印日誌資訊,但是開啟將會影響效能所以不是必要的話請關閉

大體的樣式設定

下面是一些可以直接在Chart上使用的樣式設定方法

  • setBackgroundColor(int color): 設定整個圖表的背景顏色,也可以在.xml佈局檔案中進行設定
  • setDescription(String desc): 在圖表的右下角設定一個圖表描述標註
  • setDescriptionColor(int color): 設定圖表描述的字型顏色
  • setDescriptionPosition(float x, float y): 設定圖表描述的顯示位置
  • setDescriptionTypeface(Typeface t): 設定圖表描述的字型樣式
  • setDescriptionTextSize(float size): 設定圖表描述的字型大小,通過畫素值設定或者使用min(6f)、max(16f)
  • setNoDataText(String text): 如果圖表沒有資料時顯示的標註
  • setDrawGridBackground(boolean enabled): 如果開啟的話,圖表繪製區域背後的矩形區域將會被繪製
  • setGridBackgroundColor(int color): 設定背景矩形的顏色
  • setDrawBorders(boolean enabled): 設定是否繪製圖表邊框
  • setBorderColor(int color): 設定邊框顏色
  • setBorderWidth(float width): 設定邊框線寬,單位為dp
  • setMaxVisibleValueCount(int count): 設定圖表可見資料標籤的最大個數,只有當setDrawValues()開啟時生效

具體的圖表和樣式設定

Line-, Bar-, Scatter-, Candle- & BubbleChart

  • setAutoScaleMinMaxEnabled(boolean enabled): 根據最大最小資料值圖表進行自動縮放,在展示金融型別的資料時很有趣,預設關閉
  • setKeepPositionOnRotation(boolean enabled): 設定在轉變方向時(橫屏豎屏),圖表的縮放滾動不發生改變,預設關閉

BarChart

  • setDrawValueAboveBar(boolean enabled): 設定為true時,資料將會被渲染在資料條上方,而不是在頂部的下方顯示
  • setDrawBarShadow(boolean enabled): 設定為true時,將會在資料條背後根據最大值繪製陰影,但是開啟將會降低大概40%的效能
  • setDrawValuesForWholeStack(boolean enabled): 如果設定為true,堆疊條的所有值都會單獨繪製,而不僅僅是繪製它們的總和。
  • setDrawHighlightArrow(boolean enabled): 設定為true時將會在資料高亮時,在資料條上方高亮繪製箭頭

PieChart

  • setDrawSliceText(boolean enabled): 設定為true,將會在餅圖片內繪製文字
  • setUsePercentValues(boolean enabled): 當開啟時,將不會使用原來的資料值,而是百分比格式過得到的百分比資料
  • setCenterText(SpannableString text): 設定為true時文字將會在圖表中間繪製,過長的文字將會被自動縮略以免繪製到餅圖片上
  • setCenterTextRadiusPercent(float percent): 設定中心文字邊界框的矩形半徑,作為餅圖孔的百分比,預設值1.f(100%)
  • setHoleRadius(float percent): 以最大半徑的百分比(最大半徑=整個圖表的半徑)來設定餅圖中心的孔半徑,預設為50%
  • setTransparentCircleRadius(float percent): 設定餅圖中孔旁邊的透明圓的半徑,以最大半徑的百分比表示(最大半徑=整個圖表的半徑),預設為55%->預設情況下比中心孔大5%
  • setTransparentCircleColor(int color): 設定透明圓的顏色
  • setTransparentCircleAlpha(int alpha): 設定透明圓的透明度
  • setMaxAngle(float maxangle): 設定餅圖的角度. 360f意味著是一個整圓的餅圖,180f就是一個半圓的餅圖.預設值360f

RadarChart

  • setSkipWebLineCount(int count): 允許跳過繪製來自圖表中心的網路線,線上特別多的情況下很有用

圖例

圖例通常有一個標識和一字串組成,標識為代表該資料的DataSet的顏色決定,字串是DataSet的描述

獲取圖例物件

Legend legend = chart.getLegend();
  • setEnabled(boolean enabled): 設定圖例是否被繪製

設定圖例的樣式

  • setTextColor(int color): 設定圖例上的字型顏色
  • setTextSize(float size): 設定圖例字型大小
  • setTypeface(Typeface tf): 設定圖例字型

大小

  • setWordWrapEnabled(boolean enabled): 如果啟用,圖例的內容將不會剪下到圖表邊界外,而是建立一個新的線條即換行.請注意,這會降低效能,僅適用於圖表下面的圖例
  • setMaxSizePercent(float maxSize): 設定圖表相對於View的最大相對大小,預設為0.95即95%

自定義圖例

  • setPosition(LegendPosition pos): 設定圖例要顯示的位置. 可以設定這些值:RIGHT_OF_CHART,RIGHT_OF_CHART_CENTER,RIGHT_OF_CHART_INSIDE,BELOW_CHART_LEFT,BELOW_CHART_RIGHT,BELOW_CHART_CENTER or PIECHART_CENTER(只有餅圖有)等等更多
  • setForm(LegendForm shape): 設定圖例顯示的樣式可以選擇SQUARE(方形圖例),CIRCLE(圓形圖例) or LINE(線型圖例).
  • setFormSize(float size): 設定圖例大小
  • setXEntrySpace(float space): 設定如果在X軸上的圖例的間距
  • setYEntrySpace(float space): 設定如果在Y軸上的圖例的間距
  • setFormToTextSpace(float space): 設定圖例上圖示和文字之間的間距

設定自定義的標籤

  • setCustom(int[] colors, String[] labels): 自定義標籤顏色和文字內容,兩個陣列的大小必須相等
  • resetCustom():將會重置圖例標籤,根據預設的自動計算得到預設的圖例標籤
  • setExtra(int[] colors, String[] labels): 給預設顯示的圖例增加新的內容,如果預設內容已經計算完畢,需要呼叫notifyDataSetChanged()來生效

例子

    Legend l = chart.getLegend();
    l.setFormSize(10f); 
    l.setForm(LegendForm.CIRCLE); 
    l.setPosition(LegendPosition.BELOW_CHART_LEFT);
    l.setTypeface(...);
    l.setTextSize(12f);
    l.setTextColor(Color.BLACK);
    l.setXEntrySpace(5f); 
    l.setYEntrySpace(5f); 

    l.setCustom(ColorTemplate.VORDIPLOM_COLORS, new String[] { "Set1", "Set2", "Set3", "Set4", "Set5" });

    // and many more...

動態實時資料

MPAndroidChart並不支援實時資料,但是為了向圖表新增新資料或動態刪除資料,有各種方法可以將Entry物件新增到已有的DataSet物件或從已有的ChartData物件中刪除DataSet物件

動態新增刪除資料

Class DataSet(以及所有子類):

  • addEntry(Entry e): 向DataSet中新增一個Entry物件

Class ChartData(以及所有子類):

  • addEntry(Entry e, int dataSetIndex): 將Entry物件新增到內部的某一個DataSet(由dataSetIndex決定)中去
  • addDataSet(DataSet d): 新增一個DataSet到ChartData中去

同樣也有刪除資料的方法

Class DataSet(以及所有子類):

  • public boolean removeFirst(): 刪除內部的第一個Entry對,刪除成功返回true,失敗返回false
  • public boolean removeLast(): 刪除內部的最後一個Entry對,刪除成功返回true,失敗返回false
  • public boolean removeEntry(Entry e): 刪除指定的一個Entry對(傳入這個Entry物件),刪除成功返回true,失敗返回false
  • public boolean removeEntry(int xIndex): 刪除指定的一個Entry對(傳入這個Entry物件的位置索引),刪除成功返回true,失敗返回false

Class ChartData(以及所有子類):

  • public boolean removeEntry(Entry e, int dataSetIndex): 刪除內部某一個DataSet(由dataSetIndex決定)的第一個Entry對,刪除成功返回true,失敗返回false
  • public boolean removeEntry(int xIndex, int dataSetIndex): 刪除內部某一個DataSet(由dataSetIndex決定)的一個Entry對(傳入這個Entry物件的位置索引),刪除成功返回true,失敗返回false
  • public boolean removeDataSet(DataSet d): 刪除指定的一個dataSet(傳入這個dataSet物件),刪除成功返回true,失敗返回false
  • public boolean removeDataSet(int index): 刪除指定的一個dataSet(傳入這個dataSet物件位置索引),刪除成功返回true,失敗返回false

一定要記住

在動態刪除或者新增資料之後,一定要在呼叫invalidate()重新整理頁面之前呼叫notifyDataSetChanged()方法更新資料

 // EXAMPLE 1
 // add entries to the "data" object
 exampleData.addEntry(...);
 chart.notifyDataSetChanged(); // 讓Chart知道資料發生變化
 chart.invalidate(); // 重新整理

 // EXAMPLE 2
 // add entries to "dataSet" object
 dataSet.addEntry(...);
 exampleData.notifyDataChanged(); // 讓DataSet知道資料發生變化
 chart.notifyDataSetChanged(); // 讓Chart知道資料發生變化
 chart.invalidate(); // 重新整理

調整視窗顯示

這些方法只適用於LineChart,BarChart,ScatterChart和CandleStickChart

規定哪些可以顯示

  • setVisibleXRangeMaximum(float maxXRange): 設定視窗X軸顯示的範圍最大值,如果設定為10,那麼超過10個資料的值在不滾動的情況下將不會顯示
  • setVisibleXRangeMinimum(float minXRange): 設定視窗X軸顯示的範圍最小值,如果設定為10,那麼在縮放的時候始終將有10個資料顯示在圖表上
  • setVisibleYRangeMaximum(float maxYRange, AxisDependency axis): 設定視窗Y軸顯示的範圍最大值,如果設定為10,那麼超過10個資料的值在不滾動的情況下將不會顯示,設定存在在哪一邊的Y軸
  • setViewPortOffsets(float left, float top, float right, float bottom): 為當前ViewPort設定自定義偏移量(實際圖表視窗兩側的偏移量),設定這將阻止圖表自動計算偏移量, 使用resetViewPortOffsets()來取消這個. 只有當你知道你在做什麼時才使用這個方法
  • resetViewPortOffsets(): 重置自定義偏移量,重新讓圖表自己進行計算
  • setExtraOffsets(float left, float top, float right, float bottom): 在自動計算的偏移量基礎上再加上額外的偏移量,但這個偏移量不會影響自動計算出來的

移動View

  • fitScreen(): 重置所有的移動和縮放,並讓圖表完全適配它的邊界(完全縮小).
  • moveViewToX(float xValue): 將當前視窗的左側(邊緣)移動到指定的x值。.
  • moveViewToY(float yValue, AxisDependency axis): 將根據左邊或者右邊Y軸選中的資料使視窗將該值處於視窗中間
  • moveViewTo(float xValue, float yValue, AxisDependency axis): 上面兩個方法的集合,就是將視窗焦點聚集到選中的某一點(視窗左邊線在點上)
  • centerViewTo(float xValue, float yValue, AxisDependency axis): 上面兩個方法的集合,就是將視窗焦點聚集到選中的某一點(視窗中心線在點上)

使用動畫移動View

  • moveViewToAnimated(float xValue, float yValue, AxisDependency axis, long duration): 使用動畫效果將左邊緣移至所要到的點
  • centerViewToAnimated(float xValue, float yValue, AxisDependency axis, long duration): 使用動畫效果將中心移至所要到的點

所有的moveViewTo類似的方法都會自動呼叫invalidate方法去重新整理頁面,不需要手動去呼叫

縮放(以程式碼方式)

  • zoomIn(): 以1.4f的縮放比係數放大檢視中心焦點
  • zoomOut(): 從檢視中心焦點以0.7f的縮放比係數縮小檢視
  • zoom(float scaleX, float scaleY, float x, float y): 自定義縮放比,自定義縮放中心,記住 1f縮放值等於沒有縮放 0到1之間為縮小操作,1以上為放大操作
  • zoom(float scaleX, float scaleY, float xValue, float yValue, AxisDependency axis): 和上面的方法一樣,增加了指定哪一邊的Y軸

縮放動畫

  • zoomAndCenterAnimated(float scaleX, float scaleY, float xValue, float yValue, AxisDependency axis, long duration):使用動畫進行具體縮放比的縮放操作

例子:

chart.setData(...);

// 開始設定視窗
chart.setVisibleXRangeMaximum(20); 
chart.moveViewToX(10);

動畫

所有的圖表都提供了動畫以供操作使用

有三種不同的動畫存在

  • animateX(int durationMillis): 橫向變換時的動畫,設定動畫時長
  • animateY(int durationMillis): 縱向變換時的動畫,設定動畫時長
  • animateXY(int xDuration, int yDuration): 橫向縱向動畫合集,分別設定動畫時長
mChart.animateX(3000); // animate horizontal 3000 milliseconds

mChart.animateY(3000); // animate vertical 3000 milliseconds

mChart.animateXY(3000, 3000); // animate horizontal and vertical 3000 milliseconds

平緩動畫效果

你可以從Easing.EasingOption中選擇想要的預置平緩動畫效果

public enum EasingOption {
      Linear,
      EaseInQuad,
      EaseOutQuad,
      EaseInOutQuad,
      EaseInCubic,
      EaseOutCubic,
      EaseInOutCubic,
      EaseInQuart,
      EaseOutQuart,
      EaseInOutQuart,
      EaseInSine,
      EaseOutSine,
      EaseInOutSine,
      EaseInExpo,
      EaseOutExpo,
      EaseInOutExpo,
      EaseInCirc,
      EaseOutCirc,
      EaseInOutCirc,
      EaseInElastic,
      EaseOutElastic,
      EaseInOutElastic,
      EaseInBack,
      EaseOutBack,
      EaseInOutBack,
      EaseInBounce,
      EaseOutBounce,
      EaseInOutBounce,
}

有兩種設定平緩動畫效果的方法

  • 直接使用預設(所有Android版本均可使用)
public void animateY(int durationmillis, Easing.EasingOption option);

例如呼叫時就將動畫效果設定進去

mChart.animateY(3000, Easing.EasingOption.EaseOutBack); 
  • 自定義平滑效果(僅支援Android3.0以上版本)
public void animateY(int durationmillis, EasingFunction function); 

建立一個類去實現EasingFunction介面,在該類中實現自己的邏輯

/**
 * Interface for creating custom made easing functions. 
 */
 public interface EasingFunction {
    /**
     * Called everytime the animation is updated.
     * @param input - the time passed since the animation started (value between 0 and 1)
     */
     public float getInterpolation(float input);
 }

呼叫的時候(在Android3.0以下的版本中將會Crash掉)

mChart.animateY(3000, new MyEasingFunction()); 

IMaker介面(圖表資料標註介面)

IMarker介面是你能夠在建立自定義的標註樣式去顯示你圖表中高亮的資料
IMarker定義的像這樣:

public interface IMarker {

    /**
     * @return The desired (general) offset you wish the IMarker to have on the x- and y-axis.
     *         By returning x: -(width / 2) you will center the IMarker horizontally.
     *         By returning y: -(height / 2) you will center the IMarker vertically.
     */
    MPPointF getOffset();

    /**
     * @return The offset for drawing at the specific `point`. This allows conditional adjusting of the Marker position.
     *         If you have no adjustments to make, return getOffset().
     *
     * @param posX This is the X position at which the marker wants to be drawn.
     *             You can adjust the offset conditionally based on this argument.
     * @param posY This is the X position at which the marker wants to be drawn.
     *             You can adjust the offset conditionally based on this argument.
     */
    MPPointF getOffsetForDrawingAtPos(float posX, float posY);

    /**
     * 重新整理方法
     *
     * @param e         The Entry the IMarker belongs to. This can also be any subclass of Entry, like BarEntry or
     *                  CandleEntry, simply cast it at runtime.
     * @param highlight The highlight object contains information about the highlighted value such as it's dataset-index, the
     *                  selected range or stack-index (only stacked bar entries).
     */
    void refreshContent(Entry e, Highlight highlight);

    /**
     * 使用傳遞來的Canvas物件在指定位置繪製對應的標註
     *
     * @param canvas
     * @param posX
     * @param posY
     */
    void draw(Canvas canvas, float posX, float posY);
}

建立一個標註View

你需要建立一個類去實現IMarker介面

public class YourMarkerView implements IMarker { ... }

根據你自己的需要去實現你所要實現的方法

下面例子的這種方法更簡單,不需要實現IMarker介面提供的所有方法
只有特定的方法可以被覆蓋和定製,最重要的是重寫refreshContent方法來調整由標記繪製的資料

public class YourMarkerView extends MarkerView {

    private TextView tvContent;

    public MyMarkerView(Context context, int layoutResource) {
        super(context, layoutResource);

        // find your layout components
        tvContent = (TextView) findViewById(R.id.tvContent);
    }

    // callbacks everytime the MarkerView is redrawn, can be used to update the
    // content (user-interface)
    @Override
    public void refreshContent(Entry e, Highlight highlight) {

        tvContent.setText("" + e.getY());

        // this will perform necessary layouting
        super.refreshContent(e, highlight);
    }

    private MPPointF mOffset; 

    @Override
    public MPPointF getOffset() {

        if(mOffset == null) {
           // center the marker horizontally and vertically
           mOffset = new MPPointF(-(getWidth() / 2), -getHeight());
        }

        return mOffset;
    }
}

獲取和設定標註物件

想要在圖表中使用你設定好的marker,使用setMarker方法

IMarker marker = new YourMarkerView();
chart.setMarker(marker);

獲取一個已經存在的marker,使用getMarker()方法

IMarker marker = chart.getMarker();

預置的標註

  • MarkerView: 允許載入一個layout去展示對應的標註,繼承這個類並重寫refreshContent(...)方法來使用標註資料
  • MarkerImage: 允許載入一張圖片在標註上顯示對應的圖片,繼承這個類並重寫refreshContent(...)方法來使用標註資料

圖表資料類

ChartData類是所有圖表資料類的基類

public class LineData extends ChartData { ...

下面的是已經被實現且在子類中可以使用的方法

資料樣式

  • setValueTextColor(int color): 設定資料顏色
  • setValueTextColors(List colors): 設定資料顏色(傳入顏色陣列)
  • setValueTextSize(float size): 設定資料字型大小
  • setValueTypeface(Typeface tf): 設定資料字型
  • setValueFormatter(ValueFormatter f): 設定資料格式化類
  • setDrawValues(boolean enabled): 控制是否繪製資料值

獲取資料

  • getDataSetByIndex(int index): 根據索引值獲取DataSet
  • contains(Entry entry): 檢視是否包含某個具體的Entry對,對效能損耗嚴重
  • contains(T dataSet): 檢視是否包含某個DataSet

清空資料

  • clearValues(): 清除所DataSet資料和依賴的Entry對資料,但不會刪除X軸上的座標軸資料

高亮

  • setHighlightEnabled(boolean enabled): 設定是否允許高亮.
  • setDrawVerticalHighlightIndicator(boolean enabled): 是否繪製縱向高亮指示線
  • setDrawHorizontalHighlightIndicator(boolean enabled): 是否繪製橫向高亮指示線

動態資料

  • notifyDataChanged(): 讓資料類知道資料發生了變化

ChartData的子類

BarData

  • setGroupSpace(float percent): 設定一組資料間的間距.100是一個資料條的長度,預設80
  • isGrouped(): 判斷該柱狀圖是不是群組柱狀圖

ScatterData

  • getGreatestShapeSize(): 通過內部的資料查詢最大的Shape值.

PieData

  • getDataSet(): 獲取DataSet,PieData不能擁有多個DataSet
  • setDataSet(PieDataSet set): 設定DataSet

BubbleData

  • setHighlightCircleWidth(float width): 設定高亮圈寬度

DataSet資料類

DataSet資料類用法與ChartData幾乎一模一樣

子類

Line-, Bar-, Scatter-, Bubble- & CandleDataSet

  • setHighLightColor(int color): 設定高亮顏色

Line-, Bar-, Scatter-, Candle- & RadarDataSet

  • setDrawHighlightIndicators(boolean enabled): 控制是否繪製高亮指示線
  • setHighlightLineWidth(float width): 設定高亮指示線寬度

Line- & RadarDataSet

  • setFillColor(int color): 設定填充顏色
  • setFillAlpha(int alpha): 設定填充透明度
  • setFillDrawable(Drawable d): 選擇一個Drawable去填充
  • setDrawFilled(boolean filled): 開啟之後將會完全填充繪製,而不是僅僅只有一條線,關閉這項將有效能上的提升,小於Android4.3無法使用,預設關閉
  • setLineWidth(float width): 設定資料線寬度

LineDataSet

  • setCircleRadius(float size): 設定圓形指示器的圓弧度,預設值4f
  • setDrawCircles(boolean enabled):設定是否繪製圓形指示器,預設true
  • setDrawCubic(boolean enabled): 開啟之後資料線將顯示成立體模式,對效能有影響 預設關閉
  • setCubicIntensity(float intensity): 設定立體強度 最大值為1f, 最小0.05f,預設0.2f
  • setCircleColor(int color): 設定圓形指示器的顏色
  • setCircleColors(List colors): 設定圓形指示器顏色
  • setCircleColorHole(int color): 設定圓形指示器內部圓的顏色
  • setDrawCircleHole(boolean enabled): 設定是否繪製圓形指示器內部圓
  • enableDashedLine(float lineLength, float spaceLength, float phase): 設定使用虛線資料線

BarDataSet

  • setBarSpacePercent(float percent): 設定條形圖間距百分比
  • setBarShadowColor(int color): 設定條形圖背景陰影顏色
  • setHighLightAlpha(int alpha): 設定條形圖背景高亮指示器的透明度,最小0(完全透明),最大255(完全顯示).
  • setStackLabels(String[] labels): 給層疊條形圖設定多個標籤值

ScatterDataSet

  • setScatterShapeSize(float size): 設定形狀大小
  • setScatterShape(ScatterShape shape): 設定形狀樣式

CandleDataSet

  • setBodySpace(float space): 設定左右兩個蠟燭圖的間距,預設0.1f(10%),最大0.45f,最小0f
  • setShadowWidth(float width): 設定蠟燭陰影線的寬度,預設3f.
  • setShadowColor(int color): 設定陰影顏色.
  • setDecreasingColor(int color): 當開盤比收盤資料大時,使用該顏色顯示.
  • setIncreasingColor(int color): 當開盤比收盤資料小時,使用該顏色顯示.
  • setDecreasingPaintStyle(Paint.Style style): 當開盤比收盤資料大時,使用該樣式繪製(填充或者描邊).
  • setIncreasingPaintStyle(Paint.Style style): 當開盤比收盤資料小時,使用該樣式繪製(填充或者描邊).

BubbleDataSet

  • setHighlightCircleWidth(float width): 設定高亮圈的寬度

PieDataSet

  • setSliceSpace(float degrees): 設定分開的餅圖兩片間的間距,預設:0沒有間距,最大20,最小0
  • setSelectionShift(float shift): 設定選中的餅圖片浮動離開中心點的距離,預設12f

視窗控制器

初始化

通過以下方式來獲取視窗Handler例項

ViewPortHandler handler = chart.getViewPortHandler();

縮放和位移

  • getScaleX(): 獲取X軸縮放等級.
  • getScaleY(): 獲取Y軸縮放等級.
  • getTransX(): 獲取X軸上的位移量.
  • getTransY(): 獲取Y軸上的位移量.

圖表尺寸和內容

  • getChartWidth(): 獲取圖表寬度
  • getChartHeight(): 獲取圖表高度
  • getContentRect(): 返回圖表內容所在的矩形RectF物件.

FillFormatter介面

新建一個類實現FillFormatter介面

並重寫下面這個方法

public float getFillLinePosition(LineDataSet dataSet, LineDataProvider provider)

可以實現單個的DataSet的實現在哪個位置停止繪製

public class MyCustomFillFormatter implements FillFormatter {

    @Override
    public float getFillLinePosition(LineDataSet dataSet, LineDataProvider dataProvider) {

        float myDesiredFillPosition = ...;
        // put your logic here...

        return myDesiredFillPosition;
    }
}

把格式化新增到圖表中

lineDataSet.setFillFormatter(new MyCustomFillFormatter());

預設的實現---->DefaultFillFormatter.

相關文章