如何在vue框架中使用echarts绘制坐标图

1. 安装echarts

在vue项目中，可以通过npm安装echarts：

npm install echarts --save

2. 引入echarts

在vue项目中，可以在main.js中引入echarts：

import echarts from 'echarts'
Vue.prototype.$echarts = echarts

3. 创建echarts实例

在vue组件中，可以通过在mounted钩子函数中创建echarts实例：

mounted () {
  // 基于准备好的dom，初始化echarts实例
  const myChart = this.$echarts.init(document.getElementById('chart'))
  // 使用刚指定的配置项和数据显示图表
  myChart.setOption({
    title: {
      text: 'Echarts in Vue'
    },
    tooltip: {},
    xAxis: {
      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {},
    series: [{
      name: 'Sales',
      type: 'bar',
      data: [5, 20, 36, 10, 10, 20, 5]
    }]
  })
}

其中，`document.getElementById('chart')`是当前组件中一个div的id，用于指定echarts绘制的位置。

4. 绘制图表

通过setOption方法设置echarts的配置项和数据，实现图表的绘制。在上面的例子中，绘制了一个柱状图。可以根据需要设置不同的图表类型，以及相应的配置项和数据。