vue中生成一个气泡图

在Vue中生成气泡图也可以使用ECharts库，以下是一个简单的示例代码：

首先，需要安装ECharts库：

npm install echarts --save

然后，在Vue组件中引入ECharts库并使用：

<template>
  <div class="chart"></div>
</template>
<script>
import echarts from 'echarts'

export default {
  mounted() {
    // 基于准备好的dom，初始化echarts实例
    const myChart = echarts.init(document.querySelector('.chart'))

    // 指定图表的配置项和数据
    const option = {
      title: {
        text: '气泡图示例'
      },
      tooltip: {},
      xAxis: {
        type: 'value',
        name: 'X轴'
      },
      yAxis: {
        type: 'value',
        name: 'Y轴'
      },
      series: [{
        // 指定类型为气泡图
        type: 'scatter',
        // 数据项数组，每个数据项都有 x、y、value 三个属性
        data: [
          [10.0, 8.04, 10],
          [8.0, 6.95, 12],
          [13.0, 7.58, 8],
          [9.0, 8.81, 14],
          [11.0, 8.33, 6],
          [14.0, 9.96, 10],
          [6.0, 7.24, 4],
          [4.0, 4.26, 2],
          [12.0, 10.84, 16],
          [7.0, 4.82, 6],
          [5.0, 5.68, 6]
        ]
      }]
    }

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option)
  }
}
</script>

以上代码会在Vue组件中生成一个简单的气泡图，并显示在页面上。你可以根据需要修改数据项、坐标轴等配置，来生成你想要的气泡图。