Android笔记:MPAndroidChart使用

网友投稿 942 2022-05-30

Gradle

Project level build.gradle(在project的build.gradle中添加依赖)

1

allprojects { repositories { maven { url 'https://jitpack.io' } } }

1

2

3

4

5

App level build.gradle(在app的build.gradle中添加依赖)

1

dependencies { implementation 'com.github.PhilJay:MPAndroidChart:v3.0.3' }

1

2

3

二、layout布局,我这里实现了三个图形,可以根据自己的需要,添加图形控件

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

三、实现代码

图形横纵坐标默认为float形式,如果想展示文字形式,需要自定义适配器。自定义适配器会在“四”中列出

public class FifteenActivity extends AppCompatActivity implements OnChartValueSelectedListener { private String[] mMonths = new String[]{ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec"}; private String[] mParties = new String[]{ "Party A", "Party B", "Party C", "Party D", "Party E", "Party F", "Party G", "Party H", "Party I", "Party J", "Party K", "Party L", "Party M", "Party N", "Party O", "Party P", "Party Q", "Party R", "Party S", "Party T", "Party U", "Party V", "Party W", "Party X", "Party Y", "Party Z" }; private Typeface mTfRegular; private Typeface mTfLight; protected BarChart mChart; private HorizontalBarChart hBarChart; private LineChart lineChart; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_fifteen_layout); mTfRegular = Typeface.createFromAsset(getAssets(), "OpenSans-Regular.ttf"); mTfLight = Typeface.createFromAsset(getAssets(), "OpenSans-Light.ttf"); mChart = findViewById(R.id.chart1); hBarChart = findViewById(R.id.hBarChart); lineChart = findViewById(R.id.lineChart); initBarChart(); initHBarChart(); initLineChart(); } /** * 初始化柱形图控件属性 */ private void initBarChart() { mChart.setOnChartValueSelectedListener(this); mChart.setDrawBarShadow(false); mChart.setDrawValueAboveBar(true); mChart.getDescription().setEnabled(false); // if more than 60 entries are displayed in the chart, no values will be // drawn mChart.setMaxVisibleValueCount(60); // scaling can now only be done on x- and y-axis separately mChart.setPinchZoom(false); mChart.setDrawGridBackground(false); // IAxisValueFormatter xAxisFormatter = new DayAxisValueFormatter(mChart); //自定义坐标轴适配器,配置在X轴,xAxis.setValueFormatter(xAxisFormatter); IAxisValueFormatter xAxisFormatter = new XAxisValueFormatter(); XAxis xAxis = mChart.getXAxis(); xAxis.setPosition(XAxis.XAxisPosition.BOTTOM); xAxis.setTypeface(mTfLight);//可以去掉,没什么用 xAxis.setDrawAxisLine(false); xAxis.setGranularity(1f); xAxis.setValueFormatter(xAxisFormatter); //自定义坐标轴适配器,配置在Y轴。leftAxis.setValueFormatter(custom); IAxisValueFormatter custom = new MyAxisValueFormatter(); //设置限制临界线 LimitLine limitLine = new LimitLine(3f, "临界点"); limitLine.setLineColor(Color.GREEN); limitLine.setLineWidth(1f); limitLine.setTextColor(Color.GREEN); //获取到图形左边的Y轴 YAxis leftAxis = mChart.getAxisLeft(); leftAxis.addLimitLine(limitLine); leftAxis.setTypeface(mTfLight);//可以去掉,没什么用 leftAxis.setLabelCount(8, false); leftAxis.setValueFormatter(custom); leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART); leftAxis.setSpaceTop(15f); leftAxis.setAxisMinimum(0f); //获取到图形右边的Y轴,并设置为不显示 mChart.getAxisRight().setEnabled(false); //图例设置 Legend legend = mChart.getLegend(); legend.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM); legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT); legend.setOrientation(Legend.LegendOrientation.HORIZONTAL); legend.setDrawInside(false); legend.setForm(Legend.LegendForm.SQUARE); legend.setFormSize(9f); legend.setTextSize(11f); legend.setXEntrySpace(4f); //如果点击柱形图,会弹出pop提示框.XYMarkerView为自定义弹出框 XYMarkerView mv = new XYMarkerView(this, xAxisFormatter); mv.setChartView(mChart); mChart.setMarker(mv); setBarChartData(); } /** * 初始化水平柱形图图控件属性 */ private void initHBarChart() { hBarChart.setOnChartValueSelectedListener(this); hBarChart.setDrawBarShadow(false); hBarChart.setDrawValueAboveBar(true); hBarChart.getDescription().setEnabled(false); // if more than 60 entries are displayed in the chart, no values will be // drawn hBarChart.setMaxVisibleValueCount(60); // scaling can now only be done on x- and y-axis separately hBarChart.setPinchZoom(false); // draw shadows for each bar that show the maximum value // mChart.setDrawBarShadow(true); hBarChart.setDrawGridBackground(false); //自定义坐标轴适配器,设置在X轴 DecimalFormatter formatter = new DecimalFormatter(); XAxis xl = hBarChart.getXAxis(); xl.setPosition(XAxis.XAxisPosition.BOTTOM); xl.setTypeface(mTfLight); xl.setLabelRotationAngle(-45f); xl.setDrawAxisLine(true); xl.setDrawGridLines(false); xl.setGranularity(1f); // xl.setAxisMinimum(0); xl.setValueFormatter(formatter); //对Y轴进行设置 YAxis yl = hBarChart.getAxisLeft(); yl.setTypeface(mTfLight); yl.setDrawAxisLine(true); yl.setDrawGridLines(true); yl.setAxisMinimum(0f); // this replaces setStartAtZero(true) // yl.setInverted(true); hBarChart.getAxisRight().setEnabled(false); //图例设置 Legend l = hBarChart.getLegend(); l.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM); l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT); l.setOrientation(Legend.LegendOrientation.HORIZONTAL); l.setDrawInside(false); l.setFormSize(8f); l.setXEntrySpace(4f); setHBarChartData(); hBarChart.setFitBars(true); hBarChart.animateY(2500); } /** * 初始化折线图控件属性 */ private void initLineChart() { lineChart.setOnChartValueSelectedListener(this); lineChart.getDescription().setEnabled(false); lineChart.setBackgroundColor(Color.WHITE); //自定义适配器,适配于X轴 IAxisValueFormatter xAxisFormatter = new XAxisValueFormatter(); XAxis xAxis = lineChart.getXAxis(); xAxis.setPosition(XAxis.XAxisPosition.BOTTOM); xAxis.setTypeface(mTfLight); xAxis.setGranularity(1f); xAxis.setValueFormatter(xAxisFormatter); //自定义适配器,适配于Y轴 IAxisValueFormatter custom = new MyAxisValueFormatter(); YAxis leftAxis = lineChart.getAxisLeft(); leftAxis.setTypeface(mTfLight); leftAxis.setLabelCount(8, false); leftAxis.setValueFormatter(custom); leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART); leftAxis.setSpaceTop(15f); leftAxis.setAxisMinimum(0f); lineChart.getAxisRight().setEnabled(false); setLineChartData(); } private float getRandom(float range, float startsfrom) { return (float) (Math.random() * range) + startsfrom; } @Override public void onValueSelected(Entry e, Highlight h) { } @Override public void onNothingSelected() { } private void setBarChartData() { ArrayList yVals1 = new ArrayList(); //在这里设置自己的数据源,BarEntry 只接收float的参数, //图形横纵坐标默认为float形式,如果想展示文字形式,需要自定义适配器, yVals1.add(new BarEntry(0, 4)); yVals1.add(new BarEntry(1, 2)); yVals1.add(new BarEntry(2, 6)); yVals1.add(new BarEntry(3, 1)); BarDataSet set1; if (mChart.getData() != null && mChart.getData().getDataSetCount() > 0) { set1 = (BarDataSet) mChart.getData().getDataSetByIndex(0); set1.setValues(yVals1); mChart.getData().notifyDataChanged(); mChart.notifyDataSetChanged(); } else { set1 = new BarDataSet(yVals1, "The year 2017"); set1.setDrawIcons(false); ArrayList dataSets = new ArrayList(); dataSets.add(set1); BarData data = new BarData(dataSets); data.setValueTextSize(10f); data.setValueTypeface(mTfLight);//可以去掉,没什么用 data.setBarWidth(0.9f); mChart.setData(data); } } /** * 设置水平柱形图数据的方法 */ private void setHBarChartData() { //填充数据,在这里换成自己的数据源 ArrayList yVals1 = new ArrayList(); yVals1.add(new BarEntry(0, 4)); yVals1.add(new BarEntry(1, 2)); yVals1.add(new BarEntry(2, 6)); yVals1.add(new BarEntry(3, 1)); BarDataSet set1; if (hBarChart.getData() != null && hBarChart.getData().getDataSetCount() > 0) { set1 = (BarDataSet) hBarChart.getData().getDataSetByIndex(0); set1.setValues(yVals1); hBarChart.getData().notifyDataChanged(); hBarChart.notifyDataSetChanged(); } else { set1 = new BarDataSet(yVals1, "DataSet 1"); set1.setDrawIcons(false); ArrayList dataSets = new ArrayList(); dataSets.add(set1); BarData data = new BarData(dataSets); data.setValueTextSize(10f); data.setValueTypeface(mTfLight);//可以去掉,没什么用 data.setBarWidth(0.5f); hBarChart.setData(data); } } /** * 设置折线图的数据 */ private void setLineChartData() { //填充数据,在这里换成自己的数据源 List valsComp1 = new ArrayList<>(); List valsComp2 = new ArrayList<>(); valsComp1.add(new Entry(0, 2)); valsComp1.add(new Entry(1, 4)); valsComp1.add(new Entry(2, 0)); valsComp1.add(new Entry(3, 2)); valsComp2.add(new Entry(0, 2)); valsComp2.add(new Entry(1, 0)); valsComp2.add(new Entry(2, 4)); valsComp2.add(new Entry(3, 2)); //这里,每重新new一个LineDataSet,相当于重新画一组折线 //每一个LineDataSet相当于一组折线。比如:这里有两个LineDataSet:setComp1,setComp2。 //则在图像上会有两条折线图,分别表示公司1 和 公司2 的情况.还可以设置更多 LineDataSet setComp1 = new LineDataSet(valsComp1, "Company 1 "); setComp1.setAxisDependency(YAxis.AxisDependency.LEFT); setComp1.setColor(getResources().getColor(R.color.light_blue)); setComp1.setDrawCircles(false); setComp1.setMode(LineDataSet.Mode.HORIZONTAL_BEZIER); LineDataSet setComp2 = new LineDataSet(valsComp2, "Company 2 "); setComp2.setAxisDependency(YAxis.AxisDependency.LEFT); setComp2.setDrawCircles(true); setComp2.setColor(getResources().getColor(R.color.red)); setComp2.setMode(LineDataSet.Mode.HORIZONTAL_BEZIER); List dataSets = new ArrayList<>(); dataSets.add(setComp1); dataSets.add(setComp2); LineData lineData = new LineData(dataSets); lineChart.setData(lineData); lineChart.invalidate(); } public static void startActivity(Context context) { Intent intent = new Intent(); intent.setClass(context, FifteenActivity.class); context.startActivity(intent); } }

1

2

3

4

5

6

7

8

9

10

11

12

Android笔记:MPAndroidChart使用

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

319

320

321

322

323

324

325

326

327

四、自定义适配器类

XAxisValueFormatter:

public class XAxisValueFormatter implements IAxisValueFormatter { private String[] xStrs = new String[]{"春", "夏", "秋", "冬"}; @Override public String getFormattedValue(float value, AxisBase axis) { int position = (int) value; if (position >= 4) { position = 0; } return xStrs[position]; }

1

2

3

4

5

6

7

8

9

10

11

12

MyAxisValueFormatter:

public class MyAxisValueFormatter implements IAxisValueFormatter { private DecimalFormat mFormat; public MyAxisValueFormatter() { mFormat = new DecimalFormat("###,###,###,##0.000"); } @Override public String getFormattedValue(float value, AxisBase axis) { return mFormat.format(value) + " $"; } } DecimalFormatter: public class DecimalFormatter implements IAxisValueFormatter { private DecimalFormat format; public DecimalFormatter() { format = new DecimalFormat("###,###,##0.00"); } @Override public String getFormattedValue(float value, AxisBase axis) { return format.format(value) + "$"; } }

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

五、自定义MarkerView

public class XYMarkerView extends MarkerView { private TextView tvContent; private IAxisValueFormatter xAxisValueFormatter; private DecimalFormat format; public XYMarkerView(Context context, IAxisValueFormatter xAxisValueFormatter) { super(context, R.layout.custom_marker_view); this.xAxisValueFormatter = xAxisValueFormatter; tvContent = findViewById(R.id.tvContent); format = new DecimalFormat("###.000"); } @Override public void refreshContent(Entry e, Highlight highlight) { tvContent.setText("x:" + xAxisValueFormatter.getFormattedValue(e.getX(), null) + ",y:" + format.format(e.getY())); super.refreshContent(e, highlight); } @Override public MPPointF getOffset() { return new MPPointF(-(getWidth() / 2), -getHeight()); } }

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

custom_marker_view:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

六、这里只实现了些基本功能,更多的API使用,请查看官方文档

官方文档:https://github.com/PhilJay/MPAndroidChart

MPAndroidChart中文文档-:https://download.csdn.net/download/android157/11188758

博客:https://blog.csdn.net/koma025/article/details/53886832

设置多组y值:https://blog.csdn.net/u011125199/article/details/52797439

修改源代码:https://blog.csdn.net/dt235201314/article/details/70142117

折线图设置文档:https://zhuanlan.zhihu.com/p/25672390

Android

版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:0基础如何转行自学软件测试
下一篇:C++编程经验(12):C++11新特性
相关文章