uniapp安装echarts

UniApp是一个基于Vue.js的跨平台框架，它允许开发者编写一套代码，同时在iOS、Android、Web等多个平台上运行。要将ECharts集成到uniapp项目中，你可以按照以下步骤操作：

1. **安装依赖**:
首先，在uniapp项目的`package.json`文件中安装ECharts的uni-app版本，可以使用`npm`或`yarn`命令：

   npm install @vant/wechart echarts --save
   // 或者
   yarn add @vant/wechart echarts

使用Vant的WeChart封装版，因为它已经适配了uniapp环境。

2. **引入组件**:
在需要使用ECharts的地方，导入WeChart组件：

   <template>
     <view>
       <!-- ... -->
       <van-wechart :options="chartOptions" @onReady="onChartReady"></van-wechart>
       <!-- ... -->
     </view>
   </template>

   <script>
   import { WeChart } from '@vant/wechart';
   export default {
     components: {
       WeChart,
     },
     data() {
       return {
         chartOptions: {}, // 初始化图表配置
       };
     },
     methods: {
       onChartReady(chart) {
         // 图表加载完成后的回调，可以根据需要初始化数据
       }
     },
   };
   </script>

3. **配置图表选项**:
定义你的图表配置，例如饼图、柱状图等，然后在data里设置。比如创建一个简单的柱状图：

   data() {
     return {
       chartOptions: {
         options: {
           title: {
             text: '柱状图示例'
           },
           tooltip: {},
           xAxis: {
             data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
           },
           yAxis: {},
           series: [{
             name: '销量',
             type: 'bar',
             data: [5, 20, 36, 10, 10, 20]
           }]
         }
       }
     };
   }

4. **使用组件**:
现在你可以在模板中直接使用`<van-wechart>`标签，并传入上面设置的`chartOptions`。当页面渲染时，ECharts将会显示并响应数据变化。