vue3怎么使用echart，注册全局变量

在Vue3中使用ECharts，你需要先安装ECharts库和Vue-ECharts插件。以下是基本步骤：

1. **安装依赖**:
使用npm或yarn安装ECharts和vue-echarts：

   npm install echarts @vue/echarts-v3
   # 或者
   yarn add echarts @vue/echarts-v3

2. **引入并注册组件**:
在`main.js`或`App.vue`等合适的入口文件中引入ECharts，并在Vue原型上挂载echarts实例：

   import { ECharts } from '@vue/echarts-v3';
   
   Vue.prototype.$echarts = ECharts;

这样，你在任何一个Vue组件中都可以通过`this.$echarts`访问到ECharts实例。

3. **创建图表**:
在需要使用ECharts的地方，比如一个组件模板里：

   <template>
     <div id="chart" ref="myChart"></div>
   </template>

   <script>
   export default {
     setup() {
       const chartRef = ref(null);
       
       // 在 mounted 或其他合适钩子中初始化图表
       onMounted(() => {
         const myChart = this.$echarts.init(chartRef.value);
         // ...然后配置图表数据和选项...
         myChart.setOption({
           // ...配置项...
         });
       });
       
       return {
         chartRef
       };
     }
   }
   </script>

`ref`用于获取ECharts实例容器的实际DOM元素。

4. **更新图表数据**:
当数据变化时，只需更新图表的选项：

   onUpdated(() => {
     myChart.setOption({
       data: newData,
       // 更新其他选项...
     });
   })