vue3+ts 画echarts环形图表,vue-echarts是6.5.5版本,vue3是script setup 格式

好的，下面是使用 Vue3 + TypeScript + `vue-echarts` + `script setup` 画 echarts 环形图表的代码示例：

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

<script lang="ts" setup>
import { ref } from 'vue'
import * as echarts from 'echarts'

const options = ref({
  title: {
    text: '示例图表',
    left: 'center'
  },
  tooltip: {
    trigger: 'item',
    formatter: '{a} <br/>{b}: {c} ({d}%)'
  },
  legend: {
    orient: 'vertical',
    left: 10,
    data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
  },
  series: [
    {
      name: '访问来源',
      type: 'pie',
      radius: ['50%', '70%'],
      avoidLabelOverlap: false,
      label: {
        show: false,
        position: 'center'
      },
      emphasis: {
        label: {
          show: true,
          fontSize: '30',
          fontWeight: 'bold'
        }
      },
      labelLine: {
        show: false
      },
      data: [
        { value: 335, name: '直接访问' },
        { value: 310, name: '邮件营销' },
        { value: 234, name: '联盟广告' },
        { value: 135, name: '视频广告' },
        { value: 1548, name: '搜索引擎' }
      ]
    }
  ]
})

// 注册组件
import ECharts from 'vue-echarts'
const vChart = ECharts

// 导出组件选项
export default {
  components: { vChart },
  setup() {
    // 返回数据和方法
    return { options }
  }
}
</script>

使用 `script setup` 时，需要在 `<script>` 标签上添加 `lang="ts" setup` 属性，然后在 `setup()` 函数中返回组件选项。在 `setup()` 函数中可以使用 `ref()` 创建响应式数据，也可以使用 `import` 导入组件和库。