vue使用antv-G2

1、安装

npm install @antv/g2plot

2、页面中使用

• 首先引入

import {Chart} from '@antv/g2';

• 用div来放需要显示的图，id必须写

  <div id="liveVerifyModuleDom"></div>

• 在data中定义数据

  export default { 
      name: "test", 
      data() { 
          return { 
          // 现场验证-版本成功率 
          liveVerifyVersionData: [], 
          // 用于二次请求图会显示多个问题 
          liveVerifyVersionCharts: null, 
          } 
      } 
  }

• 调用接口获取数据

    // 获取搜索结果
      getSearchList() {
        this.$axios
            .get('/zentao/searchList', {
              params: {
                zentaosid: this.sessionID,
              }
            })
            .then(res => {
              if(res.status === 200){
               this.liveVerifyVersionData= JSON.parse(res.data.data).bugs
               // 调用绘制图的方法
              this.OpenLiv