uniapp 使用l-echart的流程

在 UniApp 中使用 L-Echarts 可以通过以下几个步骤：

1. **安装依赖**：
首先，你需要在项目中引入 L-Echarts 插件。在UniApp项目的`package.json`文件中添加 L-Echarts 的依赖，可以通过 `uni-app-extension-install` 命令安装：

   uni-app-extension-install https://ext.dcloud.net.cn/happy-element/extension/l-echarts

或者手动导入到`vue.config.js`中，设置插件路径。

2. **引入组件**：
在 Vue 文件中，通过`import`语句引入 L-Echarts 组件：

   import { ECharts } from 'l-echarts/components';

3. **注册组件**：
注册组件以便在模板中使用：

   Vue.component('l-chart', {
     components: {
       ECharts
     },
     //...
   });

4. **配置图表**：
创建一个新的 Vue 组件，并使用 `<l-chart>` 标签来渲染图表。提供初始化配置和数据，比如 JSON 格式的数据：

   <template>
     <l-chart :options="chartOptions" />
   </template>

   <script>
   export default {
     data() {
       return {
         chartOptions: {
           title: {
             text: 'ECharts 示例'
           },
           // ...具体的图表配置项
         }
       };
     },
     //...
   };
   </script>

5. **动态更新**：
如果需要根据业务逻辑动态更新图表，可以监听数据变化并调用`setOption`方法更新选项。

6. **样式调整**：
L-Echarts 提供了自适应屏幕大小的能力，但也可能需要对样式进行一些微调，确保图表在不同设备上看起来良好。