本文共 918 字，大约阅读时间需要 3 分钟。

在vue中添加echarts

1. 首先安装echarts到你的vue项目

 npm install echarts -s

2. 在main.js中引用echart

import echarts from 'echarts';Vue.use(echarts);

3. 新建一个vue文件，并创建一个dom

<template>//创建一个dom  <div id="main" style="width:100%;height:500px;"></div></template><script>//引入echartsimport echarts from "echarts";export default {      name: "chart",  data() {        return {    };  },  //表格渲染  mounted() {        this.drawLine();  },  methods: {         //绘制函数    drawLine() {           //根据刚才创建的dom实例化一个表格      var myChart = echarts.init(document.getElementById("main"));      //表格的各项参数设置      myChart.setoption = {            //横坐标        xAxis: {               type: 'category',           data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']        },        yAxis: {               type: 'value'        },        series: [{              data: [820, 932, 901, 934, 1290, 1330, 1320],          type: 'line'        }],      };   } }</script>

4.效果图：

转载地址：http://civg.baihongyu.com/