MPAndroidChart(柱状图,折线图等绘制)
程序员文章站
2022-04-21 22:32:25
...
MPAndroidChart(柱状图,折线图等绘制)
导入依赖,见github:https://github.com/PhilJay/MPAndroidChart
不能设置为wrapContent 要自己给个高度
根据自己的布局空间和实际业务中设置高度,他会根据你的高度自动设置比例显示
MPChartMarkerView 与 custom_marker_view.xml是设置在每个柱状条上方的一个标志
ArrowTextView 是设置为 带箭头的TextView
柱状图使用:
xml中:
<com.github.mikephil.charting.charts.BarChart
android:id="@+id/barChart1"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
在网络请求正确回传后设置
// 输入数据到图标中
// 这时会遇到 跳转其他界面再跳转回去 数据会再添加一遍 因此将之前的数据删除掉 再加 至于第一次无数据 用ArrayList的长度判断
// 若x或者yvalues 非空 则 将数据清空
if(!xValues.isEmpty()||!yValues.isEmpty()){
// 清空数据
xValues.clear();
yValues.clear();
}
initChartData();
setBarChart(barChart1,xValues,yValues,"",14, Color.argb(0xff, 0x00, 0xB2, 0xEE)); // 得用Color类 不能用R.color
barChart1即为与xml连接的,横坐标组,纵坐标组,表头,x坐标的字体大小,颜色值
initChartData
private void initChartData(){
// 获取并截取 七日前的日期
String sevendaysago = getOldDate(-7).substring(getOldDate(-7).indexOf("-")+1);
String sixdaysago = getOldDate(-6).substring(getOldDate(-6).indexOf("-")+1);
String fivedaysago = getOldDate(-5).substring(getOldDate(-5).indexOf("-")+1);
String fourdaysago = getOldDate(-4).substring(getOldDate(-4).indexOf("-")+1);
xValues.add(sevendaysago);
xValues.add(sixdaysago);
xValues.add(fivedaysago);
xValues.add(fourdaysago);
xValues.add("前天");
xValues.add("昨天");
xValues.add("今天");
yValues.add(salesTotal0);
yValues.add(salesTotal1);
yValues.add(salesTotal2);
yValues.add(salesTotal3);
yValues.add(salesTotal4);
yValues.add(salesTotal5);
yValues.add(salesTotal6);
}
setBarChar.java
// 柱形图
public static void setBarChart(BarChart barChart, List<String> xAxisValue, List<Float> yAxisValue, String title, float xAxisTextSize, Integer barColor) {
barChart.getDescription().setEnabled(false);//设置描述
barChart.setPinchZoom(true);//设置按比例放缩柱状图
//x坐标轴设置
IAxisValueFormatter xAxisFormatter = new StringAxisValueFormatter(xAxisValue);//设置自定义的x轴值格式化器
XAxis xAxis = barChart.getXAxis();//获取x轴
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);//设置X轴标签显示位置
xAxis.setDrawGridLines(false); //不绘制格网线
xAxis.setGranularity(1.0f);//设置x轴的底部的文字间距 最小间隔,防止当缩小时,出现标签重复。
xAxis.setValueFormatter(xAxisFormatter);
xAxis.setTextSize(xAxisTextSize);//设置标签字体大小
xAxis.setLabelCount(xAxisValue.size());//设置标签显示的个数
//y轴设置
YAxis leftAxis = barChart.getAxisLeft();//获取左侧y轴
leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);//设置y轴标签显示在外侧
leftAxis.setAxisMinimum(0f);//设置Y轴最小值
leftAxis.setDrawGridLines(false);
leftAxis.setDrawLabels(false);//禁止绘制y轴标签
leftAxis.setDrawAxisLine(false);//禁止绘制y轴
barChart.getAxisRight().setEnabled(false);//禁用右侧y轴
//图例设置
Legend legend = barChart.getLegend();
legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.CENTER);//图例水平居中
legend.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);//图例在图表上方
legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);//图例的方向为水平
legend.setDrawInside(false);//绘制在chart的外侧
legend.setDirection(Legend.LegendDirection.LEFT_TO_RIGHT);//图例中的文字方向
legend.setForm(Legend.LegendForm.SQUARE);//图例窗体的形状
legend.setFormSize(0f);//图例窗体的大小
legend.setTextSize(16f);//图例文字的大小
//legend.setYOffset(-2f);
//设置柱状图数据
setBarChartData(barChart, yAxisValue, title, barColor);
barChart.setExtraBottomOffset(10);//距视图窗口底部的偏移,类似与paddingbottom
barChart.setExtraTopOffset(10);//距视图窗口顶部的偏移,类似与paddingtop
barChart.setFitBars(true);//使两侧的柱图完全显示
barChart.animateX(300);//显示图标界面时 数据显示动画,从左往右依次显示
}
setBarChartData.java
/**
* 设置柱图
*/
private static void setBarChartData(BarChart barChart, List<Float> yAxisValue, String title, Integer barColor) {
ArrayList<BarEntry> entries = new ArrayList<>();
for (int i = 0, n = yAxisValue.size(); i < n; ++i) {
entries.add(new BarEntry(i, yAxisValue.get(i)));
}
BarDataSet set1;
if (barChart.getData() != null && barChart.getData().getDataSetCount() > 0) {
set1 = (BarDataSet) barChart.getData().getDataSetByIndex(0);
set1.setValues(entries);
barChart.getData().notifyDataChanged();
barChart.notifyDataSetChanged();
} else {
set1 = new BarDataSet(entries, title);
if (barColor == null) {
set1.setColor(ContextCompat.getColor(barChart.getContext(), R.color.tianLanSe));//设置set1的柱的颜色 这里得用R.color
} else {
set1.setColor(barColor);
}
ArrayList<IBarDataSet> dataSets = new ArrayList<>();
dataSets.add(set1);
BarData data = new BarData(dataSets);
data.setValueTextSize(10f); // 设置柱图上面的数字的大小
data.setBarWidth(0.6f); // 设置柱图的宽度
data.setValueFormatter(new MyValueFormatter());
barChart.setData(data);
}
}
上一篇: 「NOIP2004」合并果子
下一篇: 食色男女的冷幽默
推荐阅读
-
jQuery插件HighCharts绘制2D柱状图、折线图和饼图的组合图效果示例【附demo源码下载】
-
Python读取excel表格数据并绘制成柱状图 | 数据排序、柱状图颜色、标签乱码等问题通通能够解决!
-
jQuery插件FusionCharts绘制2D柱状图和折线图的组合图效果示例【附demo源码】
-
jQuery插件HighCharts绘制2D柱状图、折线图的组合双轴图效果示例【附demo源码下载】
-
jQuery插件HighCharts绘制2D柱状图、折线图和饼图的组合图效果示例【附demo源码下载】
-
MPAndroidChart(柱状图,折线图等绘制)
-
C# 绘制统计图大全(柱状图, 折线图, 扇形图)
-
Android绘制柱状图和圆形图以及折线图_安卓多种统计图表源码
-
C#绘制柱状图和折线图的方法