vue3 ts echarts安装

要在Vue 3项目中使用echarts，您需要先安装echarts和vue-echarts的相关依赖。

首先，使用npm或者yarn安装echarts：

npm install echarts

或者

yarn add echarts

然后，安装vue-echarts：

npm install vue-echarts@^6.0.0-rc.1

或者

yarn add vue-echarts@^6.0.0-rc.1

接下来，在您的Vue组件中引入echarts和vue-echarts：

import { createApp } from 'vue';
import ECharts from 'vue-echarts';
import 'echarts/lib/chart/bar'; // 根据需要引入所需的图表类型

const app = createApp(App);
app.use(ECharts);
app.mount('#app');

现在，您可以在Vue组件中使用echarts了。例如，在一个组件中创建一个简单的柱状图：

<template>
  <div>
    <v-chart :options="chartOptions"></v-chart>
  </div>
</template>

<script>
export default {
  data() {
    return {
      chartOptions: {
        xAxis: {
          type: 'category',
          data: ['A', 'B', 'C', 'D', 'E', 'F', 'G'],
        },
        yAxis: {
          type: 'value',
        },
        series: [
          {
            data: [5, 20, 36, 10, 10, 20, 30],
            type: 'bar',
          },
        ],
      },
    };
  },
};
</script>

这样就完成了在Vue 3中使用echarts的安装和配置。请根据您的需求进行相应的配置和使用。