本项目是基于开源项目MPAndroidChart进行鸿蒙化的移植和开发的,可以通过项目标签以及github地址( https://github.com/PhilJay/MPAndroidChart )追踪到原安卓项目版本
dependencies {
implementation fileTree(dir: 'libs', include: ['*.jar', '*.har'])
……
}
在sdk5,DevEco Studio2.1 beta3下项目可直接运行 如无法运行,删除项目.gradle,.idea,build,gradle,build.gradle文件, 并依据自己的版本创建新项目,将新项目的对应文件复制到根目录下
1.1 实例化LineChart类
//初始化Chart
LineChart chart = new LineChart(this);
1.2 按自己的需求为LineChart添加属性,例如:
//设置背景颜色
chart.setBackground(element);
// 不显示详细信息
chart.getDescription().setEnabled(false);
//设置网格辅助线在图表曲线的上方
chart.setDrawGridBackground(false);
1.3 初始化轴线
// 初始化x轴
XAxis xAxis;
xAxis = chart.getXAxis();
// 初始化y轴
YAxis yAxis;
yAxis = chart.getAxisLeft();
// 不启用右y轴
chart.getAxisRight().setEnabled(false);
// 设置轴线范围
xAxis.setAxisMaximum(20f);
xAxis.setAxisMinimum(0f);
yAxis.setAxisMaximum(60f);
yAxis.setAxisMinimum(0f);
1.4 导入想要绘制的数据,将其制作成折线图所需的LineData类实例,需要注意的是LineDataSet不仅是数据的集合,同时也包含一些绘制这些数据所需要的属性。
// 此处以float数组为例:
private float[] mDataPoints = new float[]{0,2,1,5,2,7,3,9,4,5,5,10,6,18,7,8,8,3};
private ArrayList<Entry> loadExternalData(float[] dataPoints){
int count = dataPoints.length;
ArrayList<Entry> values = new ArrayList<>();
for (int i = 0; i < count; i = i + 2){
values.add(new Entry(dataPoints[i], dataPoints[i + 1]));
}
return values;
}
private LineData setData(ArrayList<Entry> values) {
LineDataSet set1;
// 实例化LineDataSet
set1 = new LineDataSet(values, "随机数据");
// 添加绘制属性
set1.setDrawIcons(false);
// yellow lines and black points
set1.setColor(Color.YELLOW.getValue());
// line thickness and point size
set1.setLineWidth(1f);
set1.setCircleRadius(3f);
// draw points as solid circles
set1.setDrawCircleHole(false);
// customize legend entry
set1.setFormLineWidth(1f);
set1.setFormSize(15.f);
// text size of values
set1.setValueTextSize(9f);
// set the filled area
set1.setDrawFilled(true);
set1.setFillFormatter(new IFillFormatter() {
@Override
public float getFillLinePosition(ILineDataSet dataSet, LineDataProvider dataProvider) {
return chart.getAxisLeft().getAxisMinimum();
}
});
// 添加数据
ArrayList<ILineDataSet> dataSets = new ArrayList<>();
// add the data sets
dataSets.add(set1);
// create a data object with the data sets
LineData data = new LineData(dataSets);
return data;
}
ArrayList<Entry> values = loadExternalData(mDataPoints);
LineData data = setData(values);
1.5 实例化一个用于承载折线图的Component,将其canvas传入LineChart实例执行绘制任务,这样折线图就绘制在该canvas上了。
Component component = new Component(this);
Component.DrawTask drawTask = new Component.DrawTask() {
@Override
public void onDraw(Component component, Canvas canvas) {
chart.onDraw(canvas, data);
}
};
component.addDrawTask(drawTask);
与折线图绘制流程类似,感兴趣的可以参考entry模块中的BarChartExample。
v0.1.0-alpha
实现了折线图、直方图的绘制功能,尚不支持其它图的绘制。
尚不支持对图表的手势操控
尚不支持动画效果
MPChart_ohos经过Apache License, version 2.0授权许可.
Sign in to post a comment
Activity
Community
Health
Trend
Influence
:Code submit frequency
:React/respond to issue & PR etc.
:Well-balanced team members and collaboration
:Recent popularity of project
:Star counts, download counts etc.
Repository Comments ( 0 )