
【闲谈鸿蒙三方库】图表库@ohos/mpchart 原创
三方库背景
在鸿蒙应用开发场景中,同样会遇到很多场景,需要将复杂的数据转化为直观易懂的图表形式,如折线图、柱状图、饼图等,帮助开发者在电商、金融、健康等多种应用中高效、准确地展示数据趋势和统计信息。例如,在电商应用中,往往需要一些图表展示商品销量趋势,帮助用户了解热门商品;在金融应用中,也能通过一些图表呈现gu票走势,辅助用户做出投资决策。
mpchart是一个OpenHarmony/HarmonyOS的网络图片加载库。它主要对标安卓MPAndroidChart,提供线形图、柱状图、饼状图、蜡烛图、气泡图、雷达图、瀑布图等自定义图表库,简化了数据可视化的实现过程,提升了应用的用户体验和数据呈现效果。
开源代码地址:https://gitcode.com/openharmony-tpc/ohos_mpchart
快速上手方法
1.下载安装
当前稳定版本3.0.20
2.构建图表配置类
3.绑定图表数据
4.在组件/页面中使用对应的图表组件
更多功能展示
示例1 折线图
首先构建LineChartModel,内部包含数据data,然后使用LineChart自定义组件。
示例2 柱状图
首先构建BarChartModel,内部包含数据data,然后使用BarChart自定义组件。
示例3 饼图
首先构建PieChartModel,内部包含数据data,然后使用PieChart自定义组件。
实现原理
1.核心类关系
从上述例子来看,每种图表都对应分成了三个类:Chart组件,Model图表配置类,Data图表数据
2.核绘图流程
在Model的onDraw方法里,通过操作CanvasRenderingContext2D绘图。
局限性
1.该库作者核心逻辑是参考安卓MPAndroidChart移植,因此一些对象和接口设计上还保留了JAVA的风格。比如JArrayList类,就完全按照java的接口设计的容器类,不过这对java程序员倒是蛮友好。
2.图表配置Model类聚合了图表数据data类。这2个类参考MPAndroidChart设计的话也应该都是Chart的属性,不应该有聚合的关系,也不应该通过Model类来触发invalidate重新绘制。
结束语
随着越来越多的鸿蒙应用上线,各种开源的闭源的,开发者自发的和大厂贡献的库也正在逐步涌现出来,同时也有一些早期的库已被淘汰。今年我将抽空基于HarmonyOS 5.0+试试水,根据实际效果和下载量筛选在awesome-harmony-library,帮助大家快速找到合适的三方库,也请大家也帮忙Star下这个仓库:)
