vue + v-charts 简单应用上手

第一步

1.安装v-charts

 

npm i v-charts -S

2.直接使用

 

export default {
  data () {
    return {
      chartData: {
        columns: ['日期', '余额', '比率'],
        rows: [
          { '日期': '1月1日', '余额': 123, '比率': 0.3 },
          { '日期': '1月2日', '余额': 1223, '比率': 0.6 },
          { '日期': '1月3日', '余额': 2123, '比率': 0.9 },
          { '日期': '1月4日', '余额': 4123, '比率': 0.12 },
          { '日期': '1月5日', '余额': 3123, '比率': 0.15 },
          { '日期': '1月6日', '余额': 7123, '比率': 0.20 }
        ]
      },
      chartSettings: {}
    }
  },

  components: { VeLine }
}

3.效果

vue + v-charts 简单应用上手_第1张图片

你可能感兴趣的:(前端基础,JavaScript)