uni-app 虽然号称一套代码多端运行，但很多 web 库是无法跨端的，图表就是一大痛点。这个工具库就是解决这样的问题。
封面图底图来自免费商用图库 Pixabay。
Uni ECharts 是一个专门为 uni-app 框架设计的 ECharts 图表组件，作者是来自成都的开发者 xiaohe0601，支持 TypeScript，核心目标是让开发者在多端环境中获得统一、高效的图表开发体验。
Uni ECharts 通过统一的 API 设计，实现了真正意义上的"一次编写，处处运行"，让开发者无需操心底层渲染差异，只需关注图表本身的配置与数据，在 Web、各平台小程序及 App 上获得一致的渲染效果。
实际上在 JavaScript 中图表的生态很成熟了，有很成熟的解决方案支持着各种数据大屏应用，各类酷炫图表展示自然不再话下。但在要跨端的话，就没那么简单了。
为了高效，国内开发小程序，甚至是对性能要求不算高的 APP 开发，都会考虑用 uni-app。我也是 uni-app 多年的老开发者了，图表展示的兼容性往往让开发者头疼。最大的问题是 web 端使用的 js 库里的 DOM、window 这样的 API，在小程序和 APP 都是不支持的，canvas 也一样，以前我只能用臃肿并且繁琐的 renderjs 来解决，不同平台间的差异可能导致代码重复、调试困难，最终影响开发效率和用户体验。
实际上哪怕我们不需要跨端，比如只在 APP 开发图，表也优先用 Uni ECharts，因为使用真的很简单，几乎和 Vue ECharts 有一模一样的开发体验。
安装与集成指南
Uni ECharts 支持 npm 和 uni-modules 两种方式安装，uni-app 项目的组件我一般都用 uni-modules，主要是支持 easycom 规范， 使用 uni-modules 方式什么都不用配置即可免导入直接使用组件，比较省心。
需要注意的是官方推荐使用 Vue 3.4.x，3.5 并未适配。
下面展示的是 uni-modules 方式，但 Uni ECharts 依赖 echarts，第一步还是要安装：
然后在 uni-app 插件市场下载 Uni ECharts，导入到 HbuilderX 中，会自动下载到 uni-app 项目的 uni-modules 目录
基本配置与使用
安装完成后，您可以在页面中使用 Uni ECharts 组件：
高级配置与优化
对于复杂场景，Uni ECharts 提供了丰富的配置选项：
使用建议
适用场景广泛，包括但不限于：
- 企业数据 dashboard 需要多端展示；
- 移动端数据报表与可视化；
- 跨平台小程序中的数据分析功能；
- 教育、金融等行业的移动端图表需求。
Uni ECharts 是一个免费开源的 JavaScript 项目，基于 MIT 许可发布，Uni ECharts 依赖的 echarts 也是免费开源的，我们可以自由地下载来使用，作者也在官网明确表示可以商用。