在vue模板中使用echarts实现一个图表

1.下载echarts模块

npm i cnpm install echarts --save

导入

在你想要使用echarts的页面里导入

import echarts from 'echarts'

使用

定义一个echarts容器

记得设置宽高

<div id="main" style="width: 600px;height: 400px;"></div>

实例化一个echarts对象

this.charts = echarts.init(document.getElementById('main'))

this.charts.setOption({
                    tooltip: {
                        trigger: 'axis'
                    },
                    legend: {
                        data: ['安全温度图']
                    },
                    grid: {
                        left: '3%',
                        right: '4%',
                        bottom: '3%',